Hiện nay, facebook có nhiều ứng dụng được
sử dụng rộng rãi trong việc xây dựng website. Một trong những ứng dụng đó là tạo
bình luận và quản lý comment trên trang cá nhân. Bạn có thể dùng tiện ích này để
áp dụng cho các blog nhất là blogspot.
 |
| Comment cho Facebook |
Để tạo tiện ích này cho website, bạn cần thực
hiện các công đoạn sau đây:
Công đoạn 1: Tạo APP trên facebook cho trang web
Bước 1:
- Đăng nhập trực tiếp link sau: https://developers.facebook.com/apps
- Click chọn Ứng Dụng à Tạo Ứng Dụng
 |
| Bước tạo ứng dụng |
Bước 2:
- Một hộp thư thoại (HTT) hiện ra, bạn
điền số điện thoại vào và click gửi mã xác nhận. (chú ý, bước này bạn nên nhập SDT
mạng Vina, mobiphone và viettel không thấy gửi mã xác nhận).
 |
| Bước Xác Nhận Thông Tin |
- Sau khi nhận được mã xác nhận, điền
thông tin và click gửi
Bước 3: Xuất hiện HTT, bạn điền thông
tin tương tự như hình bên dưới rồi click Tạo ứng dụng.
 |
| Bước khai báo thông tin |
Sau khi thành công bạn sẽ có giao diện
như hình sau:
 |
| Hình ảnh đăng ký thành công |
Bước 1: Đăng nhập blogspot à Mẫu à Chỉnh sửa HTML
Bước 2: Tìm đoạn code <html và thêm
ngay sau thẻ này code như hình bên dưới.
<html xmlns:fb='https://www.facebook.com/2008/fbml'
(2 đoạn code này cách nhau bằng dấu cách, nếu mẫu website của bạn đã có code này rồi thì bỏ qua bước này)
Bước 3: Thêm đoạn code sau dưới thẻ
<head>:
<meta content='26349695051194' property='fb:app_id'/>
Chú ý: 26349695051194 lấy từ id App của trang quản lý facebook
Bước 4: Chèn đoạn mã bên dưới trước thẻ
</body>
<div id='fb-root'/>
<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 = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<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 = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Bước 5: Tiếp tục chèn đoạn code bên dưới
lên trên thẻ đóng </head>
<script type='text/javascript'>
//<![CDATA[
var purl= location.href;
var fb_href = purl.substring(0,purl.indexOf(".html")+5);
var fbcm ='<div class="fb-comments" data-href="'+fb_href+'" data-num-posts="5" data-width="540"></div>';
//]]>
</script>
//<![CDATA[
var purl= location.href;
var fb_href = purl.substring(0,purl.indexOf(".html")+5);
var fbcm ='<div class="fb-comments" data-href="'+fb_href+'" data-num-posts="5" data-width="540"></div>';
//]]>
</script>
Chú ý:
- data-num-posts="5": Số comment sẽ hiển thị
- data-width="540": Chiều rộng khung comment
- data-width="540": Chiều rộng khung comment
Bước 6: Tìm một trong các đoạn code sau:
<b:include data='post' name='post'/>
Chèn mã sau vào ngay bên dưới code vừa tìm được:
<b:if cond='data:blog.pageType == "item"'>
<script type='text/javascript'>
document.write(fbcm);
</script>
</b:if>
<script type='text/javascript'>
document.write(fbcm);
</script>
</b:if>
Chú ý: Các bạn có thể chỉnh sửa màu sắc chữ hay khung màu nếu trùng với màu nền của blog. Nếu không có thể bỏ qua bước này.
- Dán đoạn code sau và trước thẻ ]]></b:skin>:
.comments-page {
background-color: #f2f2f2;
width:540px
}
#blogger-comments-page {
padding: 0px 5px;
display: none
}
.comments-tab {
float: left; padding: 5px;
margin-right: 3px;
cursor: pointer;
background-color: #f2f2f2
}
.comments-tab-icon {
height: 14px;
width: auto;
margin-right: 3px
}
.comments-tab:hover {
background-color: #eeeeee
}
.inactive-select-tab {
background-color: #d1d1d1
}
- Chỉnh sửa các màu tô đỏ sao cho phù hợp với trang web của bạnbackground-color: #f2f2f2;
width:540px
}
#blogger-comments-page {
padding: 0px 5px;
display: none
}
.comments-tab {
float: left; padding: 5px;
margin-right: 3px;
cursor: pointer;
background-color: #f2f2f2
}
.comments-tab-icon {
height: 14px;
width: auto;
margin-right: 3px
}
.comments-tab:hover {
background-color: #eeeeee
}
.inactive-select-tab {
background-color: #d1d1d1
}
Công đoạn 3: Quản lý comment trên
website
Bướ 1: Đăng nhập vào quản lý comment bằng bằng tài khoản facebook đã đăng ký với đường dẫn https://developers.facebook.com/tools/comments
 |
| Giao diện quản lý comment |
Bưới 2: Bạn muốn
comment nó thuộc bài viết nào thì bạn click sang Moderator View ==> click chuột vào
phần Visit Website để sang bài viết mà có comment đó.
Chúc các bạn thành công!
Chúc các bạn thành công!
Nguồn: www.ikhampha.com
Đúng bài viết mình cần tìm. Thanks AD nha. Trang của bạn rất hữu ích ^.^
Trả lờiXóa