Hướng dẫn chèn nút like Facebook vào bài viết trên website WordPress một cách đơn giản.
Bên cạnh Facebook Comments thì Facebook Like Button cũng là một trong những phương án tốt để bạn có thể tăng khả năng tương tác giữa website với người dùng mạng xã hội lớn nhất thế giới. Trong bài viết hôm nay, tôi sẽ hướng dẫn cho các bạn cách đơn giản nhất để tích hợp nó vào website WordPress. Vẫn như những lần trước, tôi có 2 khuyến cáo cần phải nhắc lại. Thứ nhất, các dịch vụ của Facebook sẽ ảnh hưởng xấu đến tốc độ load của website, bạn phải cân nhắc giữa tốc độ và sự tiện lợi. Thứ hai, không nên chèn code trực tiếp vào file theme vì nó khá phức tạp đối với người dùng không rành về kỹ thuật và dễ gây lỗi website. Do đó, theo tôi, phương án tối ưu nhất để làm điều này vẫn là sử dụng plugin.
Tham khảo thêm:
- Chèn widget Facebook Page vào WordPress một cách đơn giản
- Tích hợp Facebook Chat cho website không cần dùng plugin
Các bước chèn nút like Facebook vào website WordPress
1. Đầu tiên, các bạn cần phải cài đặt và kích hoạt plugin WP Like Button.
2. Tiếp theo, truy cập vào link này => click nút Add a New App => điền tên ứng dụng và email của bạn rồi click nút Create App ID.
Click xác nhận Google reCAPTCHA => click vào nút Submit.
3. Một app mới sẽ được tạo ra. Trên sidebar bên trái, các bạn click vào Settings => Basic.
4. Tại đây, các bạn sẽ phải khai báo thêm một số thông tin.
Trong đó:
- App Domains: điền tên miền website của bạn.
- Privacy Policy URL: điền trang đến trang chính sách bảo mật của bạn.
- Category: chọn lĩnh vực cho website của bạn.
- Business Use: lựa chọn dùng cho bạn hay dùng cho người khác.
Click vào nút Save Changes để lưu lại.
5. Kéo xuống bên dưới, click vào nút Add Platform => chọn Website.
Điền link website của bạn vào khung Site URL rồi click nút Save Changes để lưu lại.
6. Click vào biểu tượng công tắc gạt (góc trên bên phải giao diện) để kích hoạt ứng dụng.
Click vào nút Confirm để xác nhận.
Ứng dụng chuyển sang trạng thái Live nghĩa là bạn đã kích hoạt thành công.
7. Quay trở lại giao diện thiết lập của plugin WP Like Button, điền App ID (copy ở bước 4) vào ô tương ứng. Đối với Admin ID, các bạn lấy trên URL của trang cá nhân (profile). Ví dụ URL profile của tôi là https://www.facebook.com/trunghieubui93 thì Admin ID của tôi là trunghieubui93.
Một số thiết lập khác:
- Where to display: những trang sẽ hiển thị nút like Facebook (trang chủ, toàn bộ page, toàn bộ post, toàn bộ các trang lưu trữ, loại trừ các page và post nhất định).
- Enable like button for mobile: có hiển thị nút like trên giao diện mobile hay không?
- Kid Directed Site: nếu site của bạn chứa nội dung cấm trẻ dưới 13 tuổi thì chọn Yes, ngược lại thì chọn No.
- Default Image: hình ảnh mặc định sẽ được sử dụng để hiển thị trên Facebook (khi share) nếu bài viết không có ảnh thumbnail.
- Shortcode: sử dụng shortcode để chèn nút like Facebook vào bất cứ đâu trên website.
- Code Snippet: sử dụng snippet để chèn nút like vào theme.
- Before/ After: hiển thị nút like ở đầu hoặc cuối post/ page.
- What to like: bạn có thể thiết lập nút like riêng biệt cho từng post/ page, cho toàn bộ website hoặc cho 1 Facebook Page bất kỳ.
- Language: ngôn ngữ hiển thị.
- Width: độ rộng của nút like.
- Position: căn chỉnh vị trí nút like (bên trái, chính giữa, bên phải).
- Layout: bố cục nút like.
- Color: màu sắc nút like.
- Action Type: lựa chọn hành động (like hoặc recommend).
- Button Size: kích thước nút like.
- Include Share Button: hiển thị nút chia sẻ (share) bên cạnh nút like Facebook.
Sau khi hoàn tất, click vào nút Save Settings để lưu lại toàn bộ thiết lập.
Và thành quả mà bạn nhận được sẽ trông tương tự như thế này:
Thật tuyệt vời phải không nào? Chúc các bạn thành công!
Bạn biết phương pháp khác đơn giản và tối ưu hơn để chèn Facebook Like Button vào bài viết trong website WordPress? Đừng quên chia sẻ nó với chúng tôi trong khung bình luận bên dưới.
Nếu bạn thích bài viết này, hãy subscribe blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất qua email nhé. Cảm ơn rất nhiều. :)
Muốn cài nhưng lại sợ cài nhiều plugin quá web lại nặng :(
Mình chèn thẳng code của facebook vào thì nó kéo điểm gg page speed. Dùng plugin WP Like Button này có bị tình trạng như vậy không hả bạn?.
Ở đầu bài viết mình có nói rồi đấy bạn.
Vâng, nhưng mình thấy 1 số site họ chèn mà điểm vẫn tốt lắm, ko biết là có thủ thuật gì ko Hiếu nhỉ?.
Một số theme có sẵn, kiểu chỉ đơn giản có cái nút bấm thôi, không cần thông báo gì cho admin, nó không load code của Facebook nhiều nên nó nhẹ đấy bạn.
Bài viết bổ ích lắm ad :)
Hiếu dùng những gì mà performace site tận 98?
98 ở đâu thế bạn? Điểm performance của wpcanban.com là 100/100 hết mà. :P Cái này mình đã có bài chia sẻ chi tiết rồi. Bạn tìm trên wpcanban.com sẽ thấy.
cũng dễ làm quá, mình làm theo hướng dẫn của bạn được rồi nè
Mình thấy mấy bài post fb của hiếu có metadescription là được viết bởi hiếu, có dẫn link về fb là sao đó hiếu?
Thiết lập trong Users => Your Profile => Facebook profile URL thì phải.
Không có rồi hiếu, không hiểu vì sao luôn @@
Mình muốn chèn nút like này cho woocommerce thì làm như thế nào ?
Hiện tại plugin này chỉ hỗ trợ chèn nút like vào post và page thôi bạn ạ. Chưa hỗ trợ product và các loại custom post type khác.
cảm ơn wpcanban về bài viết này nhé.. mình tìm mãi hôm nay mới thấy bài post này. thank kiu bạn nhé
Nhìn thì dễ nhưng làm hơi rắc rối tí nha ad :v
Cái này e nghĩ chèn thủ công sẽ ổn hơn
Bạn thử phân tích xem chèn thủ công thì ổn hơn ở điểm gì? :)
Ít nhất một phần cũng không can thiệt đến plugin, với lại nút like này fb hướng dẫn rất chi tiết, thiết lập và copy mã dán vào là xong.
Tuy nhiên nếu ko rành thì cũng chẳng biết bỏ vào đâu. Tất nhiên với bất kỳ tính năng nào mà sử dụng plugin thì thao tác, config sẽ đơn giản hơn. Nhưng cái e muốn nói là cái nào có thể làm được thì đừng nên lạm dụng plugin đó anh.
Chèn thủ công thì có các nhược điểm sau đây:
1. Phải tự tìm vị trí chèn trong file theme. Người không rành về code thì rất khó.
2. Dễ gây lỗi giao diện nếu chèn sai vị trí.
3. Khi update theme sẽ bị mất và phải chèn lại từ đầu.
4. Khó tùy biến.
=> Dùng plugin vẫn tối ưu hơn.
Mình đã sử dụng plugin này nhưng phải gỡ vì nó chiếm mất một ô trong grid sản phẩm