[Blogger Tips] Hướng dẫn cách tạo, thêm hộp like (Like box) đẹp cho blogspot chuyên nghiệp

Như các bạn đã biết Facebook hiện nay cùng thịnh hành, nó đã và đang trở thành một kênh quảng bá cực kỳ quan trọng trong chiến  dịch SEO và quảng cáo cho trang web cũng như blog của bất kỳ một webmaster nào. Việc tạo một fanpage và  quảng bá chúng là một việc đương nhiên phải đặt lên ưu tiên hàng đầu. Với lượng người dùng Facebook hiện tại trong nước cũng như trên thế giới thì chẳng mấy chốc, website của bạn sẽ được đánh giá hàng đầu. 

Thêm một hộp like Fanpage vào trang web của chính bạn sẽ làm cho trang web của bạn trở nên chuyên nghiệp hơn, thân thiện hơn, và hơn hết là chiến dịch quảng bá của bạn sẽ thành công, Những khách quan tâm họ sẽ có một nơi để cập nhật những tin tức quan trọng nhất của bạn và tham gia thảo luận cùng nhau.

Hiện tại thì Facebook cũng cho phép chúng ta tạo một hộp like bằng chương trình develop của họ. Tuy nhiên thì hộp like mặc định đó lại khá đơn giản và không thể tùy biến được. Vậy hôm nay mình sẽ hướng dẫn các bạn tự tạo và tùy biến một hộp like facebook đẹp và phù hợp với nhãn quan của riêng bạn.

Bắt đầu thôi:

Bước 1: Các bạn đăng nhập vào Blogger, sau đó chọn Bố cục (layout)  rồi chọn thêm Widget.

Bước 2: Các bạn chọn wiget loại HTML and JAVASCRIPT nha.

Bước 3: Các bạn chọn một trong những đoạn code dưới đây và dán chúng vào Widget mà các bạn vừa tạo. 

Lưu ý là trong đoạn code các bạn thay:  DoanThieuDaBlog bằng tên fanpage của các bạn nhé, nó chính là đoạn sau trong địa chì fanpage của bạn:  https://www.facebook.com/DoanThieuDaBlog

Bước 4: Lưu lại và thưởng thức. Các bạn chú ý là nếu các bạn biết về code thì có thể chính sửa chiều cao, chiều rộng và thậm chí là thay nền cho hộp like nếu các bạn có hình vừa ý nhé.

Kiểu 1

Code:

-----------------------------------------------------------------------------
<div style="background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWq03-0OM18ZlkESq2DWeGBThWlMcnTHxZDenbLKTHklHlRth9pzIlEyoHheGJ77PKnhFHmkihSnWyIwmOSb1QD_0H4yPOoeqqxN8-6Ttasgx6nJubhygaLpKNc8G3HezzI7yNBC_byhqH/s1600/fan-01-pic.png');overflow:hidden;border-radius: 110px;.height:250px;width: 238px;border-radius: 0px 13px 0px 0px;overflow: hidden;"><div style="height: 250px; overflow: hidden;"><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FDoanThieuDaBlog&amp;width=250&amp;
height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowtransparency="true"></iframe>

</div>
</div>

-----------------------------------------------------------------------------
 Kiểu 2

Code:


-----------------------------------------------------------------------------
<div style="background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-ixj9WK6SVCWMggBtY0OkBHrX9eit_lPjn_KnXk58Quk8uFnMp2WRmz-sbVHnhpcuNFTtrsvMhulR5z0SQ7puf2NWzgIeWxunbBV-gO8tV2C5ajRCxoNp-Cd4xBRnUX-7FrpeboTS91J4/s1600/fan-02-pic.png');overflow:hidden;border-radius: 110px;.height:250px;width: 238px;border-radius: 0px 13px 0px 0px;overflow: hidden;"><div style="height: 250px; overflow: hidden;"><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FDoanThieuDaBlog&amp;width=250&amp;
height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowtransparency="true"></iframe>


</div>


</div>-----------------------------------------------------------------------------
Kiểu 3

Code:

-----------------------------------------------------------------------------
<div style="-moz-box-shadow: 0px 15px 20px 0px #777777; -webkit-box-shadow: 0px 15px 20px 0px #777777; background-color: #f4f4f4; border-radius: 15px; border: 1px solid #CCCCCC; box-shadow: 0px 15px 20px 0px #777777; height: 270px; margin: 30px; padding: 10px 0 10px 10px; width: 250px;"><div style="height: 250px; overflow: hidden;"><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FDoanThieuDaBlog&amp;width=250&amp; height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowtransparency="true"></iframe>


</div></div>

-----------------------------------------------------------------------------
Hướng dẫn thay ảnh nền.

Các bạn lưu ý là ở Đoạn code 1 và 2 các bạn cũng có thể thay đổi ảnh nền của hộp like bằng chính hình ảnh của mình nhé, các bạn tự tạo một hình ảnh hoặc tải ảnh dưới đây về, sau đó tùy biến và up lên blogspot của bạn. Tiếp đó bạn lấy đường link và dán vào đoạn code mình bôi màu đỏ nhé

Chúc các bạn thành công.

Bài viết được sưu tầm và chỉnh sửa code cho phù hợp bởi:  Đoàn Thiếu Da