Step 1 - adding the template
There is a Search Results template that is already available, so you just have to pick up that one:
Step 2 - Default query settings
Design your page and add your Post List element (or another similar element with a Query option) and , most importantly, KEEP THE DEFAULT QUERY SETTINGS!
Do NOT change the query, the default settings is what we need to make it work properly.
No results?
It should work already. But if you don't see any result (or if you think some results are missing), it's probably because you wrote all your content inside Breakdance.
In that case, check one of these tutorials as we need an extra step to make the search results working :
A better search with Relevanssi Search Plugin
A better search with WP extended Search
Adding Pagination
If you want to control the number of post you want to show in the results page, and add a pagination, once again, do NOT change the query settings.
Instead, go to the Reading settings, and change the Blog pages show at most option:
Then in your Post List element, you can add your pagination:
Tip of the day : Dynamic search results title
How about adding a title that says something like Search results for "xxx" ?
To do so, add a Heading element and click on the icon to add some dynamic data:
Select URL Parameter and click on the little arrow on the left to open the options.
Type "s" for the Parameter Name option.
Open the Advanced settings and write the text you wish to show.
Example:
And then the title of the page will look like this:
Condition for displaying an element if search results are empty
By default, Breakdance doesn't display any information if the search comes up empty.
With the following custom condition, shared by the great Alexander Buzmakov, we can still display a custom text, image or section.
In the search template, open the element settings: Conditions > Only Show Element If > Edit Conditions > +Add Condition > Custom PHP:
$args = array(
's' => $s
);
$the_query = new WP_Query($args);
if ($the_query - > have_posts()) {
return false;
} else {
return true;
}