Apr 10, 2013

Tạo comment Facebook có thể quản lý được comment

Ở phần trước ( http://www.appsmobilevnn.com/2013/03/tao-comment-facebook.html ) các bạn đã có được cách tạo comment theo style Facebook,tuy nhiên làm theo cách này các bạn không thể quản lý được các nhận xét của người bình luận,vậy nên mình xin giới thiệu cách thứ 2 tạo bình luận theo dạng Facebook,có khả năng quản lý được.

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

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 DomainsSite 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>


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 == &quot;item&quot;'>
<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> &lt;img src=&#039;http://1.bp.blogspot.com/-kqzDfhu8fEY/UORxzXXSKfI/AAAAAAAAFGY/aSdgVvhNaIk/s1600/comment.png&#039;width=&#039;18px&#039;/&gt;
<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>

-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 !

Bình luận

 
Lên đầu trang