Tích hợp “Live Chat” (Gửi tin nhắn) của Facebook vào Website

Gọi nó là “Live Chat” kể cũng không thật sự chuẩn xác, nhưng xét về bản chất thì mình không có từ nào tốt hơn. Cũng khá lâu rồi Facebook đã cho phép chúng ta tích hợp phần live chat này giữa Website và Fanpage.

Người dùng bây giờ có thẻ truy cập Website và để lại lời nhắn, hay chat trực tiếp với chủ fanpage. Tính năng này tương đối tiện lợi, bởi hầu hết mọi người đều có tài khoản facebook, và khi bạn trả lời khách hàng, họ đều nhận được thông báo trên facebook thay vì chỉ email như trước đây.

Tích hợp live chat cho Facebook vào Website

Tích hợp live chat cho Facebook vào Website

Phần live chat Facebook phù hợp cho những ai

  • Những Website bán hàng có lượng truy cập thấp. Vì là phần gửi tin nhắn này không phải điểm mạnh của facebook bởi vậy không có nhiều tính năng về phân tích khách hàng.
  • Blog cá nhân, nó rất phù hợp bởi bạn có thể lắng nghe và phản hồi cho đọc giả tốt hơn. Live chat thì lại hơi thừa thãi.
  • Website dạng cộng đồng như diễn đàn, câu hỏi về live chat không nhiều. Các bạn nên dùng nó để lắng nghe phản hồi của người dùng rất tiện lợi.

Nhược điểm:

  • Người dùng phải có tài khoản facebook mới có thể gửi tin nhắn
  • Người gửi có thể gửi tin nhắn đi nhưng sẽ không nhận được tin nhắn trả lời ngay trên cửa sổ chat của web.

Ưu điểm

  • Hoàn toàn miễn phí
  • Khả năng tương tác với người dùng tốt hơn.
  • Gọn nhẹ, hoạt động đơn giản (bạn nên trả lời tin nhắn qua các ứng dụng Tú giới thiệu ở đây để tăng hiệu quả, tiết kiệm thời gian )
  • Tăng LIKE, vì nó kết nối với fanpage của bạn. Đừng quên nhắn khách hàng Like Fanpage để chăm sóc họ tốt hơn.

Lượn qua các Website thấy viết hướng dẫn cho cái này thì Tú đều không làm được, hết lỗi này tới lỗi khác ở cái JavaScript nên quyết định viết lại các bước làm cho bạn nào chưa biết. Các bạn chú ý đọc hết bài này rồi hãy bắt tay vào làm.

Hướng dẫn tích hợp Live Chat Facebook vào Website.

Bạn copy đoạn code bên dưới và chèn vào trước thẻ </body> của Website.

Source code    
<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.5";
  fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>
  <style>#cfacebook{position:fixed;bottom:0px;right:100px;z-index:999999999999999;width:250px;height:auto;box-shadow:6px 6px 6px 10px rgba(0,0,0,0.2);border-top-left-radius:5px;border-top-right-radius:5px;overflow:hidden;}#cfacebook .fchat{float:left;width:100%;height:270px;overflow:hidden;display:none;background-color:#fff;}#cfacebook .fchat .fb-page{margin-top:-130px;float:left;}#cfacebook a.chat_fb{float:left;padding:0 25px;width:250px;color:#fff;text-decoration:none;height:40px;line-height:40px;text-shadow:0 1px 0 rgba(0,0,0,0.1);background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAqCAMAAABFoMFOAAAAWlBMV…8/UxBxQDQuFwlpqgBZBq6+P+unVY1GnDgwqbD2zGz5e1lBdwvGGPE6OgAAAABJRU5ErkJggg==);background-repeat:repeat-x;background-size:auto;background-position:0 0;background-color:#3a5795;border:0;border-bottom:1px solid #133783;z-index:9999999;margin-right:12px;font-size:18px;}#cfacebook a.chat_fb:hover{color:yellow;text-decoration:none;}</style>
  <script>
  jQuery(document).ready(function () {
  jQuery(".chat_fb").click(function() {
jQuery('.fchat').toggle('slow');
  });
  });
  </script>
  <div id="cfacebook">
  <a href="javascript:;" class="chat_fb" onclick="return:false;"><i class="fa fa-facebook-square"></i> Phản hồi của bạn</a>
  <div class="fchat">
  <div class="fb-page" data-tabs="messages" data-href="https://www.facebook.com/chanhtuoicom" data-width="250" data-height="400" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"></div>
  </div>
  </div>

Trong đó bạn cần sửa lại:

  • Sửa https://www.facebook.com/chanhtuoicom thành địa chỉ Fanpage của bạn.
  • Nếu bạn muốn đoạn live chat hiển thị lệch qua bên trái hay dịch sang phải thì bạn thay đổi số 100px thành con số nào bạn muốn. Tú đang để là 100px có nghĩa là nó sẽ cách bên phải 100px (mục dích là Tú muốn nó ko đè lên nút BACK TO TOP).

Tìm đọa này

Source code    
#cfacebook{position:fixed;bottom:0px;right:100px

Vậy là xong.

Hướng dẫn với bạn bạn dùng WordPress.

Truy cập Admin => Appearance ==> Editor => Tìm file footer.php

Tìm thẻ </body> và thêm đoạn code xuống dưới.

Tích hợp Live Chat Facebook cho WordPress

Tích hợp Live Chat Facebook cho WordPress

Lưu lại để hoàn tất.

Hướng dẫn cho Blogspot

Vào Admin => Chọn Mẫu => Chỉnh sửa HTML

Tích hợp LiveChat Facebook cho Blogspot

Tích hợp LiveChat Facebook cho Blogspot

Nhấn lưu để hoàn tất.

Rất đơn giản vậy thôi, không tùy chỉnh thêm gì cả. Bạn nào biết CSS có thể tùy biến theo ý thích của mình ở trong <style>. Tham khảo thêm kinh nghiệm khi học quảng cáo facebook  để kết hợp và áp dụng fanpage tối ưu hơn.

Chúc bạn thành công.

Nhận tuyệt chiêu Marketing

Tài liệu, bí quyết, case study... giúp bạn gia tăng 200% doanh số Online.

Chúng ta luôn giống nhau ở những thứ lớn lao và chỉ khác nhau ở chi tiết.

Xin hãy kiểm tra email để hoàn tất

47 Responses to “Tích hợp “Live Chat” (Gửi tin nhắn) của Facebook vào Website”
  1. FPT 24h 29/04/2016
    • bùi phú truyện 19/09/2016
    • Tới 21/12/2016
  2. Trinh 29/04/2016
    • Tú Cao 29/04/2016
    • Tú Cao 03/05/2016
  3. Khoa Bùi 30/04/2016
    • Tú Cao 02/05/2016
      • Lê Đức Trung 03/03/2017
        • Tú Cao 03/03/2017
  4. học tiếng hàn 01/06/2016
    • Tú Cao 09/07/2016
  5. Nguyễn Tuấn 08/07/2016
    • Tú Cao 09/07/2016
  6. Hải 13/07/2016
    • Tú Cao 16/07/2016
  7. Minh Thịnh 14/07/2016
    • Tú Cao 16/07/2016
  8. Shunga Viet Nam 14/08/2016
  9. Duy Tùng 29/08/2016
  10. Anime Manga 03/09/2016
  11. Truong Trinh 12/09/2016
    • Tú Cao 19/09/2016
  12. Chien nguyen 26/09/2016
  13. Lê Thanh Sơn 24/10/2016
    • Dee Tran 03/01/2017
  14. gat 26/11/2016
    • Tú Cao 12/12/2016
  15. tuangoro 08/02/2017
  16. Minh Thanh Nguyen 08/02/2017
  17. sanh 22/02/2017
  18. Thành 26/03/2017
  19. Hung 11/04/2017
  20. Nguyễn Đức Vũ 27/04/2017
    • Tú Cao 02/05/2017
  21. Phước Phan 06/05/2017
    • Tú Cao 13/05/2017
  22. otaku news 10/05/2017
    • Tú Cao 13/05/2017
  23. nguyen tien 19/05/2017
  24. Newbie 21/05/2017

Leave a Reply

Nhận tuyệt chiêu Marketing

Nhận tuyệt chiêu Marketing

Đừng bao giờ để đối thủ của bạn biết điều này.

 

Hãy là những người đi đầu và cập nhật xu hướng, cách làm hiệu quả nhất.

Xin hãy kiểm tra email để hoàn tất