Chèn fanpage facebook vào blogspot 2016

Lưu ý: Nên xem và thực hiện theo video để không phải gặp vấn đề về các bản cập nhật của Facebook nhé các bạn! Admin - Lê Vương Nam (thông báo ngày 26/10/2016).

Trong bài này mình sẽ hướng dẫn các bạn chèn fanpage vào blogspot (blogger) với nhiều lựa chọn ở phần hiển thị:
  • Chỉ bao gồm tiêu đề và ảnh bìa. Thích hợp cho sidebar có kích thước nhỏ.
  • Tiêu đề, ảnh bìa và bạn bè (phổ biến nhất)
  • Tiêu đề ảnh bìa, bạn bè và bài viết (không khuyến cáo)
  • Tiêu đề, ảnh bìa và sự kiện (ít được sử dụng).
Cách thực hiện như trong video sau đây nhé:


Bước 1: Chọn mẫu -> chỉnh sửa html -> chèn đoạn code dưới đây vào sau thẻ <body> -> lưu mẫu

<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&amp;version=v2.5";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Bước 2: Chọn bố cục -> thêm tiện ích -> HTML/Javascript -> Đặt tên trong phần tiêu đề -> phần nội dung copy một trong những lựa chọn sau theo nhu cầu của bạn.

Hiển thị tiêu đề và ảnh bìa

<div class="fb-page"
  data-href="https://www.facebook.com/facebook"
  data-width="380"
  data-hide-cover="false"
  data-show-facepile="false"
  data-show-posts="false"></div>

Lưu lại và xem kết quả như hình
chen-fanpage-facebook-vao-blogspot-2016

Tiêu đề, ảnh bìa và bạn bè (phổ biến nhất)

<div class="fb-page"
  data-show-facepile="true"
  data-href="https://www.facebook.com/facebook"
  data-width="380"
  data-hide-cover="false"></div>

Lưu lại và xem kết quả như hình

chen-fanpage-facebook-vao-blogspot-2016-1


Tiêu đề, ảnh bìa, bạn bè và bài viết

<div class="fb-page"
  data-tabs="timeline,events,messages"
  data-href="https://www.facebook.com/facebook"
  data-width="380"
  data-hide-cover="false"></div>

Lưu lại và xem kết quả như hình

chen-fanpage-facebook-vao-blogspot-2016-2


Tiêu đề, ảnh bìa và sự kiện

<div class="fb-page"
  data-tabs="events"
  data-href="https://www.facebook.com/facebook"
  data-width="380"
  data-hide-cover="false"></div>

Lưu lại và xem kết quả như hình

chen-fanpage-facebook-vao-blogspot-2016-3

Ghi chú:
  • Thay https://www.facebook.com/facebook bằng link fanpage của các bạn
  • Chỉnh sửa độ rộng bằng cách thay đổi thông số 380 ở đoạn data-width
  • Chỉnh sửa độ cao (nếu cần) bằng cách thêm data-height="380" vào sau data-width="380"
Lưu ý: Những bạn đã hiện được fanpage trên blog nhưng không bỏ được phần hiển thị bài viết thì chỉ cần tìm đến đoạn code data-tabs="timeline" và xóa nó đi (bạn để code hiển thị facebook ở sidebar nào thì tìm ở đó).

Nếu gặp khó khăn hoặc lỗi, các bạn hãy để lại yêu cầu ở comment (không để lại link), mình sẽ hỗ trợ trong thời gian sớm nhất.

5 comments:

  1. Sao bạn không đổi địa chỉ fanpage thử nó có ra giống như họ, còn để y chèn như bạn thì quá dễ, nhưng tiếc thay không phải của mình.

    ReplyDelete
  2. Mục đích cuối cùng của mình đó là Chia Sẻ cách chèn fanpage vào blog. Mình không tìm thấy được lý do nào để mình phải làm cho nó theo một cách khó.

    ReplyDelete
  3. Cảm ơn anh em đã làm thành công :)

    ReplyDelete