Thêm khung bình luận facebook vào wordpress không cần plugin

Để thêm khung bình luận facebook vào website wordpress thì có rất nhiều plugin hỗ trợ, chỉ cần mất 1 vài phút để cài plugin vào và bạn đã có 1 khung bình luận facebook hoàn chỉnh rồi, nhưng vấn đề là khi dùng quá nhiều plugin cho một website thì tốc độ tải trang sẽ bị chậm lại. Bài viết dưới đây sẽ hướng dẫn step by step cho bạn cách tự thêm khung bình luận facebook vào website mà không cần plugin. Lời khuyên của tác giả dành cho bạn là hạn chế dùng plugin cho website của mình để cải thiện tốc độ tải trang nhé.

Thêm khung bình luận facebook vào website wordpress

Bước 1: Đăng ký Facebook App

Bạn vào website https://developers.facebook.com/ click vào My Apps và tạo
bấm nút Add a New Apps, mỗi website bạn nên tạo riêng 1 apps để dễ quản lý và theo dõi thông tin về sau, không nên dùng chung app cho nhiều website bạn nhé.
thêm khung bình luận facebook vào website.
Một popup hiện lên, bạn bấm chọn Website. Sau đó bạn chọn Skip and Create App ID ở góc cao bên phải và điền đầy đủ thông tin
Và kết quả là ta có 1 cái Facebook Apps, nhớ copy App ID, sẽ cần dùng ở bước 2 và 3 bạn nhé.

Chi tiết cách tạo Facebook Apps

Các bạn có thể tham khảo bài viết này: http://www.bchiase.com/2016/06/tich-hop-comment-facebook-vao-blogger.html

Bước 2: Chỉnh sửa file header.php

Đầu tiên bạn vào Appearance > Editor, chọn file header.php, dán đoạn code sau vào ngay dưới thẻ <body>, nhớ điền App ID của bạn vào nhé.

<!-- Facebook JavaScript SDK -->
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'thay bang App ID ban vua tao', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
<!-- End Facebook JavaScript SDK -->

Tiếp theo, dán đoạn code dưới đây vào giữa 2 thẻ <head>…</head>, đừng quên thay thế App ID của bạn vào nhé, sau đó bấm lưu lại.

<!-- Facebook Open Graph Tags -->
<meta property="fb:app_id" content="thay bang App ID ban vua tao"/>
<!-- End Facebook Open Graph Tags -->

Bước 3: Sửa file comment.php

Sau khi sửa file header.php, tiếp tục chọn file comment.php

Tìm dòng hoặc // You can start editing here — including this comment!, dán đoạn code này ngay dưới dòng đó

<?php if( comments_open() ): ?>
<div id="facebook-comments">
<h3 id="reply-title">Bình luận</h3>
<fb:comments href="<?php the_permalink(); ?>" num_posts="8" width="680"></fb:comments>
</div>
<?php endif; // end comments_open() ?>

Tại đây bạn có thể sửa tiêu đề và kích thước cho phù hợp với website của mình. Để xóa bình luận mặc định của wordpress, bạn có thể vô hiệu hóa hoặc xóa các đoạn code còn lại.

Vậy là xong, hãy vào 1 bài viết bất kỳ để kiểm tra kết quả nhé. Trong quá trình làm nếu gặp khó khăn cứ bình luận phía dưới, tác giả sẻ giải đáp nhiệt tình!

Lưu ý: Trước khi sửa các file header.php và comment.php bạn nên sao lưu các file này lại tránh trường hợp làm sai bước nào đó. Có 1 số theme WordPress đã chỉnh cấu trúc file comment.php nên trước khi xóa code bạn nên backup cẩn thận.

Nguồn FB: Nghĩa Trần

Blog Chia sẻ

Search This Blog