Hướng dẫn chèn khung nhận xét Facebook đúng cách

Cách chèn khung nhận xét Facebook vào Blog rất đơn giản nhưng bạn đã biết chèn đúng cách chưa? Vậy thế nào mới gọi là đúng cách tức khi là khi chèn khung nhận xét bạn có thể cài đặt cho phép hoặc không cho phép nhận xét trong bài viết hay làm ẩn khung nhận xét trong cài đặt bài đăng nhận xét và chia sẻ.

Cập nhật: Hiện tại phiên bản SDK mới nhất có một số thay đổi, do đó khi chèn mã phải thêm style trực tiếp width:100% !important ngay dưới thẻ div của class fb-comments, khung iframe mới có chiều rộng Reponsive

Bạn tham khảo cách chèn khung nhận xét Facebook như mình hướng dẫn

Bước 1: Chèn script của Facebook trước thẻ đóng </body>

Copy


<div id='fb-root'/>

<script>

//<![CDATA[

(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 = 'https://connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v3.2&appId=app_Id&autoLogAppEvents=1';

    fjs.parentNode.insertBefore(js, fjs);

    js.async = true;

}(document, 'script', 'facebook-jssdk'));

//]]>

</script>

Thay app_Id bằng ID ứng dụng

Bước 2: Đăng ký thẻ data b:includable trong widget Blog1 ví dụ ngay bên dưới <b:includable id='comments' var='post'>..</b:includable>

Copy


<b:includable id='fbcomments' var='post'>

  <b:if cond='data:view.isSingleItem'>

    <b:if cond='data:post.allowComments'>

      <div id='fb-comments'>

        <div class='fb-comments' expr:data-href='data:blog.url.canonical' data-width='100%' data-numposts='5'/>

        <style>.fb_iframe_widget_fluid_desktop iframe[style]{width:100% !important}</style>

      </div'>

    </b:if>

  </b:if>

</b:includable>

Bước 3: Chèn thẻ b:include vào nơi bạn muốn hiển thị trong bài viết thường là ngay dưới post-body và trên post-footer

<b:include data='post' name='fbcomments'/>

Cài đặt nhận xét:

+ Nếu muốn ẩn nhận xét của bài viết trong bài viết cài đặt Không cho phép nhận xét của người đọc