Elementor is one of the most powerful WordPress page builders and we have tested it for you.

How can you create a stunning custom page layouts in WordPress? It’s not a problem! In this article, we’ll be going through the most essential features and secrets of the Elementor WordPress plugin which is a hugely popular drag & drop WordPress page builder. It allows you to easily bring your desirable ideas into life without having any coding knowledge. We will show how to use it to create your first section and discuss the pros and cons.

Intrigued? Just keep reading! 

Elementor review and tutorial

Elementor Features Overview

First, let’s look at some features.

  • In case you don’t have extra skills this plugin is your must-have. This page plugin allows you to easily create your own custom WordPress layouts without any coding experiences.
  • One significant aspect that puts this page builder way ahead of everyone else is the price — or lack thereof. It is absolutely free and there are no hidden costs or signups needed. 
  •  New user-friendly interface. On the right, you get a live preview of your site while on the left you have the sidebar with the functions. That’s it!
     You can load various professionally designed templates.
  • You don’t need HTML or PHP knowledge or skills. You can create your custom layout through the profitable user interface.
  • It is compatible with every WordPress Theme.
  • You can save entire pages and sections of pages as templates so that you can reuse them.
  • A custom page template called Elementor Canvas lets you build a page without having any elements originating from your current WordPress theme.
  • Special knowledge coding in HTML, PHP, and CSS would be a big plus and can help you to create your own page templates. 

Additional Features with Elementor Pro

 It’s super easy to purchase Elementor Pro to use more features like theme building, Woocommerce integrations, etc. What else you will get?

  • 50+ advanced widgets
  • use slides
  • get more page templates and content blocks
  • inside Elementor layouts you can display post listings and portfolio.
  • you can work on web forms directly in Elementor (customize fields, spacing, and so on)
  • use global widgets that you can easily add into different areas of the site
  • any block can be implemented with custom CSS
  • deploy Elementor elements in sidebars and widgets

How to Install and Use Elementor

When all advantages are obvious, let’s see how you can add the plugin to your WordPress website and how Elementor works. 

Install Elementor from Elementor.com

  1. Download Elementor for free
  2. Go to your WP dashboard and click Plugin >> Add New.
  3. Click Upload Plugin
  4. Select the file you just downloaded and add it to your plugins.
  5. Once the uploading is finished, activate the plugin.

Install Elementor Via WordPress Dashboard

  • From your WP dashboard click Plugin >> Add New
  • In the search field enter Elementor and launch the research.
  • From the results choose Elementor Page Builder and click Install
  • After installation is complete, click Activate.

How to Start Using Elementor

  • On the WP dashboard menu go to Pages
  • Click “Add New”
  • Click “Publish” on “Edit with Elementor” and you are ready to go.
How to start with elementor
  • This page builder is compatible with WordPress Gutenberg 5.0+. If you use Gutenberg, the button “Edit eith Elementor” will appear within Gutenberg.
Page builder tutorial
  • After doing that the interface will be opened up and you can begin assembling the content on your page. 
how to use elementor page builder

Elementor Settings

What are the helpful settings in the backend?

Search Option

Use the search option to quickly get to the widget that you want to use on your page. You can, however, make this panel completely disappear when previewing your page by clicking the small arrow.  

the search option

You can take a look at some settings by clicking on a hamburger icon in the top left. 

 settings list

Default Colors

The default colors option allows you to choose the default colors that Elementor modules will use when you drag and drop those on your page.

You can set Primary, Secondary, Text and Accent to whatever you want by clicking on it and choosing the color that you want to put on a color code. Different color palettes will make the process easier and faster. 

Setting default colours in Elementor

Global Settings

Global settings are where you can set some default to generic fonts Elementor pages, the content area, and some various spacing items. 

Responsive Mode

Responsive mode allows you to see how your pages are going to look like on a desktop, tablet or even on a mobile phone. Make your design pixel perfect on every device.

you can access the responsive clicking on the small monitor icon at the bottom of the interface.

Responsive mode

History

History option records every change you make to your page so that you can easily back in time.

Elementor history feature makes it easy to track any changes

Preview Changes

Preview changes allows you to check how your page looks like after you have added elements to it.

When you click on it, Elementor will open up in a new tab outside of the interface to inspect all the changes. You can easily view the page to see how it’s going to look to your website visitors.

how to preview changes

Publish/Update Button

Once your page looks exactly how you want, you can make it live clicking on the green button “Publish.” After the page has been published, the “Update” button will turn green whenever there is some content that needs to be saved. 

Saving as Template

If you create a page and are planning to use a similar layout in other parts of your website, you will greatly appreciate this feature.

Once the page has been fully edited, click on the arrow next to Publish and then click on Save as Template. When you need to use the same layout in other section of your website, you can upload the saved template and simply add the new content.

Elementor has a save as template function

Role Manager

Role Manager is one more important bonus of Elementor. Here you can manage what your users can edit. It is very good when you are making websites and you are going to have people logging into your website.

Using this function you can control who can use the page builder and what he is allowed to do with it.

You can access the Role Manager from the left sidebar of WordPress. Click Elementor >> Role Manger.

Role Manager

In the screen that appears you may decide who on your website can edit pages using the page builder.

The role manager function in Elementor

 How to Use Templates

When you start building a page, the Elementor user interface will give you a choice to add a new section or add a new template.

You can decide to add sections and build your page from scratch or add an existing template or a template that you have created and saved. 

Elementor, how to add a template

What is the difference?

Templates are a faster way to get you started with your page layout. There are various professionally designed templates and blocks that you can add to the page and then customize as much as you want.

As you are full of ideas, just pick the one template that is similar to what you require for your page layout. The Insert button will add it to your page. You are now ready to start editing the template to match your needs. 

Elementor, How to use templates

As you may notice, the layouts are built using sections, columns and widgets.

These widgets are different kinds of content blocks that you can place in your Elementor sections. An extensive set of the widget allows you to choose one and drop it into your section or column. 

You can add images, text, headings, videos, maps, icons, testimonials, sliders, carousels, and so on.

Click on the Save button, provide a name to your template to add your page to the library and open it over and over again every time you are using the page builder to create your pages. 

Is Elementor better than its competitors? 

Elementor VS Beaver Builder 

 If you have been asking yourself which builder to use, this will be very helpful information.

Both have high standards, drag and drop functionality and are user-friendly. However, there are some reasons that can make Elementor a better choice for you rather then Beaver Builder:

  • inline text editing capability which is not available in Beaver Builder
  • the free version gives you 45 items which you can drag and drop to build custom pages and posts as well
  • the variety of ready-made pieces of content you can use 

Read the full comparison Elementor vs Beaver Builder.

Elementor VS Gutenberg 

Elementor is more multipurpose while Gutenberg is perfect for long-form Seo optimized blog posts where form matters but it’s more about the content. Gutenberg allows you to create a very basic multi-column layout. 

This is why Elementor is a better option than Gutenberg

  • Full control over spacing with the ability to add your own margins and padding
  • Possibility to change backgrounds and styling for every block with the detailed controls
  • Elementor supports more complex layouts, with multiple columns
  • You can add several features such as maps, image carousels, and accordion tabs 
  • With the premium version, you can design your headers, footers, and other parts of your website.

How Much does Elementor Cost?

Elementor can be installed free. The unpaid version comes with many features included that allow you to give your pages a professional and appealing look.

However, if you want to unleash all the power of Elementor Page Builders, you can upgrade to the Pro version that starts at $49/year and can be used only on a single website.

If you need to use Elementor on more websites you can choose between the Plus and Expert plans.

All the plans come with a generous 30-day money-back guarantee.

Elementor Page Builder prices

Elementor Cons

Up to now, you have seen everything we like about Elementor. But what are the disadvantages? See the shortlist below.

  • Free and Pro templates and blocks are displayed together. It would be better to have a way to filter the results and display free and pro separately.
  • Some users complaining about the speed performance and code efficiency
  • There have also been instances where users couldn’t open their Elementor builder after upgrading. If Elementor could detect incompatibility and give some kind of warning to users, it would make things easier.

Elementor Review: Conclusions

Elementor is a user-friendly page builder that you use to easily create WordPress websites and pages with no coding experience. It has become a new unique term in the age of Word Press world.

Allowing users to build custom designs for their landing pages, homepages, posts, portfolios, and products, it is full of advantages that make it better than many of its competitors. Start from the fact that the basic version is free and ending with an entirely new interface.

I hope now you got persuaded how easy it is to create cool pages using an excellent free drag-and-drop page builder plugin for WordPress. Enjoy!

Related Articles

How useful was this post?

Click on a star to rate it!

Average rating 4.4 / 5. Vote count: 153

We are sorry that this post was not useful for you!

Let us improve this post!