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

  Wiki

Hôm nay mình sẽ hướng dẫn các bạn cách để tích hợp live chat facebook vào WordPress một cách thật đơn giản

Trước khi bắt đầu hướng dẫn, mình sẽ nêu ra các ưu cũng như nhược điểm khi tích hợp Live chat Facebook.

ƯU ĐIỂM

  • Đa số những người dùng đều sử dụng Facebook.
  • Giao diện đẹp, có hỗ trợ Tiếng Việt.
  • Miễn phí hoàn toàn
  • Có thể chat trực tiếp trên website mà không cần phải qua website Facebook

nHƯỢC ĐIỂM

  • Chỉ sử dụng được khi người dùng có tài khoản Facebook.
  • Trang web của bạn sẽ bị ảnh hưởng như chậm trang khi Facebook có vấn đề.

Những bước đơn giản

1. Lấy ID Fanpage

Bạn hãy truy cập vào Fanpage và sau đó chọn tab giới thiệu, trong mục Thông tin phía dưới bạn sẽ tìm thấy mục ID Trang. Tiếp theo bạn chỉ cần copy ID đó.

Bước 2: Lấy ID của App ID

Bạn hãy vào trang: https://developers.facebook.com/apps/ và copy AppID.

Bước 3: Cấu hình Messenger nền tảng

Tiếp theo, bạn hãy truy cập vào Fanpage chọn Cài đặt -> Nền tảng Messenger.

Tại mục Ứng dụng đã đăng ký, bạn thêm App ID lấy từ bước 2 và nhấn vào Link.

Tại mục Whitelisted Domains bạn thêm tên miền của bạn vào và cuối cùng nhấn Save để hoàn tất.

Bước 4: Chèn khung Live Chat Facebook

Sau khi đã hoàn thành 3 bước phía trên bạn Dashboard > Appearance > Editor và chọn chỉnh sửa header.php.

Sau đó dán đoạn mã bên dưới phía dưới thẻ <body> và nhấn Update File để lưu lại.

window.fbAsyncInit = function() { FB.init({ appId : ‘ĐIỀN APP ID CỦA BẠN’, autoLogAppEvents : true, xfbml : true, version : ‘v2.11’ }); }; (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 = “https://connect.facebook.net/en_US/sdk.js”; fjs.parentNode.insertBefore(js, fjs); }(document, ‘script’, ‘facebook-jssdk’));

Sau đó nhấn F5 để hoàn thành quá trình chèn. Và xem thử xem mình đã thành công chưa! Chúc các bạn thành công!

LEAVE A COMMENT