Thứ Bảy, 12 tháng 11, 2016

Cách lấy code và chèn Comment Facebook vào website WordPress


Trào lưu dùng Facebook hiện nay ở Việt Nam có thể nói là phổ biến đến nỗi hầu như khái niệm Facebook đang dần đuổi kịp thương hiệu Google với những người dùng internet từ bình dân đến cao cấp. Vậy thì lợi ích từ Facebook đã quá rõ ràng, nếu chúng ta tận dụng được nó để cho những người dùng khác có thêm cơ hội quảng bá website của bạn trên đó thì quả là rất tuyệt vời vì hầu như mọi hoạt động của người dùng liên quan đến Facebook đều được lưu lại đầy đủ ở Activity Log.

Ngoài cách chèn các nút like Facebook vào website để tăng tính tương tác với những người dùng trên mạng xã hội thì chúng ta còn có một việc nữa để tận dụng sức mạnh của Facebook đó là sử dụng hệ thống comment của Facebook vào website để cho người khác có thể comment bài viết bằng tài khoản Facebook. Vậy ưu điểm của cách này là gì?

Ưu điểm của việc sử dụng hệ thống Facebook Comment


Người dùng có thể gián tiếp chia sẻ bài viết của bạn lên tường Facebook của họ.
Giúp họ tiện lợi trong việc comment mà không cần nhập thêm thông tin gì, rất có lợi cho người dùng bình dân.
Tương tác, khích lệ người dùng bằng hành động like.
Được tích hợp với hệ thống notification của Facebook nên họ dễ dàng theo dõi cuộc trò chuyện.
Không bị tình trạng spam blog WordPress quấy rầy.
Có thể kiểm duyệt comment, xóa comment và ban người dùng.
Có thể thêm nhiều quản trị để duyệt bình luận.
Thế nhưng, nó cũng có một chút các nhược điểm sau mà bạn cũng nên lưu ý khi dùng:

Trang quản lý comment hơi hạn chế.
Tình trạng Facebook bị chặn đôi khi cũng làm cản trở người comment.
Nếu quản lý không tốt, đó sẽ là cơ hội cho các spammer lộng hành.
Nhưng nếu suy nghĩ khách quan mà nói, thì việc chèn hệ thống Facebook Comment vào website/blog bạn sẽ nhận được nhiều lợi ích hơn là thiệt thòi, vì vậy nếu blog của bạn không thuộc lĩnh vực Webmaster thì có thể áp dụng vào ngay lúc này. Đừng lo lắng vì bạn vẫn muốn dùng hệ thống comment của WordPress vì vẫn có cách để bạn có thể áp dụng cả 2 hệ thống bình luận vào blog.

Lưu ý: Không nên làm trên Localhost vì nó sẽ không hoạt động trên localhost.

Tạo Facebook Apps


Để có thể quản lý được comment tại Facebook, bạn phải tiến hành kết nối comment form trên website vào cái Facebook Apps mà bạn đang có trên Facebook. Do vậy, bạn phải tạo một Facebook App và lấy hai thông tin quan trọng nhất là App ID và App Secret Key.

Cài đặt Facebook Comment cho website WordPress

Việc cung cấp thêm một nút Like hay một khung Comment vốn được Facebook thiết kế rất đẹp mắt và thân thiện vào website của bạn sẽ là một cách rất tốt để đưa website của bạn tới được một lượng lớn độc giả sử dụng mạng xã hội facebook và sẽ đem đến cho bạn một lương traffic không hề nhỏ.
Để thêm comment facebook vào website bất kỳ bạn làm theo hướng dẫn sau:

Đầu tiên bạn vào link: https://developers.facebook.com/ để tạo app. Trong lần đầu tiên vào link này có thể bạn sẽ được hỏi đăng ký là một developer, bạn cứ chọn nút register để đăng ký.
Sau đó bạn tìm nút sharing như hình dưới đây và click vào đó.


Bạn sẽ được dẫn đến trang tiếp theo, kéo chuột xuống dưới sẽ tìm thấy khu vực social plugin như hình vẽ dưới đây. Click vào nút Social Plugin.



Tiếp theo sẽ được dẫn đến trang tiếp theo với một loạt các lựa chọn như trong hình vẽ dưới đây, bạn có thể chọn app chèn like button, share button... trong hướng dẫn này chúng ta sẽ chọn option là comments.




Bạn truy cập vào địa chỉ https://developers.facebook.com/docs/plugins/comments và ấn nút Get Code phía dưới

Tại bước tiếp theo, bạn sẽ phải cung cấp 3 thông tin
- URL to comment on: bạn gõ trang web mà bạn muốn nhúng comment FB vào
- Width: bạn gõ độ rộng của đoạn comment muốn hiển thị (tính bằng px) ví dụ gõ số 500. 
- Number of Posts là số lượng comment hiển thị 
- Còn thông số Color Schema để thay đổi mầu sắc style của comment bạn có thể thử sau


Lấy code của Facebook Comment

 Bạn truy cập vào Giao diện (Appearance) ->Sửa (Editor) sau đó tìm file header.php và dán đoạn code sau vào giữa thẻ <head> và </head>

Bạn copy đoạn code thứ nhất dán vào website của bạn (trong file index.html hoặc index.php...) ngay sau thẻ .

- Chèn đoạn code dưới vào cuối hoặc vào vị trí bạn muốn đặt khung bình luận trong file comments.php hoặc file single.php (Nếu bạn muốn thay toàn bộ khung bình luận WordPress thì bạn xóa hết nội dung trong comments.php và thay đoạn code dưới vào) trong theme của bạn.

Sau đó ở phần App ID, bạn chọn cái App mà bạn đã tạo rồi copy đoạn code số 1 bỏ vào file header.php (đặt sau thẻ </head>).


Lưu ý 1:
Ngầm định facebook để comment dùng chung cho tất cả các bài viết. Nếu bạn muốn comment xuất hiện riêng cho từng bài viết thì bạn cần thay đổi tham số data-href trong đoạn code thứ 2, bạn phải chèn vào đây link đến bài viết cần comment chứ không phải là link của trang chủ. Trong hình ví dụ trên, bạn sẽ thay http://muathaoduoc.com/ bằng http://muathaoduoc.com/bai-viet-so-1.html trong đó bài viết số 1 là bài viết sẽ có comment.

Lưu ý 2:
Đây là version comment plug in mới nhất của facebook. Trước đây facebook dùng thêm tham số App ID để kiểm soát các comment nhưng với version này facebook đã bỏ chế độ kiểm soát đó đi giúp cho ứng dụng chạy nhanh hơn và không cần bảo mật giấu App ID nữa.

Nhớ thay APP ID thành App ID mà bạn lấy được từ App Facebook và USER ID là ID Facebook cá nhân để quản lý các bình luận. Bạn có thể lấy USER ID bằng cách truy cập địa chỉ http://findmyfbid.com và nhập link facebook cá nhân vào và ấn Find numeric ID, bạn sẽ thấy dãy số hiện ra đó chính là USER ID của bạn.

Đồng thời chèn code này vào bên dưới thẻ <head> và sửa APP ID thành App ID của bạn và USER ID là số ID của bạn trên Facebook (vào đây và thay "thamthuha" thành username của bạn trên Facebook để biết ID).

01 <meta property="fb:app_id" content="APP ID" />
02 <meta property="fb:admins" content="USER ID"/>

Chèn giống như hình dưới này.
Kế tiếp là chèn đoạn dưới đây vào file single.php hoặc comments.php (nếu có thì thay toàn bộ nội dung trong comments.php thành code dưới) trong theme của bạn.

01| <div class="fb-comments" data-href="<?php the_permalink(); ?>" data-numposts="20" width="100%" data-colorscheme="light" data-version="v2.3"></div>

Cuối cùng là xóa cache của website, truy cập vào https://developers.facebook.com/tools/debug và điền link website của bạn vào (ví dụ thamthuha.blogger.com) và ấn Debug rồi ấn nút Fetch new scrape information.

Hoàn Tất.

Giữ lại comment khi đổi domain/URL

Ở cách trên chúng ta sử dụng URL của bài viết để định danh cho mỗi khu vực bình luận, điều này có một lợi thế là khi bạn trả lời bình luận cho người dùng thì họ nhấp vào thông báo trên Facebook sẽ chuyển về đúng địa chỉ của trang bình luận.

Tuy nhiên có một bất cập là nếu bạn sửa lại đường dẫn của bài viết đó hoặc đổi domain thì toàn bộ comment sẽ mất hết vì không đúng cấu trúc URL định danh ban đầu. Nên nếu bạn có nhu cầu sử dụng Facebook Comment mà sau này không ảnh hưởng khi đổi URL/domain thì thay vì sử dụng thuộc tính data-href, chúng ta có thể sử dụng thuộc tính xid để thiết lập ID riêng cho post đó, và ID này có thể là ID của bài viết vì mỗi bài viết đều có một ID khác nhau, ID cũng sẽ không được đổi khi bạn sửa URL/domain.

Để giữ lại bình luận thì trong Bước 2 ở trên bạn dùng đoạn code này để thêm vào file comments.php hoặc single.php. Bạn chú ý nó sẽ khác với code trên ở đoạn bôi đỏ:

01| <div class="fb-comments" xid="<?php the_ID(); ?> data-numposts="20" data-colorscheme="light" data-version="v2.3"></div>

Đếm số bình luận cho bài viết


Nếu bạn cần lấy số bình luận của từng bài viết thì có thể bỏ đoạn này vào trong file single.php, bên trong loop nằm ở vị trí mà bạn cần hiển thị:

<span class="fb-comments-count" data-href="<?php the_permalink(); ?>"></span>

hoặc nếu dùng XID thì:

<span class="fb-comments-count" xid="<?php the_ID(); ?>></span>

Để quản lý comment, bạn truy cập vào https://developers.facebook.com/tools/comments

Chúc các bạn thành công

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

Đăng nhận xét