Tạo form tìm kiếm bằng shortcode trong WordPress

Bạn muốn thêm form tìm kiếm vào bài viết, trang, hoặc sidebar của website?

Thêm form tìm kiếm vào nội dung bài viết hoặc trang của bạn là một cách tốt để khuyến khích người dùng tìm thấy nhiều nội dung hơn và ở lại trang web của bạn lâu hơn.

Hôm nay mình sẽ hướng dẫn các bạn cách tạo form tìm kiếm bằng shortcode trong WordPress.

tạo form tìm kiếm bằng shortcode

Tại sao lại cần phải thêm form tìm kiếm vào website?

Nếu người dùng đã thích đọc một bài đăng trên blog của bạn, thì họ có thể sẽ muốn đọc thêm. Hiển thị một form tìm kiếm trên website sẽ giúp họ tìm thấy nhiều nội dung hơn để đọc. Điều này cũng giúp bạn tăng lượt tải trang và giảm tỉ lệ thoát.

Trong bài viết này, mình sẽ chỉ cho bạn cách thêm form tìm kiếm WordPress vào website của bạn. Cùng mình bắt đầu thôi!

Tạo form tìm kiếm bằng shortcode

Đầu tiên, hãy chỉnh sửa file functions.php của theme bạn đang kích hoạt. Thêm vào đoạn code sau:

add_shortcode('wpbsearch', 'get_search_form');

Sau đó, bạn chỉ cần thêm shortcode [wpbsearch] vào bài đăng, trang hoặc bất kì đâu mà bạn muốn form tìm kiếm xuất hiện.

Nếu bạn muốn hiển thị một form tìm kiếm tùy chỉnh, thì bạn có thể sử dụng đoạn code này để thay thế.

function wpbsearchform( $form ) {
   
    $form = '<form role="search" method="get" id="searchform" action="' . home_url( '/' ) . '" >
    <div><label class="screen-reader-text" for="s">' . __('Search for:') . '</label>
    <input type="text" value="' . get_search_query() . '" name="s" id="s" />
    <input type="submit" id="searchsubmit" value="'. esc_attr__('Search') .'" />
    </div>
    </form>';
   
    return $form;
}
   
add_shortcode('wpbsearch', 'wpbsearchform');

Lúc này bạn có thể thêm placehoder vào ô input, hoặc thay đổi nhãn của nút submit.

Ngoài ra bạn còn có thể sử dụng CSS để tuỳ biến giao diện sao cho phù hợp.

Lời kết

Hy vọng hướng dẫn này sẽ giúp bạn biết cách làm thế nào để thêm form tìm kiếm bằng shortcode.

Nếu bài viết này hữu ích và giúp tiết kiệm được thời gian của bạn, hãy giúp mình chia sẻ nó. Ngoài ra nếu bạn quan tâm đến các chủ đề tương tự như vậy, hãy đọc các bài viết Thủ thuật WordPress khác và follow Fanpage để không bỏ lỡ bài viết mới từ mình nhé.

4.8 4 votes
Đánh giá bài viết
Quang Phúc:
Leave a Comment