If you’ve been using Elementor Pro for a while, you would already be aware of the template library and its selection of pre-made blocks. However, users aren’t limited to the templates provided by Elementor, and in fact, user can create their own as well. If you’ve read and followed our tutorial for Creating Elementor Headers and Footers. You would have already experienced creating your own templates. If you haven’t done that yet, we will walk you through how in this article.
For the rest of this article, we will assume that you have installed and activated the Elementor plugin.
There are many template categories which you can use to classify the Elementor templates. In the image below, you can see all of them.
Although, we can infer the use of each template time from their names, we list them down here and give a brief description of each.
This template is used when creating a single page. This would consist of multiple blocks sections.
These are the templates the sections that compose a page.
- Landing Page
This is a template used for pages which aim to convince a reader to subscribe to a product or service.
This is a template used to create a section on a screen that would appear over a page when an event happens.
This is a template for the topmost section of a page. This would ordinarily contain a page tile, a link, and a navigation menu
This is a template for the bottom most section of a page, it usually contains links and contact information.
- Single Post
This is the template for the posts in a WordPress site which contains a title, content and other data.
- Single Page
This is the template for pages in a WordPress site.
- Archive Page
This template shows all the archived content for the site, categorized and organized by the tags you create for your WordPress site.
- Search Results
This is the template used for search results for that website.
- Error 404
This is the template used for error pages.
How to Create Templates
We will now show how to create a template. To create one, from the admin dashboard, hover on Templates then click on Add New.
This will open the popup below.
Next, choose a template. Then click Create Template. For our example, we will be creating a Popup for template type.
Once the button is clicked, you will be redirected to the Elementor page editor and you will be prompted to choose a pre-made template. For our example, we chose this template.
Once you’ve chosen a template, edit it as you need to:
For our example, we edited our popup to look like this.
Once done with editing, click on Publish.
This will open a popup. Add the condition for the popup to appear on all pages, then click Save & Close.
The template is now created. All created templates work in the same way, so that any template you create will follow the steps that were mentioned.
Using the Created Template
We will now show how to use the template. To use the template, create or edit a new page and click on the Edit with Elementor button in the block editor:
To use the template you’ve created. Click on Add Template. When the pop up appears, click on My Templates hover over the template you want to click, then click Insert. This will insert the template on your page.
However, for our example, since we created a popup we have to configure it differently. For our example, we need to configure a button to make use of it. We create a section with a button and anchor the popup to the button.
Once that is done, it will work as it should below:
All templates can be managed through the templates menus, which can be viewed by clicking on the Templates link on the menu dashboard. Each template is categorized, so click on the template you need to choose.
For instance, to access templates related to a page structure, click on the Theme Builder link. Here we can see all the templates related to a page, such as headers and footers.
Here we can manage each template similar to WordPress Posts/Pages. Each component can be viewed according to its category as seen in their corresponding tabs in the image below.
Aside from that, we can also export and import templates. Here we are exporting templates:
And we can also import templates as well.
Now you’ve learned how to use Elementor templates. Thank You for reading our tutorial.
If you don’t have Elementor Pro installed yet, do it now.