How Does This WordPress Page Builder Stack Up? | Cheema Developers Blog


Making an attempt to determine whether or not Elementor is the perfect web page builder in your WordPress website? In our Elementor evaluation, we hope to provide the data you should make your determination. Our evaluation consists of the newest options in Elementor 2.0 and Elementor Professional 2.0, so that you could be sure you’re getting a full have a look at all the things this plugin can do.

Launched in 2016, Elementor has shortly shot up the charts and is now lively on over 5,000,000+ web sites whereas sustaining a formidable 94% ranking on 6002 evaluations at WordPress.org.

Hold studying our Elementor evaluation for assist deciding whether or not it is best to be part of these 5,000,000 different customers.

What’s the good thing about utilizing Elementor?

Elementor helps you add superior styling, structure, and design components to your WordPress content material with out requiring you to know code. Within the new Elementor Pro version, you’ll be able to even design your complete WordPress theme additionally with no need to know any code.

What’s Elementor?

On a extra particular observe, Elementor is a visible drag and drop page builder plugin. There are two components to that description, so let’s parse every:

  • Visible implies that whenever you design your content material, you see precisely what your guests will see. There’s by no means any confusion about how your web page will look when you publish it.
  • Drag and drop means which you can transfer round varied design components – like buttons, varieties, or photographs – simply by dragging and dropping them. No code required!

The tip result’s a software that helps you make your WordPress website look the way in which you need it to with out the necessity to study code (or hire a developer).

How the Elementor interface works

I’m going to start this Elementor evaluation by supplying you with a primary have a look at how the Elementor interface works. In case you’ve already performed round with Elementor a little bit, you would possibly wish to skip straight to the next section of our Elementor evaluation for a have a look at some extra particular options.

How the interface is split

While you first launch the Elementor editor, you’ll see one thing like this:

elementor review - the interface

  • (1) – the content material space. You’ll see your common theme exterior this space, and also you’ll construct your individual design roughly within the space marked with the gray dotted line.
  • (2) – components/widgets. These are the constructing blocks that you just’ll put collectively to design your web page.
  • (3) – settings. These make it easier to undo modifications, preview your design on totally different gadgets, and extra.

Constructing the structure in your design

Whereas you can begin utilizing components immediately, you’ll in all probability wish to construct the essential construction in your web page earlier than you try this.

Elementor provides you two structural components that make it easier to:

  • Place components
  • Fashion components as a gaggle (e.g. add a background to a whole part of your web page)

These structural components are:

  • Sections – the broadest structure block.
  • Columns – sit inside a piece. You may both have one column or add a number of columns.

For instance, right here’s what it appears prefer to have:

  • (1) – one part, marked by blue
  • (2) – two columns inside that part, marked by black

sections vs columns

Including new components to your design

So as to add a brand new aspect to a piece or column, you simply drag it from the left sidebar onto the visible preview of your web page:

adding an element

Whereas a heading aspect is a reasonably primary instance, you have got a bunch of different choices that allow you to do cool issues like create a logo carousel.

Styling components, columns, or sections

To additional type and management any of your components, columns, or sections, you’ll be able to click on in your desired content material after which use the tabs within the sidebar:

editing an element

Is Elementor laborious to study?

When in comparison with different web page builders, the Elementor interface is likely one of the simpler ones to understand. However regardless of which web page builder plugin you select, there’s at all times going to be a studying curve earlier than you can begin creating actually beautiful pages.

We wrote a put up about how to create a landing page with Elementor that may make it easier to study. And Elementor additionally has a YouTube channel with tutorials.

However right here’s the best possible strategy to turn out to be an Elementor guru in my view:

Import a pre-built Elementor template (extra on these in only one second) after which deconstruct it to see how the designer constructed the web page. This manner, you’ll be able to see the extra superior choices that make it easier to construct one thing that actually appears nice.

Six particular Elementor options that assist make it nice

Now that you’ve got an understanding of the essential interface, let’s take this Elementor evaluation a bit extra hands-on and dig into among the particular options which have helped make Elementor so profitable.

1. The Elementor template library

Whereas Elementor does provide the energy to create full designs from scratch…you don’t at all times must do all the things your self because of the Elementor template library.

This library features a bunch of templates which you can insert with only a click on:

elementor templates

As of Elementor 2.0, these templates now are available two codecs:

  • Pages – these are full-page designs which you can import after which tweak as wanted.
  • Blocks – these are designs for particular “sections”, slightly than complete pages. For instance, should you simply wish to drop in a pre-built contact part to an present structure, blocks may also help you try this.

Upon getting a few of your individual designs, you may as well save them as templates or blocks to simply reuse them in a while.

2. Cell previews and responsive design controls

With a large portion of the net’s visitors occurring on cellular gadgets these days, you want the mobile version of your site to look great.

First, some excellent news:

The entire designs that you just create with Elementor are robotically responsive (that’s, they give the impression of being good on cellular).

In case you ever wish to see how your design appears on a special gadget, Elementor permits you to shortly launch a preview with out leaving the interface:

responsive previews

Elementor additionally takes issues additional by letting you present/cover particular person widgets on sure gadgets.

For instance, in case you have an enormous hero picture, you may not wish to show that picture on the cellular model of your website. Elementor’s responsive design controls allow you to cover it on cellular gadgets with the clicking of a toggle:

hide element on certain devices

3. Detailed structure controls

As a result of web page builders remove the necessity for customized code, generally it’s important to sacrifice a little bit flexibility over the place you place components in an effort to obtain that simplicity.

What’s nice about Elementor, although, is that it provides you tons of intuitive controls to just be sure you can place each widget, part, and column precisely the place you need it. You may:

  • Manually set padding and margin for sections, columns, and widgets
  • Modify column widths by simply dragging the divider between columns
  • Place widgets vertically inside a column (or columns inside a piece)
  • Create a clean house between columns with adjustable column hole

custom margins/padding

4. Inline textual content enhancing

Inline textual content enhancing is a handy methodology for enhancing textual content in your web page. Moderately than needing to make use of a popup like another web page builders, Elementor permits you to simply click on on the web page and begin typing:

inline text editing

5. Straightforward undo/redo and full revision historical past

Anybody who has by no means made a mistake has by no means tried something new

Albert Einstein

As Albert so kindly tells us, you’re in all probability going to make a mistake (okay, mistakes) whenever you check out new design approaches.

In case you do mess one thing up, Elementor makes it simple to undo your errors in two other ways.

First, each single motion that you just take* is logged and could be reverted as wanted:

undo/redo functionality

Second, each time you save your design, you’ll additionally get a totally new revision which you can revert to if wanted.

*These particular person actions are cleared whenever you exit the interface. So it’s each single motion that you just take throughout a selected design session. Saved revisions are at all times accessible, although.

6. Clear code should you ever deactivate Elementor

In case you ever must deactivate Elementor sooner or later sooner or later, you’ll be able to relaxation simple figuring out that it’s not going to go away behind a multitude of shortcodes like WPBakery Web page Builder or the Divi Builder.

As a substitute, Elementor leaves behind clear code (although you’ll, in fact, lose all of the styling).

Elementor Professional permits you to construct your theme with drag and drop + extra

The core Elementor web page builder plugin is 100% free and open supply. However the Elementor crew additionally sells an add-on referred to as Elementor Professional. This add-on provides you numerous useful performance beginning at simply $49. Listed here are among the most useful options:

Construct your complete WordPress theme with Elementor

It wouldn’t be an Elementor evaluation with out overlaying the most recent model of Elementor Professional.

Up till not too long ago, Elementor was at all times simply in your content material. You continue to wanted a high quality theme sitting beneath it.

With the discharge of Elementor Professional 2.0, although, now you can construct your complete theme with the identical drag and drop Elementor interface, together with your header, footer, and weblog put up templates.

To construct your theme, you first choose what a part of your theme you wish to construct:

elementor theme builder

Then, you need to use the identical Elementor interface (with the addition of widgets for that sort of content material) to construct your structure.

For instance, should you construct the template in your weblog put up, you’ll be capable of drag over widgets for the:

  • Submit title
  • Submit content material
  • Writer metadata
  • And many others.

theme elements

Tons extra widgets to construct your content material with

Elementor Professional simply plain provides new widgets. Along with supplying you with extra flexibility, these also can make it easier to change different plugins. For instance, Elementor Professional has widgets for:

See the complete checklist of Elementor Professional widgets beneath:

elementor pro element list

Tons of premium templates

While you buy Elementor Professional, you unlock all of the templates and blocks within the library. Past simply getting “extra”, the Elementor Pro Templates are additionally normally a bit extra detailed and complicated. So it’s extra a scenario of “extra + greater high quality”.

On the time of penning this Elementor evaluation, that’s nicely over 100 templates.

International widgets make it easier to reuse the identical aspect on a number of pages

To wrap up our Elementor evaluation, let’s have a look at yet another Professional function:

International widgets.

Generally you may need a scenario the place you wish to reuse the identical aspect on a number of pages. For instance, you may need a contact part that should embody the identical content material on each web page.

International widgets make this simpler by letting you:

  • Save that widget as a template to reuse on a number of pages
  • Mechanically replace each occasion of that international widget simply by enhancing it as soon as

global widget

Do you want Elementor Professional?

In case you simply wish to create primary styled pages, the free model of Elementor ought to have sufficient energy. The truth is, Elementor in all probability provides probably the most feature-rich free model of any web page builder.

With that being stated, if you wish to use Elementor to really construct out your core web site pages (or construct your complete web site now, because of the theme builder), then Elementor Professional is a superb choice due to the brand new components, additional controls, and different performance.

Different third-party extensions lengthen Elementor even additional

As a result of the Elementor crew made it simple for builders to increase Elementor’s performance, you may as well discover tons of different useful Elementor extensions that transcend the official Elementor Professional add-on.

You may examine a few of our favorite free Elementor add-ons. And we even have a group of third-party Elementor themes and templates that you need to use.

Elementor evaluation: Remaining ideas on this web page builder

The numbers don’t lie in terms of Elementor. It’s already one of many prime web page builders and the builders proceed to roll out main new enhancements regularly.

As a result of the free model of Elementor is so beneficiant, it is best to simply install it on a WordPress test site and take a look at it for your self. In case you like how the interface works, you’ll be able to then take into account upgrading to Elementor Pro for theme constructing, extra components/templates, and different useful options.

And if you wish to see how Elementor stacks up vs different fashionable web page builders, take a look at our put up on Elementor vs Divi Builder vs Beaver Builder.

Did we miss something in our Elementor evaluation? Have a query about one thing we didn’t cowl? Depart a remark and tell us!

Free information

5 Important Tricks to Velocity Up
Your WordPress Website

Cut back your loading time by even 50-80%
simply by following easy ideas.

* This put up comprises affiliate hyperlinks, which implies that should you click on on one of many product hyperlinks after which buy the product, we’ll obtain a fee. No worries although, you’ll nonetheless pay the usual quantity so there’s no value in your half.

Elementor

Execs

  • Template library with a great deal of ready-made web page designs.
  • Tons of various content material modules to select from.
  • Straightforward to make use of even for a newbie.

Cons

  • The default widget types do not at all times look good out-of-the-box
  • No white label choice, although this solely impacts builders




#WordPress #Web page #Builder #Stack