Cách chèn Facebook Fanpage vào trong sidebar của website

Xin chào các bạn, sau vài ngày bận rộn với nhiều kế hoạch mới, hôm nay Jam lại quay trở lại nhà và bật máy tính, chia sẻ với các bạn cách hiển thị fanpage của Facebook trên sidebar của website. Nó sẽ như thế này:

fanpage1

OKey, bây giờ cách làm cực kì đơn giản như sau:

Bước 1: Các bạn thêm đoạn mã sau vào dưới thẻ <Body> của website:

<div id="fb-root"></div>
<script>(function(d, s, id) {  var js, fjs = d.getElementsByTagName(s)[0];  if (d.getElementById(id)) return;  
js = d.createElement(s); js.id = id;  
js.src = "//connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v2.0";  
fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script>

Bước 2: Nhúng Fanpage của các bạn vào

Các bạn vào Admin > Giao diện > Widget và kéo phần Text vào trong sidebar rồi thêm đoạn code như hình:

fanpage2

Đoạn code đó như sau:

<div class="fb-like-box" 
data-href="ĐỊA CHỈ ĐƯỜNG DẪN ĐẦY ĐỦ CỦA FANPAGE" 
data-colorscheme="light" data-show-faces="true" 
data-header="true" data-stream="false" data-show-border="true">
</div>

* Các bạn lưu ý là nếu không dùng WordPress, hãy lấy mã trên rồi dán vào đâu bạn thấy thích đều được 😀

Trong đó có các thông số như sau:

+ data-href: Đây là nơi bạn cho địa chỉ đầy đủ của đường dẫn tới Fanpage của bạn nhé

+ data-colorscheme : Hiển thị dạng box màu trắng hoặc màu đen để các bạn phối màu cùng website, sẽ là “light” hoặc “dark”

+ data-show-faces: điền vào True nếu bạn muốn hiển thị danh sách người thích trong box, False nếu muốn ẩn

+ data-header: Nếu true, Box sẽ hiển thị tựa đề là “tìm chúng tôi trên Facebook” còn nếu False, header sẽ bị ẩn

+ data-stream: Nếu bạn muốn hiển thị danh sách bài đăng trên Fanpage

+ data-show-border: True nếu bạn muốn nó bo lại, nếu không bạn điền False

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

TÁC GIẢ:

Tôi là Jam, thâm niên 7 năm thiết kế website và làm SEO. Hãy theo dõi blog của tôi để nhận được nhiều chia sẻ thú vị xung quanh chủ đề công nghệ.

Có 10 bình luận !

  1. Xin chào bạn, bạn có thể cho mình hỏi chút
    mình chèn fanpage vào web wordpress bằng cách vào lấy code trang https://developers.facebook.com/docs/plugins/page-plugin sau đó dán vào Wiget văn bản nhưng không hiện lên (hình như trước đây mình làm như vậy là được) nhưng bây giờ không được

    thấy cách của bạn khác mọi người mình muốn thử nhưng mình không rõ là chèn code ở bước 1 (trước thẻ body) nó nằm ở file nào trong wordpress
    xin chỉ dẫn, cảm ơn

  2. Sao mình làm như bài hướng dẫn rồi nhưng khi vào website của mình thì nó chỉ báo mỗi nút Thích và Share, đã thế còn bị crop ko thấy hết. mặc dù mình không để Heigh và with
    Lỗi này là do sao ạ

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *