Recently I began working on a blog redesign and my client wasn’t happy with the phrase “Search this website…” inside of the Genesis search box. Additionally, the client wanted to change the text on the search button from “Search” to “Go.” It was time to dig in and research what is needed to customize the Genesis search form.
This simple WordPress tutorial for the Genesis Framework will demonstrate how to accomplished both goals using two WordPress code snippets that you can place into your child theme’s functions.php file.
Warning – Please Read! Even though my tutorials instruct you to add code snippets into your theme’s functions.php file, it’s generally best practice to use a functionality plugin. It will prevent you from getting a White Screen of Death should you mistype any of the Php code that follows.
The Genesis search form can be found in genesis > lib > structure > search.php and contains 3 filters which gives you the ability to customize the following.
1. Genesis Search Form Input Box
If you’re not happy with the default text “Search this website” found inside of the search box, simply apply the filter genesis_search_text to a custom function and change it to your specific needs. The code snippet below demonstrates how to edit the text inside the Genesis search box to “Search my blog…”
Genesis Search Form Input Button
Another filter available is on the Genesis search box is genesis_search_button_text. It defaults the search button text to read “Search” and might now be what everyone wants. The code snippet below demonstrates how you can change the Genesis search form button text to read “Go.”
Genesis Search Form Label
By default the Genesis search form label is blank and uses the value from the search box placeholder. If you want your search form label to be different from the placeholder text, use the genesis_search_form_label filter.
Bonus Customizations to Genesis Search Box
Here are a couple more customizations you can make to the Genesis search box.
Genesis Search Form Destination
For more advanced needs, you can also filter the Genesis search form in order to change the querystring value or to change the destination of your search results page. The code snippet below changes the destination page. It’s the code this website uses in order to take advantage of Google CSE. Read my article How to Use Google CSE with the Genesis Framework if you want to learn how to use Google to power your WordPress searches.
A 508 Compliant Search Box
If you’re running a version of Genesis prior to 2.2 or you’ve elected not to enable full accessibility, have a look at the code below. If you place the code into your theme’s functions.php file you will now have a search box that passes the web accessibility test as it relates to labels.
Line 15 is where you can see that the label was added into the search form.The article How to Customize the Genesis Search Form appeared first on RickRDuncan.com. It was published on and was last updated .