Do you want to create your own custom page layouts in WordPress ?
Elementor is a drag-and-drop WordPress page builder that allows you to easily create custom WordPress layouts without the need for any code knowledge. In this article, we’ll show you how to easily create custom WordPress layouts using Elementor with just a few clicks.
Why and when do you need custom WordPress layouts ?
Many free and premium WordPress themes come with multiple layout options for different type of pages. However, sometimes none of these layouts meets your requirements.
If you know how to program in PHP, HTML and CSS, you can create your own page templates or even create a sub-theme for your site.
However, the majority of WordPress users are not developers, so this option does not work for them.
Wouldn’t it be great if you could just create page layouts using the drag-and-drop interface
This is exactly what Elementor does . Elementor It is an add-on for creating WordPress pages that allows you to easily create your own custom WordPress layouts without any coding skills.
It has an intuitive user interface that allows you to create custom layouts with a live preview. It comes with many ready-to-use modules for all kinds of web design elements.
There are many professionally designed templates that you can download and use immediately as a starting point. It works with all standard compatible WordPress themes and is compatible with all popular WordPress plugins .
Having said that, let’s take a look at how to create custom WordPress layouts using Elementor.
Getting started with Elementor
First you will need to purchase the Elementor Pro plugin . It is the paid version of the free Elementor plugin and gives you access to additional features and support for one year.
After that, you will need to install and activate the Elementor plugin. For more details, see our step-by-step guide on how to install WordPress plugins .
When activated, you need to visit the Elementor ” settings page to configure the plugin settings.
Here you can enable Elementor for different types of publications . By default, it is enabled for your WordPress posts and pages. If you have custom post types on your site, these will also appear here, and you can enable them as well.
You can exclude or include user roles that can use Elementor when writing posts or pages. By default, it is enabled only for administrators.
Don’t forget to click on the Save Changes button to store your settings.
Create a custom WordPress layout using Elementor
First you need to create a new page (or post) on your WordPress site. On the post editing screen, you will notice the new “edit with Elementor” button.
Clicking on it will launch the Elementor user interface where you can edit your page using Elementor’s drag-and-drop page builder.
Now you can add sections and build your page from scratch, or you can add a template.
Templates are a faster way to get started quickly. Elementor comes with many professionally designed templates that you can customize as much as you want.
Let’s start with a form by clicking the “add Form”button.
This will bring up a pop-up window where you will be able to see the various templates available. You should look for a template similar to what you have in mind for your page layout.
Click now to select the template you want and then click the “Insert” button to add it to your page.
Elementor will now upload the template for you.
Now you can start modifying the model to suit your needs. Just point and click on any item to select it, and Elementor will show you its settings in the left column.
Now let’s talk about how Elementor layouts work.
Element layouts are created using sections, columns and widgets. Sections are like rows or blocks that you place on your page.
Each section can have multiple columns and each section and column can have its own styles, colors, content, etc.
You can add anything in your columns and sections using the Elementor widgets.
These tools are a different kind of content blocks that you can place in your Elementor sections.
Just select a widget and drop it into the section or column. There are a wide range of tools available that cover all the popular web design elements you can think of.
You can add photos, texts, titles, photo galleries, videos, maps, icons, testimonials, slider, carousels and much more.
You can also add default WordPress widgets and even widgets created by other WordPress plugins on your site.
Once the editing is done, you can click the “Save” button to save the changes.
Note: saving the format will not publish the page on your WordPress site. It will only save the layout of your page.
Now you can preview your page or go to the WordPress dashboard.
This will take you back to the WordPress post editor. Now you can save your WordPress page or publish it on your website.
Create your own forms in Elementor
Elementor allows you to save your custom formats as templates. This way you can reuse your templates to create new pages faster in the future.
Just edit the page you want to save as a template using Elementor.
In the Elementor builder interface, click on the folder icon next to the Save button and then select “Save form”.
This will bring up a pop-up window where you need to provide a name for your template and click the Save button.
The next time you create a custom page layout, you will be able to select it from the “My Templates”tab.
You can also export this template and use it on other WordPress sites using Elementor.
You will need to visit the Elementor ” Library page to see the saved templates. Hover over the name of your form, and then click on the “export form”link.
After downloading your template file, you can go to the library page on another WordPress site using Elementor and then import your template.
That’s all for now.
We hope this article helped you learn how to create custom WordPress layouts using Elementor.