Trước tiên bạn phải đảm bảo rằng mình đã có 1 địa chỉ fanpage trên facebook.
Tiếp theo truy cập vào
https://developers.facebook.com/docs/plugins/page-plugin
Tại đây facebook đã có 1 tips hướng dẫn khá chi tiết về các thuộc tính cũng như cấu hình chỉnh sửa css để hiển thị hộp like trên trang của bạn. Trước tiên bạn cần cài đặt SDK vào blog bằng cách chọn vào nút "Lấy mã" hoặc "Get code"
<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.8"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script>
Lưu ý bạn có thể chỉnh sửa đoạn sau
js.src = "//connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v2.8";
Trong đó vi_VN là ngôn ngữ hiển thị hộp fanpage, bạn có thể thay đổi bằng các ngôn ngữ khác, mã ngôn ngữ tra tại https://developers.facebook.com/docs/messenger-platform/messenger-profile/supported-locales/
Kí tự & nếu như khi lưu báo lỗi bạn thay nó bằng amp; nhé như vậy ví dụ mình muốn hiển thị tiếng Anh thì sửa đoạn đó thành
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1amp;version=v2.8";
Công việc tiếp theo là chọn, chỉnh sửa sao cho ưng hình dạng kích thước của hộp like, mình thường chọn hộp đơn giản nhất có code như sau
<div class="fb-page" data-href="https://www.facebook.com/hoanghung96cs" data-width="340" data-hide-cover="false" data-show-facepile="true"></div>
Trong đó href="https://www.facebook.com/hoanghung96cs" bạn thay phần màu đỏ thành đường dẫn đến fanpage của mình, dán đoạn code trên vào 1 widget bất kì ( hoặc Chọn bố cục > Thêm tiện ích HTML) và lưu lại để kiểm tra thành quả
Chúc các bạn thành công !
