2 cách cài đặt Chat Facebook vào website

Cập nhật: 21/11/2019

Để tích hợp Chat Facebook vào website WordPress hoặc bất cứ website nào, bạn cần một Fanpage. Sau đó thực hiện như hướng dẫn sau:

Cách 1. Chèn Chat Facebook thủ công

Bước 1. Lấy Code Chat Facebook

Truy cập vào Fanpage và chọn Settings

tich-hop-chat-facebook1-min

Bấm vào Messaging ở bên trái

Phần bên phải, kéo xuống dưới, và chọn Get Started

Bấm vào Next

tich-hop-chat-facebook4-min

Chọn Ngôn ngữ lời chào hiển thị ở phần Chat

tich-hop-chat-facebook5-min

tich-hop-chat-facebook6-min

Sửa xong thì bấm vào Next

tich-hop-chat-facebook7-min

Thiết lập thời gian phản hồi và màu sắc Chat

tich-hop-chat-facebook8-min

Lấy Code Chat Facebook

Add Website Domain Name: Thêm tên miền website

Nếu web của bạn là: themevi.com thì điền vào https://themevi.com

Nếu web là www.themevi.com.com thì điền vào https://themevi.com

Nếu web là https://themevi.com thì điền là https://themevi.com

Nếu web là https://themevi.com thì điền là https://themevi.com

Nếu bạn vẫn lo lắng, có thể điền tất cả: https://themevi.com, https://themevi.com, https://themevi.com và https://themevi.com

Bạn có thể tích hợp chat Facebook cho nhiều website, chỉ cần điền tên website vào Add Website Domain Name thôi.

Bấm vào đoạn code ở bên phải. Chỉ cần bấm, nó sẽ tự động được copy.

Bấm vào Finish

tich-hop-chat-facebook9-min

Bước 2. Chèn Chat Facebook vào Website

Để chèn code chat Facebook vào website, bạn có thể sửa trong Footer.php hoặc sử dụng Plugin Insert Headers and Footers.

Chèn code Chat Facebook vào Footer qua Plugin (đọc bước 7, chèn vào Script in Footers)

Truy cập vào Giao diện > Sửa

giao-dien-admin-left-bar-1-min

Tìm tệp Footer.php

tich-hop-chat-facebook10

Chèn đoạn code đã copy bên trên vào trước </body>

tich-hop-chat-facebook11-min

Bấm Lưu hoặc Cập nhật tập tin (ngay bên dưới). Và mở website để xem kết quả.

tich-hop-chat-facebook12-min

Nếu gặp vấn đề trong quá trình tích hợp Chat Facebook vào Website WordPress, chỉ cần bình luận bên dưới, mình sẽ hỗ trợ.

Cách 2. Chèn Facebook Chat bằng Plugin

Với cách trên, đôi khi bạn sẽ gặp lỗi là không hiển thị Facebook Chat. Gần đây mình đã gặp vấn đề này, và phải sử dụng Plugin.

Bước 1. Thêm tên miền website vào WhiteListed Domains

Đầu tiên bạn mở Fanpage ra và bấm vào Settings (Cài đặt )

fanpage-settings-themevi1-min

Tiếp theo chọn Messenger Platform (bên trái)

fanpage-settings-themevi2-min

Tại phần Whitelisted Domains, điền tên miền website muốn cài đặt chat Facebook, và bấm Save

whitelisted-domains1-min

Bước 2. Cài đặt Plugin Chat Facebook

Đăng nhập vào website rồi truy cập vào Plugin > Cài mới

plugin-cai-moi-themevi1-min

Gõ Customer Chat vào ô tìm kiếm. Và bấm vào Cài đặt ở WP-Chatbot for Facebook Messenger Customer Chat.

Nhớ Plugin được viết bởi tác giả HoliThemes nhé

chat-facebook-plugin-themevi1-min

Rồi bấm Kích hoạt

chat-facebook-plugin-themevi2-min

Bước 3. Cấu hình Plugin Chat Facebook

Bấm vào WP-Chatbox

wp-chatbox1-min

Điền thông tin cần thiết, gồm Facebook Page ID, Facebook App ID

wp-chatbox2-min

và Color, Logged in Greetings, Logged out Greetings

  • Color: màu sắc chính của Chat. Điền theo mã màu. Xem 500 mã màu tại Color-Hex.com
  • Logged in Greeting: Lời chào sẽ hiển thị khi bạn đã đăng nhập Facebook
  • Logged out Greeting: Lời chào sẽ hiển thị khi bạn không đăng nhập Facebook

wp-chatbox3-min

và Language (Ngôn ngữ)

wp-chatbox4-min

Plugin còn cho phép ẩn Facebook Chat trong các bài viết, trang và chuyên mục nhất định.

wp-chatbox5-min

ẩn Facebook chat trên Điện thoại (Mobile Devices) hoặc máy tính (Desktops). Và hiển thị Facebook chat sau khi web được tải (Call SDK after page loads) hoặc web được tải + 4s rồi sau đó mới hiển thị Facebook chat (+ 4 seconds….nên chọn điều này thì tốc độ web sẽ không bị ảnh hưởng nhiều).

Cuối cùng bấm Lưu thay đổi.

wp-chatbox6-min

Vậy là xong!