Learn how to enhance the search experience in Genesis Framework child themes with a few lines of code.
In general, search within a WordPress website can be much better. And I’m not just talking about the search engine (which also could) but the way the results are displayed.
Regarding this, Yoast’s team published a post suggesting tweaks to take care of the user experience when searching. When I researched a little more about this topic I found this fantastic post by Sal Ferrarello in which he tells how to apply it in Genesis.
Based on both sources, I’ve adapted the code so you can use it in 3 different ways in Genesis Framework, depending if you are working on your own project or for a client:
- Adding it to the functions.php of the child theme.
- Creating a small plugin ready to install.
- Adding it to your functionality plugin.
The last two options have a clear advantage: they will not be affected by updates or a change of theme.
Note, however, that this plugin will only make sense while you are using Genesis.
Ready?
Instructions to improve your search in Genesis Framework
Option 1: modify functions.php
If you prefer to apply the changes directly to the Genesis child theme, add this snippet to the end of the functions.php file:
To see this and another 1097 code snippets of this website, login or subscribe here.
Option 2: create a plugin
If you prefer to manage the improvement of searches with a small plugin, add a new folder called, for example, “search-improved-genesis “.
Within it, create a file called “search-improved-genesis.php” with the following content:
To see this and another 1097 code snippets of this website, login or subscribe here.
Place this new folder (with the file) inside the WordPress Plugins folder (/wp-content/plugins/).
Once you’ve taken this last step, you’ll be able to activate it from the WordPress administration, as if it were just another plugin. 😉
Of course, you can change its name and the rest of the header to your liking. The idea is that this example serves as a reference.
Option 3: Add it to your Plugin
If you already have a functionality plugin and you prefer to manage the improvement of searches from it, add the following code at the end of the file:
To see this and another 1097 code snippets of this website, login or subscribe here.
You got it.
Final result
No matter what strategy you use, with this code you get to:
- Show the metadescription in the search.
- Emphasize the search term in the title.
- Limit the metadescription and highlight the search term in it.
- Create a “keep reading” link.
Thanks to these features, the user experience on the web gains several points, I assure you.
Conclusions
Do you also think that the search within WordPress could be much better?
Take advantage of the previous code snippets, either by adding them or building your own plugin, and make the display of search results more intuitive in any Genesis child theme.
Any questions? Let me know in the comments.
And if you want to give me any suggestion for future tutorials, leave it in the contact form. Advantages of being a subscriber. 😉