Stand with Ukraine. Fight for freedom and democracy

Donate
Back to contents

JetThemeCore: How to Create WordPress Page Template for Certain Request

 

This tutorial describes creating page templates for certain requests and adding such a condition to the dedicated header, body, or footer template with the JetThemeCore WordPress plugin.

Tutorial requirements:

  • JetThemeCore 2.0 plugin version installed and activated;
  • Upload the Elementor free version, or you can use the default WordPress Block Editor for the template creation; 
  • Set search on the website to use the URL Parameter. You can do that with:

With the JetThemeCore 2.0 plugin version, you can create page templates in the Crocoblock > Theme Builder Dashboard tab, add header, body, and footer to them, and set the conditions, which can also be applied to the dedicated template.

To create the templates for certain requests, you can set the conditions in two ways. Also, we will describe how to set the condition with the JetSearch and JetSmartFilters plugins.

How to Create a New Page Template with the URL Parameter Condition

To create a new page template, navigate to Crocoblock > Theme Builder and hit the “Create new page template” button.

crocoblock theme builder

Click on the “Add Condition” button.

add condition button

Select the “Include” (or “Exclude” if you want to hide the template on some devices), “Advanced,” “URL Parameter” options. In the last field, enter a query string (for example, s=wonderful, or qwerty=123). We will further write about query strings in more detail when sharing the use case.

advanced URL parameter condition

Then, push the “Save” button.

In the newly created Page Template window, click on one of the buttons (“Add header,” “Add body,” or “Add footer”) to add a template to the page with the “URL Parameter” condition.

page template header body footer addition

Hit the “Create template” button or add the previously created template to the page by pressing “Add from library.”

create a template or add from library to the page template

You can create a new template in the Elementor editor or WordPress Block Editor (Gutenberg). For that, select the needed Template content type. Then, enter the Template name and press the “Create” button.

create a template or add from library to the page template

After the template creation, click on the “Go to editor” button to proceed to the Elementor or Gutenberg editor. If you press the “Edit later” button, you will return to the Theme Builder page.

go to editor button

You can add the template from the library by clicking on the “Add from library” button. All newly created or editing-ready templates will be kept here even if you remove them from the Page Template.

template library

How to Add the URL Parameter Condition to the Dedicated Template

To add the URL Parameter condition to the existing template, proceed to Crocoblock > Theme Templates and hit the “Edit Condition” button in the needed template.

edit conditions

Hit the “Add condition” button.

add condition button

Select the “Include” (or “Exclude” if you want to hide the template on some devices), “Advanced,” “URL Parameter” options. In the last field, enter a query string (for example, s=wonderful, or qwerty=123).

header with URL parameter condition

Finally, hit the “Save Conditions” button.

How to Use the URL Parameter Condition with the JetSearch Plugin

You can place the Ajax Search widget anywhere on the website, but the most suitable spot is in the header.

Proceed to Crocoblock > Theme Templates and click on the “Add New” button to create a new header or edit the existing one. Keep in mind that the header must be created in the Elementor editor.

In the Elementor editor, drag-n-drop the Ajax Search widget to the header and style and customize it to your needs. Then, hit the “Publish” or “Update” button.

ajax search widget in the header

Let’s create the Page Template for the “wonderful” request.

We’ve moved to Crocoblock > Theme Builder and pushed the “Create new page template” button.

In the page template visibility conditions window, we’ve selected the “Include,” “Advanced,” “URL Parameter” options. In the last field, we’ve entered a query string “s=wonderful,” then hit the “Save” button.

advanced URL parameter condition

We’ve decided to add the header and footer from the library and created the body from scratch.

header and footer templates from the library

We’ve pressed the “Add body” and “Create template” buttons. Then, we’ve selected the “Elementor” Template content type, entered the Template name, and pushed the “Create” button.

body template creation

We’ve ticked the “Go to editor” button and proceeded to the Elementor editor.

You can add any content to the template. We’ve chosen to add the JetEngine Listing Grid widget with tours here. Then, we’ve hit the “Update” button.

jetengine listing grid widget in the body template

We’ve navigated to the front end with the Ajax Search widget and entered the “wonderful” request.

request

As you can see, the page template is applied to the request.

page template for the certain request

In the search string, you can see the URL parameter that we’ve entered into the condition.

URL parameter

If we had entered another request, for instance, “wild nature,” the default templates would be applied.

default template page for another request

How to Use the URL Parameter Condition with the JetSmartFilters Plugin

Be aware that the JetSmartFilters plugin works only with Elementor Pro, JetEngine, and JetWooBuilder plugins.

How to create the Search Filter, you can read more detailed in this tutorial.

We’ve proceeded to the Smart Filters tab on the WordPress Dashboard and hit the “Add New” button.

In the Filter Settings tab, we’ve selected the “Search” Filter Type and Search by “Default WordPress search.” Then, we’ve pushed the “Published” button.

search filter settings
NOTE!
Keep in mind that the filter better be placed on the same page or template with the posts that will be filtered.

On the page edited in the Gutenberg editor, we’ve placed the Search filter block and the Listing Grid with posts.

In the General settings, we’ve selected the created filter, the “Listing grid” option and the “Page reload” Apply type.

NOTE!
Be aware that the template will be applied only to the Search filter with the “Page reload” Apply type.
search filter in the Gutenberg editor

We’ve clicked on the “Update” button.

When we proceeded to the front end, entered the “wonderful” request, and applied the filter, we saw the “jsf=jet-engine&_s=wonderful” URL parameter and copied it.

search filter URL parameter

We’ve moved to Crocoblock > Theme Builder and pushed the “Create new page template” button to create the page template for the “wonderful” request.

In the page template visibility conditions window, we’ve selected the “Include,” “Advanced,” “URL Parameter” options. In the last field, we’ve entered a query string “jsf=jet-engine&_s=wonderful,” then hit the “Save” button.

page template condition for the search filter

To the page template with such a condition, we’ve added header, body, and footer from the template library.

page template with the condition for the search filter

We’ve moved to the front end and entered the “wonderful” request. The page template has been applied to the request.

page template is applied to the request

That’s it. Now you know how to set the URL parameter condition to a certain request and use it with the JetSearch and JetSmartFilters plugins.