Hướng Dẫn Cài Chat Facebook Vào Website WordPress

Cài chat Facebook vào website WordPress giúp người dùng dễ dàng tương tác với website hơn, 99% người dùng tại Việt Nam đều sử dụng Facebook nên có thể chat ngay mà không cần đăng nhập. Sử dụng chat Facebook giúp bạn tận dụng được các công cụ sẵn có như chatbot, trả lời nhanh, trả lời tự động, note đơn hàng…

Ưu điểm và khuyết điểm của chat Facebook

Ưu điểm của chat Facebook đó là có thể chat ngay lập tức mà không yêu cầu đăng nhập hay điền form, ở vai trò quản trị viên bạn có thể tận dụng các công cụ như: chatbot, trả lời tin nhắn nhanh, trả lời tin nhắn tự động, note đơn hàng… các công cụ này được sử dụng hoàn toàn miễn phí.

Khi dùng Facebook chat thì bạn không mất quá nhiều nhân sự để trực chat như các công cụ live chat khác, bạn có thể trả lời trễ 5 phút – 10 phút vẫn bình thường vì tin nhắn chắc chắn sẽ gửi về Messenger của khách hàng sau khi bạn phản hồi. Nếu dùng các nền tảng live chat khác như tawk.to hoặc Subiz thì bạn cần phải sắp xếp nhân sự túc trực 24/7.

Khuyết điểm khi sử dụng Facebook đó là rất khó để đo lường, bạn không thể biết được chính xác chuyển đổi của người dùng chat qua Facebook. Những công cụ live chat khác thì việc đo lường qua Google Analytics vô cùng đơn giản, có thể biết chính xác khách hàng đã chat hay chưa, số lượng khách hàng click vào chat hay mở cửa sổ chat…

Từ 09/05/2024 Facebook chat plugin đã ngưng hoạt động vì vậy bạn nên thêm Facebook chat vào website bằng cách dẫn liên kết m.me, xem 2 cách cài đặt bên dưới.

Cách 1 – Cài chat Facebook vào website bằng plugin

Với cách sử dụng plugin sẽ rất nhanh tuy nhiên tốc độ load bị ảnh hưởng đôi chút, đầu tiên bạn cài plugin và kích hoạt plugin Floating chat widget vào website.

cài đặt plugin floating chat vào website

Vào phần cài đặt plugin và chọn create new widget, chọn Facebook Messenger, điền url m.me của fanpage, chọn hiển thị trên cả máy tính và mobile, cùng cùng nhấn save widget.

Fanpage của bạn có url là facebook.com/akatdotme/ thì url của m.me sẽ là https://m.me/akatdotme/ nhé, vào phần cài đặt để set url cho Fanpage.

cài đặt chat facebook trên floating chat

Click vào setting nếu muốn tùy chỉnh thêm phần lời chào.

tùy chỉnh nâng cao cho plugin floating chat

Cuối cùng xóa toàn bộ cache trên site nếu có và truy cập vào trang web bất kỳ xem plugin chat đã hoạt động hay chưa.

kiểm tra plugin floating chat facebok đã hoạt động chưa

Cách 2 – Cài chat Facebook vào website bằng code tùy chỉnh

Thêm chat Facebook vào website bằng liên kết m.me rất tiện, khi click vào chat trên mobile, url sẽ tự động chuyển hướng qua app Facebook Messenger luôn. Làm theo cách này sẽ hơi phức tạp xíu nhưng sẽ không làm chậm website. Đầu tiên bạn cần cài đặt và kích hoạt plugin WPCode.

cài đặt plugin wpcode cho website

Tiếp theo bạn cần upload hình ảnh icon lên website, link tải icon Facebook Messenger.

tải file facebook messenger lên website wordpress

Sau đó copy toàn bộ đoạn code bên dưới.

<style>
    .giuseart-mobile-contact-bar{
    display:none 
    }
    .giuseart-pc-contact-bar{
    right: 20px;
    bottom: 20px;
    position: fixed;
    z-index: 998;
    margin-bottom:0
    }
    .giuseart-pc-contact-bar li{
    width: 70px;
    height: 100px;
    overflow: visible;
    margin-bottom: 0;
    list-style: none;
    }
     .giuseart-pc-contact-bar li.fb {
    background: url(https://webdemo88.club/wp-content/uploads/2024/09/icons8-messenger-144.svg);    
    background-repeat: no-repeat;
    background-size: 70px 70px;
    background-position: center;
}
    .giuseart-pc-contact-bar li a{
    display: block;
    width: 70px;
    height: 70px;
    }
     
    @media only screen and (max-width: 600px) {
    .giuseart-pc-contact-bar{
    display:none;
    }
    .giuseart-mobile-contact-bar{
    right: 10px;
    bottom: 10px;
    position: fixed;
    z-index: 998;
    margin-bottom: 0;
    display:inline !important;
    width: 60px;
    }
    .giuseart-mobile-contact-bar li{
    display: block;
    float :right;
    list-style:none;
    }
          .giuseart-mobile-contact-bar li.fb{
    background: url(https://webdemo88.club/wp-content/uploads/2024/09/icons8-messenger-144.svg);    
    background-repeat: no-repeat;
    background-size: 60px 60px;
    background-position: center;
    }
    .giuseart-mobile-contact-bar li a{
    display: block;
    width: 60px;
    height: 60px;
    }
    }
     
    </style>
    <ul class="giuseart-pc-contact-bar">
    <li class="fb">
    <a href="https://www.m.me/akatdotme/" target="_blank" rel="nofollow"></a>
    </li>
    </ul>
    <ul class="giuseart-mobile-contact-bar">
    <li class="fb">
    <a href="https://www.m.me/akatdotme/" target="_blank" rel="nofollow"></a>
    </li>
    </ul>

Dán vào phần footer trong cài đặt WPCode.

cài chat facebook vào website wordpress

Chú ý thay url m.me và url https://webdemo88.club/wp-content/uploads/2024/09/icons8-messenger-144.svg thành url ảnh trên website của bạn nhé. Để lấy url hình ảnh icon bạn xem như hình bên dưới.

url hình ảnh icon facebook messenger

Cuối cùng xóa toàn bộ cache trên website nếu có và truy cập website xem phần chat đã hiển thị hay chưa, như hình bên dưới là ok.

kiểm tra plugin facebook chat để hiển thị hay chưa

Như vậy là mình đã hướng dẫn bạn 2 cách để thêm chat Facebook vào website cực kỳ nhanh gọn, nếu có chỗ nào không hiểu hãy để lại bình luận mình sẽ cố gắng phản hồi nhanh nhất có thể.

Văn Khải Cris

Văn Khải Cris

Chào bạn mình là Văn Khải Cris một chàng trai 9x đến từ vùng đất Tây Nguyên đầy nắng và gió, mình đã có hơn 5 năm kinh nghiệm trong lĩnh vực WordPress , Google Ads và MMO. Mọi kiến thức mình chia sẻ đều hướng đến sự đơn giản và hữu ích dành cho người mới, rất vui khi được kết nối cùng bạn.

guest

0 Bình luận
Đánh giá
Xem toàn bộ bình luận
0
Để lại bình luận hoặc câu hỏix