Hướng dẫn tạo nút like cho từng bài viết trên wordpress

By Tác Giả | FAQ

Th11 17

Nút like thể hiện sự chuyên nghiệp của và gia tăng sự tương tác của website. Nhiều bạn đang băn khoăn: Làm sao để tạo nút like,share cho website (blog)? Cách tạo nút like (thích) cho từng bài viết trên blog? … Hôm nay sms tốt sẽ hướng dẫn các bạn cách tạo nút like cho từng bài viết (web page) bằng thủ thuật đơn giản. Không cần phải cài plugin và cũng không cần quá rành về code.

cách tạo nút like cho từng bài viết

Lợi ích của nút like + share:

Tạo sự tương tác giữa độc giả và website (hay blog)

Gia tăng lượng view cho website

Có lợi cho seo

Cách tạo nút like cho website trên wordpress:

(Dùng sub domain facebook)

Yêu cầu: Đang đăng nhập bằng tài khoản Facebook.

Bước 1: 

Bạn vào Developers -> Thiết lập URL ( Tùy chỉnh) -> Tạo code (Get code)

Ví dụ:

Mình tạo nút like cho website sms tốt:

1. Vào URL to like điền link muốn like:

Mình đặt URL to like là: https://smstot.com

(Bạn có thể tùy chỉnh Standard, Width, Like tùy ý – Mình để mặc định)

2. Get Code (Tạo code) -> Xong phần thiết lập.

thiết lập nút like cho website
Bước 2: 

Sau khi tạo code màn hình sẽ hiện:

Your Plugin Code ( Bao gồm: HTML5,XFBML, IFRAME,URL)

  • HTML5: (Web sử dụng ngôn ngữ HTML 5)

1. Dán đoạn mã dưới đây vào thẻ <body> ( Chính là phần footer.php):

(Bất cứ blog nào cũng đều có thể dùng đoạn mã này)

<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/vi_VN/sdk.js#xfbml=1&version=v2.0”;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>

2. Dán đoạn mã dưới vào bất kỳ vị trí nào mà bạn muốn hiển thị nút like (share):

(Tùy biến link được in đậm là https://smstot.com thành link site của bạn)

<div class=”fb-like” data-href=”https://smstot.com” data-layout=”standard” data-action=”like” data-show-faces=”true” data-share=”true”></div>

  • XFBML: (Web sử dụng ngôn ngữ XFBML)

1. Khai báo đoạn mã dưới ở thẻ <body> ( Dán vào phần foooter.php)

<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/vi_VN/sdk.js#xfbml=1&version=v2.0”;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>

2. Khai báo đoạn mã dưới đây ở thẻ <html> (Dán vào phần header.php)

<html xmlns:fb=”http://ogp.me/ns/fb#”>

3. Dán đoạn mã dưới vào bất kỳ vị trí nào bạn muốn hiển thị nút like (share):

(Tùy biến link được in đậm là https://smstot.com thành link site của bạn)

<fb:like href=”https://smstot.com” layout=”standard” action=”like” show_faces=”true” share=”true”></fb:like>

Thủ thuật tạo nút like cho từng bài viết (web page):

1.Sau khi hoàn thành các bước trên (khai báo trong thẻ <body>, <html>)

2.Bạn dán đoạn code dưới trong từng bài viết và thay link bằng link bài viết bạn cần tạo nút like

<div class=”fb-like” data-href=”link bài viết” data-layout=”standard” data-action=”like” data-show-faces=”true” data-share=”true”></div>

Ví dụ: Mình muốn có nút like trong bài viết: ” Hướng dẫn tạo nút like cho từng bài viết trên wordpress” thì mình thực hiện các bước khai báo ở thẻ <body> và <html>

Rồi dán đoạn code: <div class=”fb-like” data-href=”https://smstot.com/huong-dan-tao-nut-like-cho-tung-bai-viet-tren-wordpress/” data-layout=”standard” data-action=”like” data-show-faces=”true” data-share=”true”></div> vào trong bài viết này. ( Wapsite của mình dùng ngôn ngữ HTML 5)

Hơi mất công một chút nhưng rất hiệu quả và quản lý bài viết tốt – Có bất cứ thắc mắc gì các bạn hỏi ở phần bình luận mình sẽ trả lời. Chúc các bạn thành công!