Show Number Of Search Results
When you set up a search results template in the Divi Theme Builder, and then add a search module somewhere on your site, it displays the results very simply like “Search results for [whatever you searched]” But on other sites, it is very common to see the number of results, like “23 results for “Divi” below” with a number. So in this tutorial, I will show you how to add the number of search results to the Divi Theme Builder search results template.
Join subscribers on our YouTube channel and enjoy other Divi video tutorials!
Search Results Template Setup
This tutorial will not cover how to set up the search results template. If you need help with that, I suggest checking our other tutorial: How To Customize And Style The Divi Search Module And Create A Search Results Page.
To get up to where our tutorial starts, you would need to do these steps:
- Create A Theme Builder Template Assigned To “Search Results”
- Add a Blog module and set it to “Show Posts For Current Page”
Be sure to watch the video for this tutorial, it will really help!
1. Add The Shortcode To A Text Module
The first step will be to add a new Text module above the Blog module. This will be used for the main heading that reads out with the number of results. To make this work with a dynamic number, we need to add a shortcode to the Text module. The shortcode will output the code which will say the number of results, like “23 results for “divi”.” The shortcode will be powered by a snippet, which we will talk about in step #2.
Shortcode
[pa_search_results_count] 
2. Add The PHP Code
The second step now is to add the PHP code that is working behind the scenes and connected to the shortcode. This step involves pasting the PHP code snippet below into your website. There are a number of locations to add this, and it will totally depend on your website and experience.
If you have a child theme, then you would add this snippet to the functions.php file of a Divi child theme. If you don’t already have one, you can download our free Divi child theme here.
If you want the easy way, then I will recommend installing the Code Snippets plugin. It is a great plugin that allows you to add snippets easily in the backend of your admin area. After activating, just go to Snippets>Add New, write a title, paste the snippet, and click the save and activate button. Here is how that will look:
Snippet
function pa_search_results_count_shortcode($atts, $content=null){
extract( $atts = shortcode_atts(
array(
'' => '',
), $atts, 'pa_search_results_count' ) );
ob_start();
?>
<?php
global $wp_query;
$items_total = $wp_query->found_posts;
echo $items_total.' Results for "'.get_search_query().'"';
?>
<?php
return ob_get_clean();
}
add_shortcode('pa_search_results_count','pa_search_results_count_shortcode' );Edit The Text
If you want to edit the text, you can easily do so by editing the text within the code. Look for the “Results for” text and this is where you can carefully edit it. For example, you may change it to Search Results For Your Query: and this would read out as “[x] Search Results For Your Query: [search term]”
Great tip, Nelson!
So glad you like it!