Sử dụng nhiều search forms trong WordPress

4 tháng ago, Hướng dẫn WordPress, Views
Sử dụng nhiều search forms trong WordPress

Sử dụng Nhiều Search Forms trong WordPress: Hướng dẫn Chi Tiết

WordPress, nền tảng quản lý nội dung (CMS) phổ biến nhất trên thế giới, cung cấp một cách linh hoạt để tạo và quản lý các trang web. Một trong những tính năng quan trọng của bất kỳ trang web nào là chức năng tìm kiếm, cho phép người dùng dễ dàng tìm thấy nội dung họ đang tìm kiếm. Trong hầu hết các trường hợp, một search form duy nhất là đủ. Tuy nhiên, có những tình huống mà việc sử dụng nhiều search forms trên một trang web WordPress có thể mang lại trải nghiệm người dùng tốt hơn và hiệu quả hơn.

Tại Sao Cần Nhiều Search Forms?

Việc sử dụng nhiều search forms không phải lúc nào cũng cần thiết, nhưng trong một số trường hợp nhất định, nó có thể mang lại những lợi ích đáng kể. Dưới đây là một số lý do chính:

  • Cải thiện Trải nghiệm Người Dùng: Cho phép người dùng tìm kiếm nội dung cụ thể hơn bằng cách sử dụng các search forms được thiết kế riêng cho từng phần của trang web.
  • Tăng Tính Hiệu Quả: Giúp người dùng tìm kiếm thông tin nhanh chóng và dễ dàng hơn bằng cách thu hẹp phạm vi tìm kiếm.
  • Tùy Biến Cao: Cho phép tùy chỉnh các search forms để phù hợp với nhu cầu cụ thể của từng phần của trang web.

Ví dụ, một trang web bán hàng trực tuyến có thể có một search form chung để tìm kiếm tất cả sản phẩm, nhưng cũng có thể có các search forms riêng biệt cho từng danh mục sản phẩm, cho phép người dùng lọc kết quả theo giá, kích thước, màu sắc, v.v.

Các Trường Hợp Sử Dụng Cụ Thể

Dưới đây là một số ví dụ cụ thể về các trường hợp sử dụng mà việc có nhiều search forms có thể hữu ích:

  • Trang Web Thương Mại Điện Tử: Các search forms được lọc theo danh mục sản phẩm, giá, màu sắc, kích thước, và các thuộc tính khác.
  • Blog Tin Tức: Các search forms cho phép tìm kiếm theo chuyên mục, tác giả, ngày tháng, hoặc tag.
  • Trang Web Tài Liệu: Các search forms được thiết kế để tìm kiếm trong các tài liệu cụ thể, chẳng hạn như hướng dẫn sử dụng, câu hỏi thường gặp (FAQ), hoặc API documentation.

Cách Thêm Nhiều Search Forms vào WordPress

Có một vài cách để thêm nhiều search forms vào trang web WordPress của bạn:

1. Sử Dụng Widgets

Cách đơn giản nhất là sử dụng WordPress widgets. WordPress đi kèm với một widget tìm kiếm mặc định. Bạn có thể thêm nhiều bản sao của widget này vào các khu vực widget khác nhau trên trang web của bạn, chẳng hạn như sidebar hoặc footer. Tuy nhiên, widget tìm kiếm mặc định không cung cấp nhiều tùy chỉnh. Để có nhiều tùy chọn hơn, bạn có thể sử dụng các plugins search widgets.

2. Sử Dụng Plugins

Có rất nhiều WordPress plugins được thiết kế để cho phép bạn tạo và quản lý nhiều search forms. Một số plugins phổ biến bao gồm:

  • SearchWP: Một plugin trả phí mạnh mẽ với nhiều tính năng nâng cao, chẳng hạn như tìm kiếm tùy chỉnh fields, tìm kiếm PDF, và tìm kiếm sản phẩm WooCommerce.
  • Relevanssi: Một plugin miễn phí và trả phí cho phép thay thế search engine mặc định của WordPress bằng một search engine mạnh mẽ hơn, với nhiều tùy chọn tùy chỉnh.
  • Ivory Search: Một plugin miễn phí cho phép bạn tạo nhiều search forms và tùy chỉnh chúng cho các khu vực khác nhau trên trang web của bạn.

Chọn một plugin phù hợp với nhu cầu và ngân sách của bạn.

3. Sử Dụng Code Tùy Chỉnh

Nếu bạn là một nhà phát triển WordPress hoặc có kiến thức về PHP, bạn có thể tạo các search forms tùy chỉnh bằng cách sử dụng code. Cách này cho phép bạn kiểm soát hoàn toàn chức năng và giao diện của search forms của bạn.

Để tạo một search form tùy chỉnh, bạn có thể sử dụng hàm `get_search_form()` của WordPress. Hàm này tạo ra một form HTML cho phép người dùng nhập từ khóa tìm kiếm. Bạn có thể tùy chỉnh form này bằng cách thêm các tham số vào hàm, chẳng hạn như `echo`, `aria_label`, và `template`.

Ví dụ:


<form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>">
    <label>
        <span class="screen-reader-text">Tìm kiếm:</span>
        <input type="search" class="search-field" placeholder="Nhập từ khóa…" value="<?php echo get_search_query(); ?>" name="s" title="Tìm kiếm:" />
    </label>
    <input type="submit" class="search-submit" value="Tìm kiếm" />
</form>

Bạn có thể đặt code này vào một file template của theme của bạn, hoặc tạo một shortcode để dễ dàng chèn form vào bất kỳ trang hoặc bài viết nào.

Ví Dụ: Tạo Search Form Riêng Cho Danh Mục Sản Phẩm WooCommerce

Giả sử bạn có một trang web thương mại điện tử sử dụng WooCommerce. Bạn muốn tạo một search form riêng cho mỗi danh mục sản phẩm, cho phép người dùng tìm kiếm chỉ trong danh mục đó.

Để thực hiện điều này, bạn có thể sử dụng một plugin như Ivory Search hoặc tạo một code tùy chỉnh. Dưới đây là một ví dụ sử dụng code tùy chỉnh:

  1. Tạo một shortcode: Tạo một shortcode trong file `functions.php` của theme của bạn. Shortcode này sẽ nhận ID của danh mục sản phẩm làm tham số.
  2. Lấy ID danh mục: Trong shortcode, lấy ID của danh mục sản phẩm từ tham số.
  3. Tạo search form: Tạo một search form HTML. Thêm một hidden field chứa ID của danh mục sản phẩm.
  4. Lọc kết quả tìm kiếm: Khi người dùng gửi form, lọc kết quả tìm kiếm để chỉ hiển thị các sản phẩm thuộc danh mục được chỉ định.

Ví dụ Code:


function category_search_form( $atts ) {
    $atts = shortcode_atts( array(
        'category_id' => '',
    ), $atts );

    $category_id = $atts['category_id'];

    $form = '<form role="search" method="get" class="category-search-form" action="' . home_url( '/' ) . '">
        <label>
            <span class="screen-reader-text">Tìm kiếm trong danh mục:</span>
            <input type="search" class="search-field" placeholder="Nhập từ khóa…" value="' . get_search_query() . '" name="s" title="Tìm kiếm:" />
        </label>
        <input type="hidden" name="product_cat" value="' . $category_id . '" />
        <input type="submit" class="search-submit" value="Tìm kiếm" />
    </form>';

    return $form;
}
add_shortcode( 'category_search', 'category_search_form' );

function filter_search( $query ) {
    if ( ! is_admin() && $query->is_main_query() ) {
        if ( isset( $_GET['product_cat'] ) && ! empty( $_GET['product_cat'] ) ) {
            $query->set( 'tax_query', array(
                array(
                    'taxonomy' => 'product_cat',
                    'field'    => 'id',
                    'terms'    => $_GET['product_cat'],
                ),
            ) );
        }
    }
}
add_action( 'pre_get_posts', 'filter_search' );

Sau khi thêm code này vào file `functions.php` của theme, bạn có thể sử dụng shortcode `[category_search category_id=”123″]` (thay `123` bằng ID của danh mục sản phẩm) để chèn search form vào trang danh mục sản phẩm.

Lời Khuyên và Lưu Ý

Khi sử dụng nhiều search forms, hãy xem xét các lời khuyên và lưu ý sau:

  • Thiết kế rõ ràng: Đảm bảo rằng mỗi search form có một nhãn rõ ràng cho biết nội dung mà nó sẽ tìm kiếm.
  • Vị trí chiến lược: Đặt các search forms ở những vị trí dễ thấy và dễ truy cập, chẳng hạn như trên đầu trang, sidebar, hoặc trong nội dung của trang.
  • Tối ưu hóa hiệu suất: Nếu bạn sử dụng nhiều search forms, hãy đảm bảo rằng trang web của bạn vẫn tải nhanh. Sử dụng các kỹ thuật caching và tối ưu hóa code để cải thiện hiệu suất.

Kết Luận

Việc sử dụng nhiều search forms trong WordPress có thể là một cách tuyệt vời để cải thiện trải nghiệm người dùng và tăng tính hiệu quả của trang web của bạn. Bằng cách cung cấp các search forms được thiết kế riêng cho từng phần của trang web, bạn có thể giúp người dùng tìm thấy thông tin họ đang tìm kiếm một cách nhanh chóng và dễ dàng. Hãy cân nhắc các trường hợp sử dụng cụ thể của bạn và chọn phương pháp phù hợp nhất để thêm nhiều search forms vào trang web WordPress của bạn.

Related Topics by Tag
, , , ,

..