Tổng hợp code giúp tùy biến khung tìm kiếm (Search form) trong Genesis.
Nếu bạn đang gặp vấn đề với việc Việt hóa hay tùy biến khung tìm kiếm (Search form) trong Genesis Framework và Genesis child theme thì bài viết này là dành cho bạn. Ở đây, tôi đã tổng hợp một số code snippets giúp tùy biến khung tìm kiếm một cách nhanh chóng và dễ dàng. Tất cả những gì bạn cần làm là thêm chúng vào file functions.php của child theme mà bạn đang sử dụng.
Tham khảo thêm:
- Tổng hợp code tùy biến Author Box trong Genesis
- Tổng hợp code tùy biến nút điều hướng trong Genesis
- Tổng hợp code tùy biến khung bình luận trong Genesis
Code tùy biến khung tìm kiếm trong Genesis
Lưu ý: backup file functions.php của Genesis Framework hoặc Genesis child theme trước khi chèn code để tránh các rủi ro đáng tiếc có thể xảy ra. Nếu sau khi chèn code, website gặp vấn đề về khả năng hiển thị, các bạn có thể khắc phục bằng cách sử dụng một trong các giải pháp sau:
- Restore file
functions.phpđã backup trước đó. - Truy cập File Manager của cPanel/ DirectAdmin hoặc FTP, tìm file
functions.php, mở ra và xóa đoạn code vừa thêm vào.
Các bạn cũng có thể sử dụng plugin Code Snippets để chèn nhằm tránh nó bị xóa mất khi cập nhật theme.
Tùy biến dòng chữ trong khung nhập dữ liệu
//* Tùy biến dòng chữ trong khung nhập dữ liệu tìm kiếm của Genesis
add_filter( 'genesis_search_text', 'sp_search_text' );
function sp_search_text( $text ) {
return esc_attr( 'Tìm kiếm trên blog của tôi...' );
}
Tùy biến nút tìm kiếm
//* Tùy biến nút tìm kiếm trong Genesis
add_filter( 'genesis_search_button_text', 'sp_search_button_text' );
function sp_search_button_text( $text ) {
return esc_attr( 'Tìm kiếm' );
}
Tùy biến nhãn của khung tìm kiếm
//* Tùy biến nhãn của khung tìm kiếm trong Genesis
add_filter( 'genesis_search_form_label', 'sp_search_form_label' );
function sp_search_form_label ( $text ) {
return esc_attr( 'Khung tìm kiếm' );
}
Xóa cache website (nếu có) và kiểm tra kết quả. Thật tuyệt vời phải không nào? Chúc các bạn thành công!
Bạn biết những đoạn code hay phương pháp nào khác để tùy biến khung tìm kiếm trong Genesis? Hãy chia sẻ nó với chúng tôi bằng cách sử dụng khung bình luận bên dưới.
Nếu bạn thích bài viết này, hãy theo dõi 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 nhé. Cảm ơn rất nhiều. :)
Anh ơi! làm sao để có khung tìm kiếm như anh vậy, có thể cho em xin code được không anh ơi
Ý bạn muốn hỏi cách tích hợp Google Custom Search hay là tích hợp khung tìm kiếm lên menu?
Khung tìm kiếm trên menu giống của anh ý ạ. :)))))
Bạn tham khảo tại đây nhé.
Sau một thời gian dùng Genesis em cảm thấy thích rồi bác ạ! Mình thì ko tùy biến gì nhiều cứ để mặc định nó vậy :P
Làm bộ Genesis + Paradise child theme đi. :3
Cũng đang suy tính đây nhưng cơ mà chưa có ý định bởi lẽ cũng đang thích cái giao diện đang dùng :P
Làm sao chỉnh cái: “You are here >> trang chủ” thành tiếng Việt được vậy ạ
Bạn thử dùng tính năng Breadcrumbs của Yoast SEO để chỉnh xem sao. Truy cập SEO => Advanced => Breadcrumbs. :P
mình muốn tạo cái khung tìm kiếm như trang của Hiếu thì làm thế nào giúp mình với. mình đang xây dựng blog mà gà quá :D
Ruột của nó là Google AdSense Custom Search nhé: https://wpcanban.com/kiem-tien-online/huong-dan-chen-google-adsense-custom-search-vao-blog-wordpress.html. Còn khung tìm kiếm thì bạn view source là sẽ thấy. :P
Chào anh Hiếu.
Cho mình hỏi 1 câu. Mình muốn đưa social icon vào phía bên phải của menu thì không biết phải làm sao.
Mong anh giúp đỡ.
Bạn dùng plugin Simple Social Icons nhé: https://wordpress.org/plugins/simple-social-icons/ :)
Chào anh Hiếu,
Cho mình hỏi 1 câu. Mình muốn chỉnh sửa kích thước của khung tìm kiếm trên phần header (chỉnh chiều cao thấp lại và chiều rộng rộng ra) mà không biết làm thế nào.
Mong anh giúp đỡ.
Bạn tìm trong file functions.php của child theme xem có đoạn code nào quy định kích thước của khung tìm kiếm không? Nếu không có thì bạn click chuột phải vào khung tìm kiếm, chọn “Inspect…” là sẽ thấy những phần bạn cần chỉnh sửa trong style.css để thay đổi kích thước khung tìm kiếm. :)
Cảm ơn anh Hiếu.