Các bước thực hiện như sau :
Tạo 1 ứng dụng (Application) trên facebook để lấy mã Unique ID.Bạn sẽ quản lý khung comment của bạn thông qua app mà bạn tạo này
-Đầu tiên các bạn truy cập vào địa chỉ này : http://developers.facebook.com/setup/
-Trong ô Create New App
-Trong ô Create New App
App name : Là tên ứng dụng bạn định tạo
App namespace : Cũng giống như tên tùy chỉnh của bạn ở facebook,App name space chính là địa chỉ để bạn truy cập vào ứng dụng của bạn, Điều kiện đặt tên của App namespace là không được có khoảng trống và không được chứa chữ số,là địa chỉ truy cập App nên cũng không được trùng với bất cứ người nào đã đăng kí Apps trước đó
Và địa chỉ truy cập App sẽ có dạng : http://apps.facebook.com/namespace
Bạn nhập thông tin chính xác về App cho tới khi nào 2 ô App name và App Namespace hiện thông báo valid và Available thì là được.
-Sau khi hoàn thành các bước trên, bạn nhấn Tiếp tục,nhập mã Captcha để xác nhận việc đăng ký và bấm Tiếp tục
Khi đã tạo được App thành công ,bạn truy cập vào địa chỉ sau để cài đặt app
Bạn chú ý vào AppID/API key, một vài bước nữa,bạn sẽ cần dùng tới nó để chèn vào code
Cài đặt các mục Display Name,App Domains và Site URL
Vậy là xong cái app facebook rồi,bây giờ vào blogger để chỉnh sửa code.
1. Vào phần Mẫu -> chỉnh sửa code HTML -> nhấp chọn mở rộng mẫu tiện ích.
2.Nhấn Ctrl + F để tìm đoạn code : <html
Chèn ngay sau nó đoạn code sau:
xmlns:fb='http://www.facebook.com/2008/fbml'
3. Bấm Ctrl+F để tìm đoạn : </head>
Chèn vào ngay sau nó đoạn code sau :
<meta property="fb:app_id" content="YOUR_APP_ID" />
YOUR_APP_ID : Thay đoạn này bằng App ID của App bạn vừa tạo ở bên trên
4.Bấm Ctrl + F để tìm đoạn code : <body>
Chèn vào ngay sau nó đoạn code sau :
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR APPLICATION ID HERE',
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>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR APPLICATION ID HERE',
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>
YOUR APPLICATION ID HERE : Thay đoạn này bằng App ID của App bạn vừa tạo ở bên trên
5.Bạn bấm Ctrl + F tìm trong HTML dòng code :
<b:include data='post' name='post'/>
Thêm vào sau nó đoạn code sau :
<b:if cond='data:blog.pageType == "item"'>
<style>
.appsmobilevnn
{
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border:1px solid #BBBBBB;
background-color:#F2F2F2;
-webkit-box-shadow: #B3B3B3 5px 5px 5px;
-moz-box-shadow: #B3B3B3 5px 5px 5px;
box-shadow: #B3B3B3 5px 5px 5px;
padding: 5px;
margin: 10px;
width:620px;
font-family: Arial, "Times New Roman", Tahoma, serif;
}
</style>
<p align='center'>
<div align='left' class='appsmobilevnn' style='background: #f2f2f2;'>
<font size='4'><strong>Bình luận</strong></font> <img src='http://1.bp.blogspot.com/-kqzDfhu8fEY/UORxzXXSKfI/AAAAAAAAFGY/aSdgVvhNaIk/s1600/comment.png'width='18px'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div><fb:comments expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='600'/></div><div align='right'><a href='http://appsmobilevnn.blogspot.com' target='blank'><small>[Fb Comment]</small></a></div></div></p></b:if>
<div><fb:comments expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='600'/></div><div align='right'><a href='http://appsmobilevnn.blogspot.com' target='blank'><small>[Fb Comment]</small></a></div></div></p></b:if>
-Phần giữa <style>....</style> là định dang CSS của form,nếu bạn không muốn thì có thể bỏ đi
-width='600' và background: #f2f2f2 là chiều rộng và màu nền của form comment,chỉnh lại cho phù hợp với site của bạn.
6.Save Template lại ! Xong phần code rồi
Để cài đặt Admin quản lý comment,các bạn vào đây :
Bạn vào phần Settings > Moderators > gõ tên bạn để thêm vào là Admin
Chúc các bạn thành công !
