Top Ad unit 728 × 90

Tạo popup facebook like page cho blogspot


Mọi blogger chúng ta ai cũng muốn blog mình được nhiều người biết đến và một cách hiệu quả nhất hiện nay đó chính là mạng xã hội facebook. Khi thiết kế blog, thông thường chúng ta tạo đồng thời một facebook fan page cho blog của mình, và trên blog chúng ta có để một nút like page, tuy nhiên nút like page có vẻ khá nhỏ và không thu hút người truy cập bấm nút like. Ở bài viết này mình xin hướng dẫn các bạn tạo ra một popup like facebook page rất bắt mắt và ấn tượng đảm bảo lượt like fan page của các bạn tăng nhanh chóng !

Vào Layout > Add a Gadget > Chọn HTML/JavaScript sao đó paste đoạn code dưới đây vào và Save lại

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
<style>
#fbox-background {
    display: none;
    background: rgba(0,0,0,0.8);
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
}

#fbox-close {
    width: 100%;
    height: 100%;
}

#fbox-display {
    background: #eaeaea;
    border: 5px solid #828282;
    width: 340px;
    height: 230px;
    position: absolute;
    top: 32%;
    left: 37%;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

#fbox-button {
    float: right;
    cursor: pointer;
    position: absolute;
    right: 0px;
    top: 0px;
}

#fbox-button:before {
    content: "CLOSE";
    padding: 5px 8px;
    background: #828282;
    color: #eaeaea;
    font-weight: bold;
    font-size: 10px;
    font-family: Tahoma;
}

#fbox-link,#fbox-link a.visited,#fbox-link a,#fbox-link a:hover {
    color: #aaaaaa;
    font-size: 9px;
    text-decoration: none;
    text-align: center;
    padding: 5px;
}
</style>
<script type='text/javascript'>
//<![CDATA[
jQuery.cookie = function (key, value, options) {
// key and at least value given, set cookie...
if (arguments.length > 1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);
if (value === null || value === undefined) {
options.expires = -1;
}
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}
value = String(value);
return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
// key and possibly options given, get cookie...
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_facebook_box') != 'yes'){
$('#fbox-background').delay(5000).fadeIn('medium');
$('#fbox-button, #fbox-close').click(function(){
$('#fbox-background').stop().fadeOut('medium');
});
}
$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 });
});
</script>
<div id='fbox-background'>
<div id='fbox-close'>
</div>
<div id='fbox-display'>
<div id='fbox-button'>
</div>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?
href=https://www.facebook.com/Blogger-Việt-1031043830263298&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'
style='border: none; overflow: hidden; background: #fff; width: 339px; height: 200px;'></iframe>
<div id="fbox-link">Powered by <a style="padding-left: 0px;" href="http://www.bloggerviet.tk/" rel="nofollow">Blogger Việt</a></div>
</div>
</div>
Các bạn thay đổi các giá trị:
Giá trị 5000 màu đỏ là popup xuất hiện sau 5s khi blog load xong.
Giá trị 7 màu xanh lá là số ngày popup xuất hiện lại khi truy cập blog (tránh gây phiền cho người truy cập blog thường xuyên).
URL màu xanh dương bạn thay thế là URL facebook page của các bạn nhé.

MỞ RỘNG:
Nếu các bạn muốn popup chỉ xuất hiện ở trang chủ của blog thì các bạn làm như sau:
Vào Template > Edit HTML > tìm thẻ  </body> paste code sau lên trước nó

&lt;b:if cond='data:page.type == "index"'&gt;PASTE CODE FACEBOOK POPUP VAO DAY &lt;/b:if&gt;
OK, vậy là bạn đã tạo cho mình một popup facebook like page ấn tượng cho blog của mình, chúc các bạn thành công !
Tạo popup facebook like page cho blogspot Reviewed by Unknown on 17:50 Rating: 5
All Rights Reserved by Blogger Việt © 2014 - 2015
Powered By Blogger, Sweetheme Designed by Tran Vu Thanh Huy

Biểu mẫu liên hệ

Tên

Email *

Thông báo *

Được tạo bởi Blogger.