Nhúng messenger vào website đơn giản

Nhúng Messenger Facebook vào website là cách để khách hàng hoặc người dùng ghé vào website bạn khi có nhu cầu có thể liên hệ với bạn trực tiếp sang Facebook ( cụ thể là Fanpage ). Tuy nhiên, việc nhúng Messenger Facebook lại khá phức tạp và khó thực hiện với những bạn, anh/chị không rành về code hay công cụ Facebook. Trong bài viết này, tôi sẽ hướng dẫn anh chị và các bạn cách để chúng ta nhúng Messenger Facebook nhanh chóng, dễ dàng và dễ thực hiện.

Lưu ý: chỉ dùng cho Fanpage, không dùng cho trang cá nhân

Để nhúng được Messenger Facebook vào website chúng ta lần lượt nhúng code css ( thẻ style ), code html, và code javascript vào trước thẻ </body>. Trong bài này tôi sẽ nói ngắn gọn và đơn giản để anh chị thực hiện dễ dàng.

Code css:

Lưu ý: thay đổi "tenfanpage"  bằng tên fanpage của anh chị. Vd: https://www.facebook.com/nguyenvandinhwebsite/ thì tenfanpage là "nguyenvandinhwebsite"

Cuối cùng bạn chỉ cần thêm javascript cho nó là được

Code javascript

<script src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&amp;version=v2.9"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script>jQuery(document).ready(function($){function detectmob(){if( navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPod/i) || navigator.userAgent.match(/BlackBerry/i) || navigator.userAgent.match(/Windows Phone/i) ){return true;}else{return false;}}var t={delay: 125, overlay: $(".fb-overlay"), widget: $(".fb-widget"), button: $(".fb-button")}; setTimeout(function(){$("div.fb-livechat").fadeIn()}, 8 * t.delay); if(!detectmob()){$(".nvd").on("click", function(e){e.preventDefault(), t.overlay.is(":visible") ? (t.overlay.fadeOut(t.delay), t.widget.stop().animate({bottom: 0, opacity: 0}, 2 * t.delay, function(){$(this).hide("slow"), t.button.show()})) : t.button.fadeOut("medium", function(){t.widget.stop().show().animate({bottom: "30px", opacity: 1}, 2 * t.delay), t.overlay.fadeIn(t.delay)})})}});</script>Mọi thắc mắc hoặc cần hỗ trợ bạn có thể comment xuống phía dưới, tôi sẽ hỗ trợ ngay cho bạn

File đầy đủ: Tải về