Oct 31, 2019 | Divi Resources

How to create custom search results page in Divi 4.0

Note: This post was first published in Oct 2019, and has been updated for accuracy and comprehensiveness.

With the release of Divi 4.0 and its new Theme builder, we get many customization options. And creating a custom Divi Search Results page and customizing it, is one of them. Therefore, in this blog post, we will see Divi search result page customization.

It’s very simple and doesn’t require any coding knowledge or design skill. But before you learn how to do that, you may want to check out our new Scout – Divi Search Page Layouts pack—created for the Divi Theme Builder.

Now, let’s go back to where we were, optimizing the search results page.

Following are the steps to create or customize a Divi custom search results page in Divi 4.0.

1. To create a Divi search results page, you have to first add a new template of “Search Results” in Divi Theme Builder.

Divi Theme Builder Search result template

2. Add Custom Body

Custom Body for Divi 4.0 Search Result Page

3. Add Blog module in the Divi Builder area and any other options you want to add in search results.

 

4. Don’t forget to check “Posts for Current Page,” in Blog Module’s Content setting.

Posts For Current Page

According to Elegant Themes, this option simply telling Divi to display the posts that are normally generated whenever a user visits the page.

5. Save it in both Front-end area and Divi Theme Builder Main area. You could also save it in Divi Library, if you want to use it in future.

Now, after saving it, it will look like below screenshots upon searching for particular term.

Customized Search Result page in Divi 4.0

And if pages or search term has featured image, then it will show featured image, too. Below image produced by choosing grid layout in blog module.

Grid Layout of Search result in Divi 4.0

You can also see a live customized Search Result page here created with Divi Theme Builder in Divi 4.0.

The above steps will let you create a custom search result page. But, if you’re looking for some pre-designed beautiful search page layouts, here is Scout, our Divi search result page layout pack

Scout – Divi Search Page Layouts

Would you like to add an advanced search bar? Then check out the Ajax Search Module today!

Posted By:
Vishvendra
Vishvendra believes in the keep learning process and applying those learnings into work. Other than technical writing, he likes to write fiction, non-fiction, songs, and comic ideas. He loves what he writes and writes what he loves. Search his name with "Nathawat," and you'll easily find him over the internet.

4 Comments

  1. Steven Wolff

    I tried this does not work.

    Reply
  2. Gwyneth

    Please make DIVI work with Relevanssi again. With DIVI’s search module, it shows just a few results (or no results at all) for queries which would return several good results with Relevanssi.

    Reply
  3. Nigel Rodgers

    I have multiple post types which each need a unique search template. Any ideas on how to achieve this with Divi?

    Reply

Trackbacks/Pingbacks

  1. How to create custom Divi blog post template | Divi Extended - […] Builder, user can create custom section in the website. Like, custom header and footer section, custom search result page…

Submit a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

4 Comments

  1. Steven Wolff

    I tried this does not work.

    Reply
  2. Gwyneth

    Please make DIVI work with Relevanssi again. With DIVI’s search module, it shows just a few results (or no results at all) for queries which would return several good results with Relevanssi.

    Reply
  3. Nigel Rodgers

    I have multiple post types which each need a unique search template. Any ideas on how to achieve this with Divi?

    Reply

Trackbacks/Pingbacks

  1. How to create custom Divi blog post template | Divi Extended - […] Builder, user can create custom section in the website. Like, custom header and footer section, custom search result page…

Submit a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Divi Flexile Hero Sections – A pack of Ultimate Divi Hero Sections

Divi Flexile Hero Sections – A pack of Ultimate Divi Hero Sections

If you want to put a magnificent impression on the user from the very start of your website, it’s essential that the website's hero section should look engaging and impressive from each angle. Using Divi hero sections of the Divi Flexile Hero Sections pack, it’s easy...

Divi Flexile Footers – A pack of Ultimate Divi Footers

Divi Flexile Footers – A pack of Ultimate Divi Footers

Footers provide users with a lot of useful information, whether it is the footer menu, short info about the business, or social icons. You can use a Divi footer to emphasize your website’s bottom area for better user interaction and get multiple goals fulfilled, such...

How to add an Ajax Add to Cart button to Shop module in Divi

How to add an Ajax Add to Cart button to Shop module in Divi

By default, when you insert the shop module in the Divi theme, you don't get any add to cart button. The shop module only displays products with pricing, sale tag (if the products are on sale), and a sorting filter, but no "Add to Cart." However, you've probably seen...