Hướng dẫn tích hợp bộ công cụ hỗ trợ trực tuyến trên website

Học WordPress

Website của bạn không chỉ đơn giản là một trang báo điện tử cung cấp thông tin đơn thuần cho người đọc. Mà hơn thế nữa, website của bạn sẽ như một con người thực sự và tương tác qua lại với người dùng. Một cách để thể hiện sự quan tâm của bạn đối với khách hàng chính là có thể trả lời những vướng mắc thông qua hình thức hỗ trợ trực tuyến.

Tạo bộ công cụ hỗ trợ trực tuyến lên website.
Tạo bộ công cụ hỗ trợ trực tuyến lên website.

Trong bài này mình xin hướng dẫn các bạn tích hợp công cụ hỗ trợ trực tuyến vào website sẽ giúp website của bạn trở nên chuyên nghiệp hơn rất nhiều.

Demo: https://codepen.io/manhphuc/pen/RjXQQw

Tạo bộ công cụ hỗ trợ trực tuyến lên website

bạn cần thêm những dòng code vào những file sau:

Bước 1: Thêm thư viện vào trong website.

Đầu tiên bạn cần tích hợp thư viện font-awesomeanimate thì các bạn có thể nhúng 2 dòng code sau vào file header.php

Bước 2: Chèn đoạn mã chat vào file footer.php trên hàm <?php wp_footer(); ?>

Lưu ý: thay các thông tin riêng thành thông tin của các bạn!

Bước 3: Chèn đoạn js xử lý ẩn hiện khung chat vào website của bạn.


Bạn có thể chèn đoạn trên trong cặp thẻ <script></script> sau đó chèn vào cuối file footer.php

Bước 4: Cuối cùng đi trang trí khung cho nó đẹp xíu, các bạn chèn đoạn sau vào file style.css

Đây là hình ảnh sau khi hoàn thành! Chúc các bạn thành công và tương tác với khách hàng tốt hơn khi tích hợp công cụ hỗ trợ trực tuyến này!

Tạo bộ công cụ hỗ trợ trực tuyến lên website.
Tạo bộ công cụ hỗ trợ trực tuyến lên website.

Bạn có thể tham khảo tại link này: https://codepen.io/manhphuc/pen/RjXQQw

Nếu gặp khó khăn trong khi làm, hãy comment dưới bài viết nếu bạn cần mình hỗ trợ.