Trước khi thêm Comments Facebook vào blog bạn phải ẩn comments mặc định của Facebook đi theo hình ảnh hướng dẫn bên dưới. Tuy nhiên mình sẽ có bài hướng dẫn để song song cả hai thể loại comments cùng 1 lúc
Bước 1 : Vào
Blogger >
Mẫu >
Chỉnh sửa HTML ( Nhớ lưu lại template trước khi thực hiện đề phòng thất bại thảm hại nha

)
Bước 2 : Chọn Mở rộng Mẫu Tiện Ích
Bước 3 : Tìm <html và thay thế nó bằng code sau (Nếu trong template cóxmlns:fb='http://www.facebook.com/2008/fbml' rồi thì bỏ qua bước này)
<html xmlns:fb='http://www.facebook.com/2008/fbml'
Bước 4 : Tìm thẻ
<body> và dán sau nó code bên dưới
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'APP ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
Bước 5 : Tìm thẻ </head> và dán trước nó đoạn code sau
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<meta content='Troll VL' property='og:site_name'/>
<meta content='Logo blog của bạn' property='og:image'/>
<meta content='APP_ID ' property='fb:app_id'/>
<meta content='http://www.facebook.com/huycovip' property='fb:admins'/>
<meta content='article' property='og:type'/>
- Thay những phần in đậm bằng các thông số của bạn
Bước 6 : Tìm thẻ
<b:include data='post' name='post'/>
Bước 7 : Dán sau đoạn code vừa tìm được code bên dưới
<b:if cond='data:blog.pageType == "item"'>
<div style='padding:0px 0px 0px 0px; margin:0px 0px 0px 0px;'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div> <fb:comments colorscheme='light' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='520'/></div></div>
</b:if>
- Bạn có thể light thay bằng Dark
- 520 là chiều rộng khung comments bạn sửa lại sao cho hợp lý với blog của mình
Bước 8 : Lưu lại template và vào thử một bài viết xem thành quả của mình nào
