1. Home
  2. Docs
  3. Developer Guide
  4. Elementor
  5. Property Search Results Template

Property Search Results Template

Requirements

Requires Elementor Pro version 3.8 or higher to benefit from their Loop Builder functionality.


Steps To Create a Search Results Page In Elementor

 

Step 1: Create a page in WordPress

Create a normal page in WordPress from within 'Pages' to act as your Search Results page. This might be called something like 'Search Results' or 'Property Search'.

 

Step 2: Select this page in Property Hive settings

From within 'Property Hive > Settings > General' ensure you have the page created in step 1 selected as your 'Search Results Page':

 

Step 3: Create a new Elementor Archive template

Now to create the template in Elementor. Navigate to 'Templates > Theme Builder' and click 'Add New':

 

Select 'Archive':

 

Step 4: Add a search form, result count and order dropdown

If you require a search form, result count, or ability to order properties, drag in the necessary widgets to where you want these to display.

 

Step 5: Add the properties

To add the properties we're going to take advantage of a feature introduced in Elementor Pro 3.8 called 'Loop Builder'. Other third party plugins are available to do a similar thing but in this example we'll use the standard Elementor Pro functionality.

Drag in the 'Loop Grid' widget where you want the properties to display:

You can choose from an existing template if you have one, or create a new loop template whereby you can design how you want each individual property result to look.

 

Step 6: Important: Set the query ID

By default the 'Loop Grid' widget will pull in all properties, regardless of on market status and any filters/order set.
To rectify this we need to enter a query ID.
 
Expand the 'Query' section of the Loop Grid widget and enter the query ID as 'onmarketpropertyquery':

 

Step 7: Enable pagination

Expand the 'Pagination' section of the Loop Grid widget and enable the type of pagination you wish to use.

 

Step 8: Save the template and set the conditions

When you click 'Publish' you'll be asked to specify the conditions in which this template is used. Add a condition and select 'Properties Archive' from the dropdown:

 

Step 9: All done!

That's it. When you view the page selected in step 1, or if someone runs a search, you should now be presented with the template you've just built.

Was this article helpful to you? No 1 Yes

How can we help?