Cải tiến công cụ tìm kiếm mặc định của WordPress

Hôm qua, tôi tình cờ xem mã nguồn website của MyThemeShop và phát hiện ra họ đang sử dụng tính năng tìm kiếm của Algolia. Tôi tò mò cài thử trên WP Shop và nhận thấy nó khá hay ho nên quyết định viết bài này để chia sẻ với các bạn. Algolia có khả năng tiên đoán và hiển thị các kết quả đề xuất ngay trên khung tìm kiếm, giúp tính năng tìm kiếm từ website của bạn trở nên chuyên nghiệp hơn bao giờ hết. Nếu bạn đã quá chán với tính năng tìm kiếm mặc định của WordPress thì Algolia rất đáng để thử.

Cải tiến công cụ tìm kiếm mặc định của WordPress với Algolia.

cai-tien-cong-cu-tim-kiem-mac-dinh-cua-wordpress-voi-algolia

Hôm qua, tôi tình cờ xem mã nguồn website của MyThemeShop và phát hiện ra họ đang sử dụng tính năng tìm kiếm của Algolia. Tôi tò mò cài thử trên WP Shop và nhận thấy nó khá hay ho nên quyết định viết bài này để chia sẻ với các bạn. Algolia có khả năng tiên đoán và hiển thị các kết quả đề xuất ngay trên khung tìm kiếm, giúp tính năng tìm kiếm từ website của bạn trở nên chuyên nghiệp hơn bao giờ hết. Nếu bạn đã quá chán với tính năng tìm kiếm mặc định của WordPress thì Algolia rất đáng để thử.

Tham khảo thêm:

Tại sao bạn nên chọn Algolia?

  • Nó có gói miễn phí, hỗ trợ tới 10.000 truy vấn mỗi tháng.
  • Algolia sẽ thu thập dữ liệu từ website của bạn và lưu trên máy chủ của họ. Các truy vấn tìm kiếm sẽ được tải từ máy chủ của Algolia, ít sử dụng tài nguyên của host.
  • Có thể tích hợp chung với công cụ tìm kiếm mặc định của WordPress một cách dễ dàng.
  • Hỗ trợ bộ lọc nâng cao, hiển thị kết quả tìm kiếm ngay lập tức.

Cải tiến công cụ tìm kiếm với Algolia

1. Đầu tiên, các bạn cần phải cài đặt và kích hoạt một plugin có tên là WP Search with Algolia (download).

cai-dat-va-kich-hoat-plugin-wp-search-with-algolia

2. Tiếp theo, truy cập link này và đăng ký cho mình 1 tài khoản Algolia. Các bạn chỉ cần điền email, password => tick vào mục I accept Algolia’s Terms of Service, Free Trial Limitations, and have read Algolia’s Privacy Policy => click vào nút Create an Account là được.

dang-ky-tai-khoan-algolia

3. Sau khi đăng ký, bạn sẽ nhận được thông báo trông như thế này:

confirm-your-algolia-account

4. Hãy truy cập email của bạn và click vào nút Confirm my email để xác minh tài khoản Algolia.

xac-minh-tai-khoan-algolia

5. Algolia sẽ yêu cầu bạn cung cấp thêm một số thông tin cá nhân cần thiết.

dien-thong-tin-dang-ky-algolia

Sau khi điền xong, hãy click vào nút Next.

6. Lựa chọn vị trí server lưu trữ dữ liệu tìm kiếm từ website của bạn. Hãy chọn vị trí gần chỗ đặt host của bạn nhất. Ví dụ web của tôi đang sử dụng server đặt tại Atlanta nên tôi sẽ chọn server US East.

lua-chon-vi-tri-dat-server

Click vào nút Finish để hoàn tất.

7. Một app mặc định sẽ được tạo ra, các bạn truy cập API Keys, copy Application ID, Search-Only API KeyAdmin API Key.

copy-algolia-api-keys

8. Quay trở lại trang quản trị của WordPress, truy cập Algolia Search => Settings => điền thông tin đã copy ở bước 7 vào các mục tương ứng.

thiet-lap-plugin-wp-search-with-algolia

Click vào nút Save Changes để lưu lại.

9. Truy cập Algolia Search => Autocomplete.

algolia-autocomplete

Thực hiện các công việc sau:

  • Tick vào mục Enable autocomplete để kích hoạt tính năng.
  • Tick vào cột Enable tương ứng với các thành phần mà bạn muốn Algolia index dữ liệu và hiển thị trong kết quả tìm kiếm. Tick chọn thành phần nào thì cũng nhớ click vào nút Re-index tương ứng với thành phần đó để Algolia tiến hành thu thập dữ liệu.
  • Điều chỉnh số lượng đề xuất hiển thị trên khung tìm kiếm trong cột Max. Suggestions.

Sau khi hoàn tất, click vào nút Save Changes để lưu lại.

10. Truy cập Algolia Search => Search Page. Tại đây, các bạn sẽ nhìn thấy 3 tùy chọn khác nhau.

algolia-search-page

Trong đó:

  • Do not use Algolia: không sử dụng tính năng tìm kiếm của Algolia trên website này. Bạn chỉ sử dụng Algolia để thu thập dữ liệu và sẽ hiển thị kết quả tìm kiếm trên 1 website khác.
  • Use Algolia in the backend: sử dụng Algolia kết hợp với công cụ tìm kiếm mặc định của WordPress. Nghĩa là giao diện tìm kiếm vẫn là của WordPress và Algolia chỉ hiển thị kết quả mà thôi.
  • Use Algolia with Instantsearch.js: sử dụng Algolia với đầy đủ chức năng (bộ lọc, hiển thị kết quả ngay lập tức…). Tuy nhiên, Algolia sẽ tải thêm một số file JS và CSS vào website nên có thể sẽ ảnh hưởng tới tốc độ load web.

Click vào nút Save Changes để lưu lại.

11. Xóa tất cả các thể loại cache (cache website, cache CDN, cache trình duyệt web…) và kiểm tra kết quả.

demo-algolia-search

Thật tuyệt vời phải không nào? Chúc các bạn thành công!

Bạn đã dùng cách nào để cải tiến công cụ tìm kiếm mặc định của WordPress? Bạn đánh giá thế nào về giải pháp Algolia mà tôi vừa đề cập ở trên? Hãy chia sẻ với chúng tôi những quan điểm và ý kiến của bạn thông qua khung bình luận bên dưới.

Nếu bạn thích bài viết này, hãy subscribe blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất qua email nhé. Cảm ơn rất nhiều. :)


Bài liên quan