How to Add Blog Template Builder to Search Page

Search results can be shown in a layout you build in Elementor. The search header stays; the template takes over the list of results, with one block set to Use WP Global Query so it shows what the reader searched for.

To get started, follow the steps below:

1. Create your template at Dashboard > Ruby Templates and copy its shortcode. The template needs one listing block to show the results: drag Foxiz - Grid 1 or, for a plain list of results, Foxiz - Classic in from the Elementor panel. Step 2 lists every block that can do the job. To create a template, you can refer to this documentation: Ruby Templates

   

2. In the template, click the listing block and, in its settings panel, open Content > Template Builder - Global Query > Query Mode. The section is called Template Builder - Global Query, and it appears only while you edit a Ruby Template. It exists on fifteen Foxiz blocks:

   • Classic: Foxiz - Classic
   • Grids: Foxiz - Grid 1, Foxiz - Grid 2 and Foxiz - Small Grid
   • Boxed grids: Foxiz - Boxed Grid 1 and Foxiz - Boxed Grid 2
   • Flex grids: Foxiz - Flex Grid 1 and Foxiz - Flex Grid 2
   • Lists: Foxiz - List 1, Foxiz - List 2 and Foxiz - Flex List
   • Boxed lists: Foxiz - Boxed List 1 and Foxiz - Boxed List 2
   • Overlays: Foxiz - Overlay and Foxiz - Flex Overlay

3. Select Use WP Global Query for displaying the main blog listing. The block then lists the posts WordPress would show on the search page, as that page's main listing.

   

4. Set WP Global Query Pagination, the next control down, to Numeric. Its default, - Disable -, shows only the first page of results. Show More (ajax) also works here, and keeps the search term for the next results.

5. Navigate to Theme Options > Search Page > Global Listing Template. Search Page is a top level panel.

6. Input a ruby template shortcode into the or Use Ruby Template for the Post Listing input. It overrides the Predefined Layout picker above it, which defaults to Small Grid for search results; leave the shortcode blank and that picker is what you get.

   

7. Click save changes.

   One thing only the search page has to worry about: a search that finds nothing renders no listing, so anything you built into the listing template disappears with it. If your template carries the search form or the results heading, give that part a template of its own:

   1. Move that part into a second template, and copy its shortcode.
   2. In the Search Header group of the same Search Page panel, set Search Header Layout to Use Top Template.
   3. Paste the shortcode into Top Template Shortcode, which the panel reveals at that value.

   

Notes when using WP Global Query:

note

Don't apply the WP global query mode for more than 1 block in a template to avoid duplicated layouts.

The Query Settings are ignored in WP global query mode. The fields stay visible and are never read: in global mode the block shows the search results, whatever the filters say.

Unique Post, in its own Unique Post section, is the one query setting that survives global mode: it re-runs the query without the posts an earlier block on the page already used. Its default is Disable.

Use WP Global Query Pagination instead of Ajax Pagination: the Ajax Pagination settings are ignored in WP global query mode. WP Global Query Pagination is in the same Template Builder - Global Query section and its default is - Disable -, and at that value the results get no pagination at all. Pick Numeric, Simple, Show More (ajax) or Infinite Scroll (ajax) instead. Both AJAX values work on a search listing, and the search term is carried into each further page.

To change the number of posts per page, navigate to Theme Options > Search Page > Posts per Page. Leave it blank and the search page uses the WordPress Settings > Reading value.

Tip: set Number of Posts in the block's Query Settings to the number the page shows on the front end, so the editor preview looks like it. That number is for the editor only and the plugin's own tip says it will not apply on the front end.

The "WP global query mode" layout cannot execute in this live editor. Check the result on the front end, once the template is assigned.