Hướng dẫn thêm bình luận Google và Facebook vào website

Bài này mình sẽ hướng dẫn các bạn chèn bình luận của Google và Facebook vào website, việc chèn nó vào website rất đơn giản.

Bình luận của Google

Chèn bình luận vào nơi bạn muốn, có thể là dưới chân bài viết

<script src="https://apis.google.com/js/plusone.js"></script>
<div id="comments"></div>
<script>
gapi.comments.render('comments', {
    href: window.location,      // Tự động lấy đường dẫn hiện tại của bài viết
    width: '624',               // Độ rộng của khung bình luận
    first_party_property: 'BLOGGER',
    view_type: 'FILTERED_POSTMOD'
});
</script>

Nếu muốn đếm số lượng bình luận:

<g:comments>: <g:commentcount href="[URL]"></g:commentcount>

[URL]: bạn chèn đường dẫn bài viết muốn đếm

Nếu muốn chỉnh độ cao khung bình luận, bạn chèn CSS sau:

.parent {
   position: relative;
   height: 240px;
   overflow: hidden;
}

Bình luận Facebook

1 ID App Facebook ( mục đích để quản lý bình luận, thống kê)

Link tạo ID App Facebook: https://developers.facebook.com/apps/

Bước 1: Chèn đoạn mã ở trước phần </body>

<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 = 'https://connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v2.12&appId=612083462568292&autoLogAppEvents=1';
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Ví dụ: ID App của mình ở đây là: 612083462568292. Bạn thay ID ứng dụng của bạn vào ở đoạn mã trên. Cách lấy ID của Facebook cá nhân admin thì vào https://findmyfbid.com/

Bước 2: Chèn đoạn mã html vào nơi bạn muốn ví dụ: phía dưới bài viết

<div class="fb-comments" data-href="https://developers.facebook.com/docs/plugins/comments#configurator" data-width="100%" data-numposts="50"></div>

1. data-numposts="50" thay 50 bằng số lượng bình luận muốn hiển thị
2. data-href="XXXX" thay XXXX là đường dẫn của bài viết
3. data-width="100%" thay 100% là độ rộng của khung bình luận

Có 2 cách để bạn chèn Comment Facebook vào trang Blogger, đầu tiên bạn hãy vào https://www.blogger.com/  -> Chọn Blog muốn chèn > Menu Mẫu -> Chỉnh sửa HTML và làm theo các cách sau:

Cách 1: Thêm mã code sau ngay dưới thẻ <b:include data=’post’ name=’post’/>

Để tìm thẻ trên bạn click chuột vào khu vực thẻ nhấn tổ hợp phím Ctrl+F sẽ bôi vàng vị trí này bạn hãy chèn vào dưới thẻ được bôi vàng đoạn code sau:

1 2 3

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div class="fb-comments" expr:data-href="data:post.canonicalUrl" data-width="640" data-numposts="5" data-colorscheme="light"></div> </b:if>

 Cách 2: Thêm mã doe này vào sau thẻ </div> của đoạn thẻ <div class=’post-footer’>

Vẫn thực hiện Ctrl+F để tìm <div class=’post-footer’> và kéo xuống tìm thẻ đóng của nó là </div> và chèn vào đoạn code này

1 2 3

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div class="fb-comments" expr:data-href="data:post.canonicalUrl" data-width="640" data-numposts="5" data-colorscheme="light"></div> </b:if>

Sau đó chọn Lưu mẫu và kiểm tra kết quả nếu trả về kết quả như hình 02 dưới đây là OK