Thêm Pop Out Facebook, Google+, Twitter cho blogspot (Blogger)

Facebook, Google và Twitter là 3 mạng xã hội lớn nhất hiện và hầu hết các Blog/Website đều gắn các nút mạng xã hội này hoặc họ gán các Group (hay Page) này lên trực tiếp lên các Site. Múc đích nhất là “Nhận được một lượng lớn traffic” từ các mạng xã hội này.

Nhưng việc thêm các Group (hay Page) này vào Blog/Website của bạn nó lại chiếm quá “nhiều diện tích”. Chính vì đều này mà hôm nay Windows2it sẽ hướng dẫn cho các bạn thêm các Group (hay Page) này vào Site của bạn chiếm 1 một diện tích nhỏ nhất mà vẫn dữ được “tính năng” của nó. Thủ thuật này có tên POP OUT DẠNG TRƯỢT

Đọc thêm:

● Popup hiển thị like box của Fanpage facebook trên Blogspot (blogger) Mặc định và cài thời gian

● Thêm hộp tìm kiếm kết hợp với các nút mạng xã hội Version Pro

● "Loại bỏ" JavaScript và CSS chặn hiển thị tăng tốc độ Load của blogspot (blogger)

☼ Cách tiến hành:

Chỉ cần chèn đoạn mã sau đây vào một Widget HTML/Javascript là Oke

Đầu tiên bạn vào Blog => Bố cục => Thêm tiện ích => HTML/JavaScript và dán đoạn mã code dưới đây vào và Lưu lại.

1. Code đối với mạng xã hội Facebook

<style type="text/css">
#fbplikebox {
    display: block;
    padding: 0;
    z-index: 99999;
    position: fixed;
    background: #ffffff;
}

.fbplbadge {
    background-color: #3B5998;
    display: block;
    height: 150px;
    top: 40%;
    margin-top: -55px;
    position: absolute;
    left: -47px;
    width: 47px;
    background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyaPv0LymJTdVVJNMkj1Ilv3dl9tNhhKLsSD_IfOwCRYWkUfmou0YRk2T6zR-Wj86PVOEKh9bW-vKS9_d2_m_2kLsY4htmGcPgeC6S-9ebRO5N7wFhHKCxbDNOSX1W1-5qvRHbJj1S1V8/s1600/vertical-right.png");
    background-repeat: no-repeat;
    overflow: hidden;
    -webkit-border-top-left-radius: 8px;
    -webkit-border-bottom-left-radius: 8px;
    -moz-border-radius-topleft: 8px;
    -moz-border-radius-bottomleft: 8px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}
</style>
<script type="text/javascript">
/*<![CDATA[*/
    (function(w2b){
        w2b(document).ready(function(){
            var $dur = "medium"; // Duration of Animation
            w2b("#fbplikebox").css({right: -250, "top" : 100 })
            w2b("#fbplikebox").hover(function () {
                w2b(this).stop().animate({
                    right: 0
                }, $dur);
            }, function () {
                w2b(this).stop().animate({
                    right: -250
                }, $dur);
            });
            w2b("#fbplikebox").show();
        });
    })(jQuery);
/*]]>*/
</script>
<br />
<div id="fbplikebox" style="display: none;">
<div class="fbplbadge">
</div>
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/VNuento&amp;width=250&amp;height=250&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23C4C4C4&amp;stream=false&amp;header=false" style="border: none; height: 250px; overflow: hidden; width: 250px;"></iframe>
</div>  

Read more »