Thứ Tư, 22 tháng 5, 2013

Chèn khung Comment Facebook đơn giản cho Blogspot - Website


Hôm nay Thủ thuật blog sẽ giới thiệu thêm cho các bạn một cách đơn giản để thêm khung bình luận của Facebook vào blogger. Với khung commnet facebook này bạn có thể tận dụng được lượng độc giả rất lớn từ hơn 1 tỷ người dùng faceboobk trên toàn thế giới.
Hãy xem ảnh minh họa.

Xem demo: VIEW DEMO

» Một số ưu điểm của thủ thuật Comment Facebook đơn giản này.

  1. Không cần phải đăng ký và lấy Id trên facebook. Chỉ cần dùng URL blog của bạn là oke.
  2. Khắc phục chỉ hiển thị khi có 1 commnet của blogger với mẫu threadcommnet.

» Cách thêm khung Comment Facebook vào blog.

1- Đăng nhập vào blog
2- Chọn mẫu (Template)
3- Chọn chỉnh sửa HTML (Edit HTML)
4- Thêm đoạn mã bên dưới vào trước thẻ </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 = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
5- Tìm một trong các đoạn code như sau: 
- Đoạn 1:
<div class='post-footer'>
- Đoạn 2: 
<div class='post-footer-line post-footer-line-1'>
- Đoạn 3: 
<div class='post-footer-line post-footer-line-2'>
- Đoạn 4: 
<div class='post-footer-line post-footer-line-3'>
Lưu ý: mỗi đoạn cod trên đều có 2 đoạn giống hệt nhau và chỉ có 1 đoạn có tác dụng thôi nha.

- Dán ngay vào sau một trong các đoạn code cừa tìm được đoạn code sau:
<div class="fb-comments" data-href="http://thu-thuatblog.blogspot.com//" data-width="470" data-num-posts="10"></div>
Trong đó:
  • Thay http://thu-thuatblog.blogspot.com/ thành địa chỉ blog của bạn.
  • data-width="470" là chiều rộng của khung nhận xét facebook.
  • data-num-posts="10" Là số comment sẽ hiển thị trên khung nhận xét.

Note: Ngoài ra bạn cũng có thể dán code trên vào tiện ích HTML/Javarscrip ngay dưới bài đăng của bạn.

» Để thêm vào web site!

- Để thêm vào web site bạn dán file script vào giữa 2 thẻ <body>---</body>

Không có nhận xét nào:

Đăng nhận xét