Init Live Search – Plugin tìm kiếm nhanh, nhẹ và thông minh cho WordPress

Phiên bản: 1.6.6 English version

Init Live Search – Plugin tìm kiếm nhanh, nhẹ và thông minh cho WordPress
2 tuần 2 173 15 phút đọc
Init Live Search là plugin tìm kiếm trực tiếp (live search) cho WordPress được thiết kế với tiêu chí nhanh, nhẹ, dễ dùng và tối ưu hiệu năng. Plugin sử dụng Vanilla JavaScript kết hợp REST API của WordPress để mang lại trải nghiệm tìm kiếm mượt mà, không cần tải lại trang.

Các phiên bản 1.5.x và 1.6.x đưa Init Live Search vượt ra khỏi một công cụ tìm kiếm cơ bản — trở thành một hệ thống tìm kiếm mạnh mẽ, tùy biến cao, và sẵn sàng tích hợp với mọi loại site WordPress.

Xem demo trực tiếp: https://youtu.be/nZocaTpi2hM

Có gì mới trong phiên bản 1.5.x và 1.6.x

Phiên bản 1.6.x đánh dấu bước chuyển mình lớn về giao diện người dùng (UI) của Init Live Search — cho phép tuỳ biến linh hoạt hơn, dễ tích hợp vào mọi loại website hoặc theme. Kèm theo đó là nền tảng vững chắc được xây từ chuỗi cải tiến 1.5.x trước đó.

  • Lệnh thống kê theo thời gian: Thêm các slash command /day, /week, /month — hiển thị bài viết được xem nhiều nhất theo ngày, tuần hoặc tháng (cần plugin Init View Count).
  • Default Slash Command: Tự động chạy slash command mặc định khi mở modal — có thể chọn thủ công hoặc bật chế độ “Smart Detection” để tự chọn lệnh phù hợp theo trang hiện tại.
  • Preset UI Styles: Chọn sẵn giao diện tìm kiếm với các file CSS dựng sẵn như style-full.css (toàn màn hình) và style-topbar.css (thanh tìm kiếm nổi đầu trang).
  • Override & Custom Styles: Dễ dàng ghi đè giao diện bằng cách thêm file init-live-search/style.css trong theme — hoặc tắt toàn bộ CSS mặc định để tự viết lại từ đầu.
  • WooCommerce-ready: Tích hợp slash command như /product, /on-sale, /stock, /sku, /price — hiển thị giá, badge sale, tồn kho và nút “Add to Cart”.
  • Search in SEO Metadata: Hỗ trợ tìm trong SEO Title và Meta Description từ các plugin: Yoast SEO, Rank Math, AIOSEO, TSF, SEOPress.
  • Init Smart Tag-Aware Search: Tự động tăng độ chính xác bằng cách kết hợp tiêu đề bài viết với các post tag — hỗ trợ fallback thông minh.
  • Tìm kiếm trong ACF: Lọc và tìm kiếm nội dung từ các custom field tuỳ chọn — chỉ lấy post đã xuất bản, có thể cấu hình thêm qua filter.
  • Hỗ trợ đa ngôn ngữ: Tự động nhận diện và lọc kết quả theo ngôn ngữ với WPML hoặc Polylang — không cần cấu hình thủ công.
  • Favorites & History: Quản lý bài viết yêu thích với /fav, xoá bằng /fav_clear — hiển thị truy vấn gần đây với /history, tất cả lưu cục bộ, không cần đăng nhập.
  • Weighted Result Ranking: Kiểm soát thứ tự hiển thị kết quả bằng trọng số giữa tiêu đề, tag, nội dung SEO, v.v. — tinh chỉnh dễ dàng bằng filter.
  • Refactor & Hiệu năng: Mã JS gọn gàng hơn, ít phụ thuộc, dễ tích hợp vào các theme hiện đại hoặc môi trường headless WordPress.
  • Search Analytics: Theo dõi truy vấn người dùng ngay trong admin — thống kê từ khoá, tần suất, xuất CSV, không lưu dữ liệu cá nhân.
  • Custom Slash Commands & Click Tracking: Cho phép tự định nghĩa slash command từ theme/plugin khác (qua filter + JS event) và theo dõi khi người dùng nhấp vào kết quả với sự kiện ils:result-clicked.
  • Smart Excerpt Highlight: Tự động tạo đoạn trích ngắn và gạch chân từ khóa khớp trong excerpt hoặc content — giúp người dùng dễ dàng xác định ngữ cảnh tìm kiếm.
  • Fallback thông minh & REST API ổn định: Tự chia nhỏ từ khoá dài, mở rộng tìm kiếm trong SEO metadata; dữ liệu luôn có cấu trúc đồng nhất giúp frontend dễ render.

Tính năng nổi bật

Hiệu năng cao, không phụ thuộc

Plugin được viết hoàn toàn bằng Vanilla JavaScript, không dùng jQuery hay thư viện ngoài. Mọi thao tác tìm kiếm đều thông qua WordPress REST API riêng với namespace chuẩn hóa (initlise/v1), kết hợp cơ chế debounce giúp giảm tải server khi người dùng gõ nhanh.

Hệ thống cache sử dụng localStorage để lưu kết quả tìm kiếm, lệnh slash command, danh sách yêu thích, và lịch sử đọc — tối ưu trải nghiệm và giảm số lần gọi API.

Tuỳ chỉnh UI linh hoạt

Giao diện tìm kiếm có thể chọn sẵn từ các preset như: toàn màn hình (style-full.css), thanh topbar (style-topbar.css), hoặc tắt toàn bộ CSS để tự viết lại. Bạn cũng có thể override CSS bằng file init-live-search/style.css trong theme hiện tại.

Từ khóa gợi ý thông minh

Người quản trị có thể nhập sẵn danh sách từ khóa gợi ý hoặc nhấn nút “Tạo tự động” để plugin phân tích tiêu đề bài viết. Hệ thống sẽ tự động loại bỏ stop words và gom từ khóa phổ biến nhất.

Điều hướng & thao tác bằng bàn phím

Plugin hỗ trợ điều hướng và thao tác toàn diện bằng bàn phím:

  • ↑, ↓: Di chuyển giữa kết quả
  • →: Thêm bài viết hiện tại vào danh sách yêu thích
  • ←: Xoá bài viết khỏi danh sách yêu thích
  • Enter: Mở bài viết
  • Esc: Đóng modal tìm kiếm

Lưu ý: Phím trái/phải chỉ hoạt động khi đang chọn một kết quả cụ thể.

Hỗ trợ tìm kiếm nâng cao

Hệ thống slash command mạnh mẽ: tìm bài mới nhất (/recent), lọc theo tag, danh mục, sản phẩm WooCommerce, SKU, giá, trạng thái kho… Có thể mở rộng bằng REST API và filter riêng.

Hỗ trợ tìm kiếm trong các trường ACF và metadata từ plugin SEO như Yoast, Rank Math, AIOSEO, SEOPress, TSF — phù hợp với site nhiều nội dung nâng cao.

Tương thích tối đa & dễ tích hợp

Không cần chỉnh sửa theme hay thêm shortcode. Chỉ cần giữ trường <input name="s">, plugin sẽ tự động bắt sự kiện và mở modal tìm kiếm. Ngoài ra còn có thể kích hoạt qua HTML attribute, phím tắt, hoặc URL.

Responsive & hỗ trợ đa ngôn ngữ

Giao diện modal thân thiện với mọi kích thước màn hình. Plugin hỗ trợ sẵn tiếng Việt và tiếng Anh, tự động đổi theo ngôn ngữ site.

Cấu hình đơn giản

Giao diện cài đặt của Init Live Search được thiết kế đơn giản, dễ hiểu, cho phép tùy chỉnh mọi khía cạnh của quá trình tìm kiếm:

  • Chọn post type để tìm kiếm: post, page, hoặc bất kỳ custom post type nào có public=true
  • Chọn một hoặc nhiều cách mở modal tìm kiếm: focus vào input[name=”s”], triple-click, hoặc tổ hợp Ctrl/Cmd + /
  • Tuỳ chọn bật/tắt Slash Command — hỗ trợ các lệnh như /recent, /tag, /product,…
  • Đặt lệnh slash mặc định chạy tự động khi modal mở — ví dụ: /recent hoặc /product
  • Chọn chế độ tìm kiếm: chỉ tiêu đề, tiêu đề + excerpt, tiêu đề + nội dung, hoặc kết hợp với post tag (Init Smart Tag-Aware Search)
  • Nhập danh sách ACF field key để tìm kiếm nâng cao — ví dụ: company_name, project_code
  • Bật tìm kiếm trong SEO Metadata: hỗ trợ các plugin Yoast, Rank Math, AIOSEO, TSF, SEOPress
  • Bật fallback thông minh: tự động rút gọn từ khoá, ghép cụm bigram nếu không đủ kết quả
  • Tuỳ chỉnh độ trễ tìm kiếm (debounce) từ 100–3000ms để kiểm soát hiệu năng
  • Giới hạn số lượng kết quả hiển thị trong modal (1–100)
  • Giới hạn số từ được chọn để kích hoạt Quick Search bằng tooltip (0–20, đặt 0 để tắt)
  • Bật/tắt voice input (SpeechRecognition API) nếu muốn dùng micro
  • Tuỳ chọn bật voice input nếu muốn dùng micro (SpeechRecognition API)
  • Chọn preset giao diện: modal mặc định, toàn màn hình, hoặc thanh topbar. Cũng có thể tắt toàn bộ CSS để tự viết lại.
  • Tuỳ chọn thêm UTM mặc định vào URL kết quả (ví dụ: utm_source=search)
  • Nhập hoặc tự động tạo danh sách từ khoá gợi ý mặc định

Công nghệ sử dụng

Plugin ưu tiên hiệu suất và khả năng mở rộng với kiến trúc hiện đại, tách biệt rõ frontend và backend.

  • Vanilla JavaScript: Toàn bộ logic frontend viết bằng JavaScript thuần, không dùng jQuery hay framework
  • Custom REST API: Giao tiếp qua các endpoint chuẩn hoá thuộc namespace riêng initlise/v1
  • Modular architecture: Toàn bộ mã nguồn JS được tách rõ theo từng chức năng: trigger, command, render, API, v.v.
  • Không phụ thuộc bên ngoài: Không dùng thư viện bên thứ ba — tất cả đều built-in
  • Biểu tượng & ảnh: Dùng SVG trực tiếp hoặc ảnh fallback mặc định (qua filter)
  • Cấu hình toàn cục: Định nghĩa thông qua biến window.InitPluginSuiteLiveSearchConfig
  • Hỗ trợ theme override: Có thể ghi đè toàn bộ style bằng file init-live-search/style.css trong theme
  • localStorage-first: Dùng localStorage cho cache, slash command history, favorites, và session-state

Mã nguồn & Phát triển

Plugin Init Live Search được phát triển dưới dạng mã nguồn mở và duy trì thường xuyên trên GitHub. Đây là nơi bạn có thể theo dõi tiến độ phát triển, cập nhật sớm, hoặc đóng góp ý tưởng, báo lỗi và đề xuất tính năng mới.

  • Repo chính thức: github.com/brokensmile2103/init-live-search
  • Hãy nhấn Star để ủng hộ plugin – giúp tăng độ hiển thị trong cộng đồng mã nguồn mở.
  • Góp ý, báo lỗi hoặc đề xuất thêm tính năng qua tab Issues của repo.

Cài đặt và sử dụng

  1. Cài đặt và kích hoạt plugin như các plugin thông thường.
  2. Plugin tự động hoạt động trên các trường <input name="s">.
  3. Bạn có thể mở modal tìm kiếm bằng Ctrl + / hoặc nhấp 3 lần trên vùng trống bất kỳ.
  4. Cấu hình từ khóa gợi ý tại Cài đặt → Init Live Search.

Dành cho Developer

Plugin Init Live Search được xây dựng với định hướng mở rộng dễ dàng, phù hợp cho developer tích hợp sâu vào theme hoặc plugin khác.

  • Filter & Hook: Plugin cung cấp nhiều filter để can thiệp vào kết quả tìm kiếm, danh sách gợi ý, danh mục lọc và cấu hình đầu ra. Xem chi tiết trong bài viết hướng dẫn sử dụng các filter trong Init Live Search.
  • Sự kiện JavaScript: Các sự kiện như ils:modal-opened, ils:results-loaded, ils:search-started… được phát ra trong quá trình tương tác, giúp developer gắn tracking, analytics hoặc custom UI. Xem chi tiết tại hướng dẫn sử dụng sự kiện JavaScript ILS.
  • Tuỳ biến giao diện: Chọn preset có sẵn, override bằng file style.css trong theme, hoặc tắt toàn bộ CSS để viết lại từ đầu. Tham khảo hướng dẫn tùy chỉnh giao diện Init Live Search.
  • REST API: Dữ liệu tìm kiếm trả về qua REST endpoint chuẩn hóa /initlise/v1/search, có thể gọi riêng bằng JavaScript tùy ý. Xem đầy đủ tại danh sách endpoint REST API trong Init Live Search.
  • Slash Command: Init Live Search hỗ trợ hệ thống command dạng /command như /recent, /id, /tag… cực kỳ mạnh mẽ. Xem chi tiết tại hướng dẫn sử dụng Slash Command trong Init Live Search.
  • Trigger nâng cao: Modal có thể được mở bằng nhiều cách: phím tắt, triple click, focus vào input, URL (deep link), bôi đen văn bản, hoặc thuộc tính data-ils. Xem toàn bộ tại tổng hợp các cách mở Init Live Search modal.
  • Headless & static site: Plugin có thể tích hợp hoàn chỉnh với các site dùng REST API, headless WordPress hoặc static site như Hugo, Astro, Next.js… Xem hướng dẫn chi tiết tại cách tích hợp Init Live Search với headless/static site.
  • Cache nâng cao bằng Cloudflare: Có thể dùng Cloudflare Cache Rules để cache kết quả tìm kiếm slash command, giảm tải server mà vẫn giữ trải nghiệm tức thì. Xem chi tiết tại hướng dẫn cấu hình cache với Cloudflare.
  • Biến toàn cục: Cấu hình JS có thể truy cập qua window.InitPluginSuiteLiveSearch để thay đổi hành vi động mà không sửa mã nguồn.
  • Cấu trúc code rõ ràng: Phân tách thành các module riêng gồm: REST API, suggestion engine, modal UI, filter, trigger, cache.

Plugin không bị khóa cứng logic, nên hoàn toàn có thể tích hợp với các tính năng nâng cao như WooCommerce, tìm kiếm trong taxonomy tùy chỉnh, hoặc hỗ trợ shortcode tùy biến trong template.

Nếu bạn mới bắt đầu hoặc muốn khám phá sâu hơn, đừng bỏ qua series Init Live Search Toàn tập – nơi tổng hợp các bài viết từ cơ bản đến nâng cao dành cho plugin này.

Góp ý & Liên hệ

Bạn có góp ý, phát hiện lỗi hoặc muốn đề xuất tính năng mới? Hãy để lại bình luận bên dưới hoặc tạo issue trên GitHub. Đừng ngại! Mọi phản hồi từ bạn sẽ giúp Init Live Search ngày càng tốt hơn.

Tải Plugin

Hình ảnh thực tế

Changelog

  • 1.6.6 – Tìm kiếm fallback & UI tối ưu
    • Thêm logic Fallback tìm kiếm từng từ — tự động tách từ khóa dài thành các từ đơn nếu không tìm thấy kết quả
    • Tích hợp tìm kiếm trong SEO Metadata vào fallback — mở rộng độ phủ khi từ khóa khớp với tiêu đề/mô tả SEO
    • Thêm tùy chọn “Hiển thị đoạn trích” trong cài đặt admin — có thể tắt nếu muốn giao diện đơn giản hơn
    • Refactor hệ thống tìm kiếm: tách riêng các chế độ (full, title, tag-aware…) thành hàm riêng, dễ mở rộng hơn
    • Chuẩn hóa dữ liệu đầu ra trong REST API: luôn trả về cấu trúc đầy đủ kể cả khi không có excerpt
  • 1.6.5 – Snippet thông minh & highlight chuẩn xác
    • Thêm tính năng Smart Excerpt Highlight — tự động tạo đoạn trích ngắn từ excerpt hoặc content nếu không có excerpt
    • Gạch chân các từ khóa khớp trong đoạn snippet — hỗ trợ tìm kiếm mượt mà hơn cho người dùng
    • Ưu tiên excerpt nếu có, fallback sang content trong trường hợp cần thiết
    • Giới hạn độ dài đoạn trích ở phía JS để tránh UI bị vỡ hoặc quá tải
    • Cải tiến cơ chế xếp hạng kết quả: ưu tiên tiêu đề > đoạn trích > nội dung — đặc biệt hữu ích trong chế độ title_excerpt và title_content
    • Refactor toàn bộ hàm get_results() thành các hàm con riêng biệt — gọn hơn, dễ mở rộng và bảo trì
  • 1.6.4 – Lệnh tuỳ chỉnh & sự kiện mới cho developer
    • Thêm sự kiện JavaScript ils:result-clicked — theo dõi khi người dùng click vào kết quả tìm kiếm (gồm ID, URL, tiêu đề, loại, danh mục, slash command)
    • Thêm filter mới init_plugin_suite_live_search_commands — cho phép đăng ký slash command từ theme hoặc plugin khác
    • Các slash command tuỳ chỉnh có thể tự xử lý bằng sự kiện JS ils:* — không cần thay đổi plugin gốc
    • Tối ưu logic nhận diện giọng nói (Voice Search) với SpeechRecognition — tự dừng sau 5s, khởi động lại nếu cần, nhận diện ngôn ngữ từ <html lang="...">
    • Cập nhật giao diện micro nhấp nháy và xử lý lỗi rõ ràng hơn khi trình duyệt chặn microphone
  • 1.6.3 – Slash command mới & cải tiến logic
    • Thêm các slash command mới: /day, /week, /month — hiển thị bài viết được xem nhiều nhất theo ngày, tuần, tháng
    • Thêm slash command /history — hiển thị các truy vấn tìm kiếm gần đây (lưu bằng LocalStorage)
    • Yêu cầu plugin Init View Count đang hoạt động để kích hoạt các lệnh trên
    • Hỗ trợ đầy đủ infinite scroll và REST API, hoạt động ổn định trên các site có lưu lượng cao
    • Nâng cấp logic phát hiện slash command — chỉ hiển thị các lệnh hợp lệ dựa trên plugin đang bật và cài đặt hiện tại
    • Cải thiện fallback nếu slash command không tồn tại — giao diện mượt mà, nhất quán
  • 1.6.2 – Default slash command & tinh chỉnh hiển thị
    • Thêm tùy chọn chọn slash command mặc định khi mở modal (ví dụ: /recent, /related, /product)
    • Chế độ Smart Detection: tự động xác định slash command dựa theo loại trang hiện tại (bài viết, taxonomy, sản phẩm…)
    • Chỉ hiển thị các lệnh như /popular, /read nếu plugin tương ứng đang hoạt động
    • Cải thiện mô tả trong phần cài đặt — rõ ràng và dễ hiểu hơn cho người dùng
    • Bổ sung filter và logic bảo vệ để đảm bảo chỉ ghi nhận giá trị hợp lệ từ form
  • 1.6.1 – Search Analytics & tối ưu tracking
    • Thêm tab Analytics trong admin — theo dõi truy vấn tìm kiếm theo thời gian thực
    • Ghi lại các truy vấn dựa trên từ khóa (số kết quả, thời gian, nguồn, người dùng)
    • Lưu log bằng transient có xoay vòng — nhẹ, không lưu dữ liệu cá nhân
    • Gộp các truy vấn tương tự và sắp xếp theo tần suất (JS phía client)
    • Hỗ trợ xuất CSV và xoá log với bảo vệ nonce
    • Cải tiến hệ thống tracking:
      • Chỉ ghi lại các từ khóa thực sự — bỏ qua lệnh slash như /recent, /fav
      • Bỏ qua truy vấn rỗng hoặc chứa toàn ký tự đặc biệt
    • Nâng cấp UX trong admin: nút nhóm kết quả rõ ràng, responsive, dễ thao tác
    • Bảo vệ tất cả form bằng nonce
    • Refactor nội bộ:
      • Làm gọn hook & filter liên quan đến tracking
      • Đổi tên file analytics.php → tracking.php để tránh xung đột khi hiển thị log
  • 1.6 – Mở rộng UI & hỗ trợ preset style
    • Thêm tuỳ chọn chọn trước giao diện với các preset style dựng sẵn: style-full.css, style-topbar.css
    • style-full.css: mở modal toàn màn hình, hỗ trợ hiển thị như một lớp overlay độc lập
    • style-topbar.css: giao diện thanh tìm kiếm nổi trên đầu trang, giống Spotlight hoặc thanh admin
    • Cho phép override style bằng cách đặt file init-live-search/style.css trong theme hiện tại
    • Thêm tuỳ chọn “Tắt toàn bộ CSS mặc định” — phù hợp với developer muốn tự thiết kế lại UI
    • Cải thiện UI mặc định: căn lề hợp lý hơn trên mobile, khoảng cách giữa các phần tử đồng đều
  • 1.5.4 – Tìm kiếm trong SEO Metadata
    • Thêm tính năng Search in SEO Metadata — cho phép tìm kiếm trong tiêu đề SEO và mô tả SEO được tạo bởi plugin SEO
    • Hỗ trợ các plugin: Yoast SEO, Rank Math, AIOSEO, The SEO Framework, SEOPress
    • Có thể bật/tắt trong phần cài đặt admin
    • Tối ưu hóa thuật toán để phân biệt rõ các chế độ: title, title_tag, title_excerpt
    • Thêm filter init_plugin_suite_live_search_seo_meta_keys — tùy chỉnh các meta key SEO được dùng để so khớp
    • Thêm filter init_plugin_suite_live_search_weights — kiểm soát thứ tự kết quả bằng trọng số giữa các nguồn khác nhau
  • 1.5.3 – Hỗ trợ ACF & đa ngôn ngữ
    • Hỗ trợ tìm kiếm trong các trường tùy chỉnh của ACF — thêm tuỳ chọn nhập danh sách field key trong phần cài đặt (ví dụ: company_name, project_code)
    • Chỉ tìm kiếm các bài viết đã xuất bản và áp dụng fallback thông minh (tách từ, bigram)
    • Thêm filter init_plugin_suite_live_search_post_ids để kiểm soát danh sách kết quả từ ACF và các nguồn khác
    • Tự động phát hiện ngôn ngữ hiện tại với WPML hoặc Polylang, lọc kết quả theo ngôn ngữ
    • Thêm filter init_plugin_suite_live_search_filter_lang để giới hạn kết quả theo ngôn ngữ hiện tại
    • Thêm filter init_plugin_suite_live_search_category_taxonomy — tùy chỉnh taxonomy dùng để hiển thị tên danh mục (ví dụ dùng product_cat cho sản phẩm WooCommerce)
    • Cải thiện hiệu suất truy vấn ACF: chỉ join bài viết đã xuất bản, tránh lặp ID không cần thiết
    • Hoàn thiện tài liệu filter, đồng bộ bản dịch và nội dung hướng dẫn
  • 1.5.2 – Init Smart Tag-Aware Search
    • Thêm chế độ tìm kiếm mới: Init Smart Tag-Aware Search — kết hợp tiêu đề và thẻ bài viết, tự động tách từ để khớp với các tag ngắn như php, css, seo
    • Tooltip Quick Search giờ hỗ trợ cả khi chọn 1 từ duy nhất (trước đây cần chọn 2 từ trở lên)
    • Cải thiện UX cho slash command: hiển thị rõ trạng thái loading và tải thêm kết quả mượt mà hơn
    • Chuẩn hóa hiển thị kết quả sản phẩm WooCommerce: nhãn giảm giá, trạng thái hết hàng, căn lề chính xác
    • Refactor nội bộ: tối ưu xử lý fallback, keyword, và logic parser khi nhập sai slash command
  • 1.5.1 – Tích hợp WooCommerce & mở rộng slash command
    • Hỗ trợ tìm kiếm sản phẩm WooCommerce qua các slash command: /product, /on-sale, /stock, /sku, /price
    • Hiển thị giá sản phẩm, nhãn giảm giá, trạng thái hết hàng và nút Add to Cart trong danh sách kết quả
    • Thêm lệnh /price {min} {max} để lọc sản phẩm theo khoảng giá (qua REST API)
    • Chuẩn hóa infinite scroll cho các lệnh liên quan đến sản phẩm
    • Thêm nhãn trực quan cho trạng thái “Sale” và “Sold out”
    • Lọc slash command theo post type sản phẩm — chỉ hiển thị nếu đã bật product trong cài đặt
    • Cải thiện điều hướng bằng bàn phím trong danh sách slash command (tự scroll nếu quá dài)
    • Tối ưu logic JS để xử lý hiển thị nút giỏ hàng và trạng thái kho hàng
    • Cải thiện độ chính xác khi tìm theo SKU và lọc giá
    • Sửa lỗi nhỏ: nút yêu thích (.ils-fav-btn) tự thêm class active sai khi không phải lệnh /fav
  • 1.5 – Tăng cường thao tác nhanh & hỗ trợ yêu thích
    • Thêm tooltip “Quick Search” khi bôi đen 2–8 từ, cho phép mở nhanh modal và tìm kiếm ngay
    • Hỗ trợ thuộc tính data-ils trên bất kỳ phần tử HTML để mở modal và điền sẵn lệnh slash
    • Thêm lệnh /fav và /fav_clear để quản lý danh sách yêu thích bằng localStorage
    • Cho phép thêm/xoá bài viết yêu thích ngay trong danh sách kết quả bằng biểu tượng ngôi sao
    • Cải thiện hệ thống lệnh nội bộ: hiển thị chính xác kết quả theo trạng thái, hỗ trợ reset bộ lọc
    • Tối ưu logic hiddenUrl: tự động reset nếu không có kết quả được chọn
    • Chuẩn hoá hành vi mở modal từ nhiều điểm kích hoạt khác nhau để đảm bảo trải nghiệm nhất quán
    • Refactor mã nguồn: chuẩn bị cho khả năng mở rộng mà không ảnh hưởng đến API hoặc HTML hiện tại
  • 1.4.3 – Hoàn thiện hệ thống slash command & tối ưu UI
    • Hỗ trợ phân trang/infinite scroll cho các lệnh: /recent, /date, /tax, /read
    • Tối ưu UI: suggestion pills hiển thị mượt mà, dễ thao tác trên mobile
    • Thêm sự kiện JS cho developer: ils:modal-opened, ils:modal-closed, ils:results-loaded, ils:search-started
    • Trải nghiệm bàn phím tốt hơn: điều hướng gợi ý, command và kết quả đều ổn định
    • Lệnh /clear chỉ xóa các cache bắt đầu bằng ils-cache-*, an toàn hơn
    • Tối ưu toàn bộ logic render, tránh lỗi scroll hoặc layout nhảy khi nhiều kết quả
    • Refactor mã nguồn: phân tách rõ UI, cache, command, event — dễ bảo trì
    • Không còn lỗi console — sẵn sàng cho production trên các site lớn
  • 1.4.2 – Nâng cấp UX và hỗ trợ liên kết mở rộng
    • Gợi ý slash command theo thời gian thực khi gõ /
    • Cải tiến điều hướng bằng bàn phím, tránh lỗi chọn nhầm
    • Thêm tùy chọn tắt toàn bộ slash command nếu không dùng
    • Hỗ trợ mở modal qua ?modal=search hoặc #search
    • Cho phép truyền sẵn từ khóa hoặc slash command qua URL bằng ?modal=search&term=/related
    • Ngăn trang reload nếu click vào link chứa modal=search — mở modal ngay lập tức bằng JS
  • 1.4.1 – Mở rộng Slash Command & cải thiện UX
    • Thêm các slash command mới: /related, /read, /random, /categories, /tags, /help, /clear, /reset
    • Thêm tùy chọn bật/tắt nhập liệu bằng giọng nói trong phần cài đặt
    • Lệnh /read: hiển thị danh sách bài viết đã xem gần đây (lưu bằng localStorage, không cần REST API)
    • Lệnh /related: gợi ý bài viết liên quan dựa trên tiêu đề trang hiện tại
    • Lệnh /categories và /tags: hiển thị danh mục và thẻ phổ biến dạng nút nhỏ gọn
    • Giao diện slash command helper được tích hợp sẵn trong modal
    • Refactor logic command trong JS để dễ mở rộng và xử lý fallback tốt hơn
    • Cải tiến UI: giao diện dạng pills và hỗ trợ i18n đầy đủ cho tất cả lệnh
  • 1.4 – Tìm kiếm theo lệnh & tối ưu REST API
    • Hỗ trợ slash command: /recent, /popular, /category, /tag, /date, /id
    • Xử lý lệnh /date linh hoạt theo định dạng Y, Y/m, Y/m/d
    • Nhảy thẳng đến bài viết bằng /id {post_id}
    • Tạo endpoint riêng cho từng lệnh: /recent, /date, /tax (không dùng API mặc định của WordPress)
    • Cache kết quả slash command trong localStorage – mỗi lệnh chỉ gọi API 1 lần
    • Thêm filter mới cho developer:
      • init_plugin_suite_live_search_query_args – chỉnh WP_Query trước khi gọi
      • init_plugin_suite_live_search_default_thumb – ảnh mặc định nếu thiếu thumbnail
    • Thêm tùy chọn bật/tắt từng trigger riêng: Ctrl + /, triple-click, input[name="s"]
    • Refactor toàn bộ JS: tách riêng command-based logic, dễ mở rộng
  • 1.3 – Nâng cấp UX & chuẩn hóa mã nguồn
    • Thêm phím tắt Ctrl + / để mở nhanh modal
    • Thêm thao tác triple-click (3 lần nhấp liên tiếp) để mở modal
    • Hiển thị loại post (Post, Page, v.v.) bên cạnh mỗi kết quả
    • Tự động tạo bộ lọc danh mục từ kết quả tìm kiếm (không cần API)
    • Cải tiến UX: nút tìm kiếm chuyển thành nút xoá khi có nội dung
    • Chuẩn hóa toàn bộ mã nguồn:
      • Prefix chuẩn: init_plugin_suite_live_search_*
      • REST API namespace: initlise/v1
      • Biến JS toàn cục: window.InitPluginSuiteLiveSearch
  • 1.2 – Bản mở rộng dành cho lập trình viên
    • Hỗ trợ nhập liệu bằng giọng nói (thử nghiệm) qua SpeechRecognition API
    • Thêm filter cho developer:
      • init_plugin_suite_live_search_enable_fallback
      • init_plugin_suite_live_search_post_ids
      • init_plugin_suite_live_search_result_item
      • init_plugin_suite_live_search_results
    • Tuỳ chọn mới:
      • Bật/tắt fallback (rút gọn từ khóa, ghép đôi cụm từ)
      • Bật/tắt tự động nạp CSS mặc định
    • Hỗ trợ dark mode qua class hoặc biến JS
  • 1.1 – Phiên bản cập nhật lớn
    • Nâng cấp thuật toán fallback: thử từ khóa rút gọn, ghép đôi từ (bigrams)
    • Nhớ lại từ khóa đã tìm khi mở lại modal
    • Giới hạn đầu vào: tối đa 100 ký tự
    • Tùy chọn mới:
      • Cache kết quả trong localStorage
      • Tự động gắn UTM từ URL vào liên kết kết quả
    • Hỗ trợ dark mode qua class hoặc biến JS
  • 1.0 – Phiên bản đầu tiên
    • Phát hành bản ổn định đầu tiên
    • Hỗ trợ tìm kiếm dạng modal sử dụng REST API
    • Điều hướng bằng bàn phím (Arrow, Enter, Escape)
    • Cài đặt từ khóa gợi ý, hỗ trợ tạo tự động
Made with in HCMC.

Các plugin khác

Bình luận

2 bình luận