Đoạn code bên dưới sẽ giúp bạn chèn Facebook Messenger vào bất kỳ trang web nào, miễn là bạn biết chút ít code là được. Nếu như sử dụng trên WordPress thì rất đơn giản, bạn có thể sử dụng plugin để chèn. Nhưng đối với các mã nguồn website tự code hoặc các source code forum thì bạn chỉ cần chỉnh sửa lại chút xíu là được.
<div class="messenger hocwp-theme" style="position: fixed; bottom: 0; right: 10px; width: 360px; z-index: 99999;">
<div class="fbm-container">
<div id="msgToggle" class="header" style="background-color: rgb(0, 132, 255); color: rgb(255, 255, 255); border-radius: 5px 5px 0 0; cursor: pointer;">
<h2 style="margin: 0; font-family: arial; font-size: 20px; display: block; padding: 6px 8px; line-height: 37px;">
<img src="https://cdn3.iconfinder.com/data/icons/social-messaging-ui-color-shapes-2-free/128/social-facebook-messenger-square1-32.png" alt="" style="display: inline-block; vertical-align: middle;"> Chat với chúng
tôi</h2>
</div>
<div id="msgBox" class="inner"
style="display: none; background-color: rgb(250, 250, 250); text-align: center; padding: 10px; border: 1px solid rgb(221, 221, 221);">
<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.10&appId=725693104267595";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-page" data-href="https://www.facebook.com/SuTroLaiThanThanh/" data-tabs="messages" data-height="300" data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><blockquote cite="https://www.facebook.com/SuTroLaiThanThanh/" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/SuTroLaiThanThanh/">Muonliness2.vn</a></blockquote></div>
</div>
</div>
<script type="text/javascript">
(function () {
var toggle = document.getElementById("msgToggle");
if (null != toggle) {
toggle.addEventListener("click", function () {
var container = toggle.parentNode,
msgBox = document.getElementById("msgBox");
if (-1 === container.className.indexOf("open")) {
container.className += " open";
msgBox.style.display = "block";
} else {
container.className = container.className.replace(" open", "");
msgBox.style.display = "none";
}
});
}
})();
</script>
</div>
Trong đoạn code bên trên, cái bạn cần sửa là nội dung bên trong thẻ có class inner. Bạn lên trang Page Plugin của Facebook, cấu hình theo tham số như bên dưới:
Sau khi hoàn tất, bạn nhấn vào nút lấy mã để sao chép code, bước 1 là bạn chọn APP, sao chép bước 2 và bước 3 thay thế cho đoạn code bên trên của mình. Bây giờ bạn mở tập tin footer.php lên và thêm đoạn code đã chỉnh sửa vào trước kết thúc đóng thẻ
