Again in June of 2016, we had been one of many first websites to put in writing an Elementor overview. It’s been over 4 years since then. And in these 4 plus years, we’ve seen Elementor bear some unimaginable development. Not solely have they gone from zero to 700,000+ energetic installs (our 2018 replace) to over 5 million installs (our 2020 replace), however we’ve additionally seen the Elementor staff proceed to push out tons of nice new options at a fast tempo.

That development is why we truly use Elementor to energy this very website you’re studying proper now. Yup – we put our cash the place our mouth is and use Elementor (and GeneratePress) to model WPLift.

As a result of Elementor has pushed out so many new options, we determined that we would have liked to replace our Elementor overview once more. We initially revealed it in 2016. Then we up to date it in 2018. Then we up to date it once more in Might 2020…and now we’re again in October 2020 to replace it once more since Elementor simply launched model 3.0! It could be nice if the Elementor people may decelerate so I may get a while off, however it’s superior for you that Elementor retains pushing out helpful new options at such a clip.

In our overview, which is correct as much as Elementor 3.0, we’ll cowl all the massive options like:

  • Theme Builder
  • Dynamic content material
  • Popup Builder
  • WooCommerce Builder

Principally, if Elementor launched the characteristic earlier than October 2020, we’re going to cowl it in our Elementor overview.

Able to test it out? Let’s dig in…

Get Elementor

Elementor Review: What Does This Factor Do?

Table of Contents

At its core, Elementor continues to be a WordPress web page builder.

When you’re not accustomed to that terminology, it simply signifies that Elementor helps you construct your content material and web site utilizing easy drag and drop controls and a reside visible preview of your web site, slightly than requiring you to fiddle with the underlying code. Once more, you:

  • Put your web page collectively like Legos. You simply drag and drop completely different “components” collectively to create a design.
  • Don’t have to know any code.
  • See precisely what your guests will see, which makes it straightforward to know precisely how your completed design seems.

Most non-builders completely love web page builders as a result of they allow you to create extra styled content material while not having to study HTML/CSS. You possibly can even import premade templates which have already executed a lot of the be just right for you.

The core Elementor web page builder is 100% free. Simply by itself, you possibly can already make some fairly stellar pages with simply the free model.

If you buy the Elementor Professional add-on, although, you’ll additionally get entry to:

  • Theme constructing – as of Elementor Professional 2.0, Elementor permits you to construct your header, footer, archive pages, single pages, and extra with the identical drag and drop interface.
  • Dynamic content material – you possibly can insert dynamic content material from customized fields in your designs.
  • Popup Builder – you possibly can design versatile popups utilizing Elementor and show them in your website.
  • WooCommerce Builder – you possibly can design your retailer’s store and archive pages.
  • International fonts and colours – this makes it straightforward to make sure a cohesive website design and rapidly make adjustments throughout your complete website.
  • Extra components – you get a number of useful new components to construct your web site.
  • Professional templates – whereas the free model of Elementor consists of some free templates, a lot of the greatest templates are a part of Elementor Professional.
  • International widgets – these allow you to reuse the identical widget on a number of pages after which edit that widget from one location.
  • Stay customized CSS – simply add customized CSS proper from the Elementor interface.

How The Major Elementor Interface Works

There’s quite a lot of nitty-gritty particulars to cowl, however let’s begin issues off with a fundamental have a look at how one can construct a web page with the free Elementor web page builder.

Whenever you first launch Elementor, you’ll see a reside preview of your web site, with some added components (these are what allow you to truly create your designs).

elementor review the interface

There are three core areas you’ll work in (marked beneath):

  • 1 – that is the place you see a reside preview of your design. You see precisely what your guests will see after they come to your website, which makes it very straightforward to design. That is additionally the place you possibly can create “sections” which enable you to set up your “widgets”
  • 2 – these are the widgets you should utilize to construct your designs. You simply drag them over to the reside preview. Then, you’ll be capable to customise every widget utilizing the identical sidebar.
  • 3 – these are useful controls that allow you to see how your design will look on a distinct system (like a smartphone), undo/redo adjustments, and another useful performance.

Constructing Your Web page With Widgets/Parts

When you’re already accustomed to web page builders, this may not blow your thoughts. However for those who’re not…that is fairly cool.

Right here’s why individuals love web page builders:

Let’s say you wish to add a button to your web page…

Reasonably than needing to fiddle with HTML/CSS such as you usually would, all you do is drag over the component:

adding a widget

So as to add extra design components, you simply maintain dragging over widgets. When you get the hold of issues, you’ll be capable to create one thing like this with out writing a single line of code:

This instance is taken from our submit on tips on how to create a touchdown web page with Elementor. You possibly can see the method in additional element there.

Enhancing Particular person Parts

When you drag over a component, you’ll probably have to edit it to make it behave the best manner.

There are two essential methods to edit your components.

First, for those who’re coping with a component that has textual content, you possibly can simply click on on that textual content and sort (that is referred to as inline enhancing):

editing text

Then, you additionally get the sidebar space with 3 completely different tabs. The settings accessible in every tab fluctuate relying on which component you’ve used, however the basic thought is similar it doesn’t matter what:

  • Content material – that is the place you management fundamental performance. E.g. for a button, it’s the place you select the button dimension, the place the button hyperlinks to, and so forth.
  • Fashion – that is the place you management fonts, colours, and different fundamental stylistic components.
  • Superior – that is the place you possibly can management responsive settings, add customized margins/padding, use customized CSS (in Professional) and different extra superior issues.

styling widgets

These controls are what mean you can actually dig in and make the web page design your individual. And since you’re working in a visible editor, the moment that you simply tweak one thing small (like font dimension or padding), you’ll instantly see these adjustments on the preview of your website so you already know precisely how issues look.

Styling Your Sections Or Columns

When you simply wish to add some styling to common posts, you may not have to ever dig into sections or columns. However if you wish to create touchdown pages or in any other case construct a extra “full” web site, you’ll want to make use of them.

Sections are type of like a container for a number of widgets. They’re useful as a result of they allow you to:

  • Group issues collectively to offer higher spacing
  • Management that complete group as a single entity (like including a background to all the part, slightly than only a particular widget)
  • Add form dividers and different cool options

Columns are one other grouping component that sit inside a piece. They enable you to divide up your web page horizontally if wanted.

For instance, within the screenshot above, I had two completely different components. By enhancing every component individually, I may add backgrounds to these precise components like this (that is ugly – I’m simply proving a degree!):

widget background

However more often than not, that’s not what you’ll wish to do. As a substitute, by enhancing the part instantly, I may add one cohesive background like this:

section background

You possibly can view this as a type of hierarchy:

A part accommodates a number of columns. Every column can then include anyplace from zero to limitless widgets/components.

When you get the hold of the interaction between these completely different courses, you’ll be capable to unlock the total energy of Elementor.

Previewing And Controlling How Your Design Appears On Totally different Gadgets

Okay, now that I’ve executed a fundamental introduction to how Elementor works, let’s have a look at a number of the particular options that take Elementor from “only a web page builder” to “one of many quickest rising and hottest web page builders”.

First up, you might have Elementor’s responsive design controls. In a world the place cell Web visitors is large, you want your design to look as nice on cell units because it does on desktops.

That can assist you make {that a} actuality, Elementor offers you two useful choices.

First, you possibly can preview how your design seems on completely different units utilizing a button within the backside-left nook:

mobile responsive controls

However past that, you too can present or conceal components, columns, or sections based mostly on a consumer’s system within the Superior tab:

hide widgets on mobile

This characteristic is tremendous useful since you’ll nearly all the time have some components that look nice on desktops, however get in the best way on cell (assume massive photos).

Utilizing Revisions To Undo Errors

All of us make errors…

And whereas the remainder of life may not make it straightforward to undo a mistake, Elementor does.

At any time, you possibly can click on on the Historical past button to overview a listing of:

  • Actions – particular actions that you simply’ve taken throughout a session are listed right here.
  • Revisions – every time you save or publish the content material, it’s listed right here

To roll again to a earlier model, all you do is click on:

revision control in Elementor

Whereas many web page builders provide this performance, Elementor stands out for the way versatile it’s in letting you progress again to previous variations.

Altering The Template To Design A Web page From A Clean Canvas

It is a tremendous easy characteristic…however massively vital and one of many causes I’ve all the time beloved Elementor.

If you wish to use a web page builder to create a touchdown web page, you want a strategy to conceal your WordPress theme’s header, footer, and sidebar.

Whereas you could find themes that make this straightforward, most themes don’t provide this performance.

With many different web page builders, which means you’re out of luck. However with Elementor, you possibly can simply use the included Elementor Canvas template to immediately work from a clean slate:

Pre-Constructed Templates Save You Tons Of Time

Typically, you don’t wish to construct your complete design from scratch. When that occurs, Elementor templates save the day.

Elementor templates allow you to simply import designs that you could then edit and tweak utilizing the common Elementor interface.

Elementor itself features a constructed-in library of templates (some are free, whereas others require Elementor Professional):

elementor template library

Templates are available in two completely different codecs now, which is one other enchancment from Elementor 2.0:

  • Blocks – these are particular person web page sections that you could put collectively to construct a web page (type of like Legos). In addition they turn out to be useful for the theme constructing options of Elementor Professional.
  • Pages – these are full-web page designs the place all the pieces is already put collectively for you.

Past the templates that Elementor provides, you too can:

  • Save your individual designs as templates to reuse them later
  • Import Elementor templates from third-occasion sources

For instance, EasyThemePacks sells premium Elementor templates that you should utilize by yourself website (take a look at our EasyThemePacks overview).

Proper-Click on and Navigator for Speedy Enhancing

With the ability to proper-click on is a type of issues that you simply may not take into consideration quite a bit…however is tremendous helpful for dashing up the way you design issues.

Fortunately, Elementor totally helps proper-click on to allow you to rapidly:

  • Edit components
  • Duplicate components
  • Copy and paste components/types (it’s tremendous helpful to have the ability to copy types between components so that you simply don’t need to duplicate your work)
  • Delete components
  • Save components as international templates (with Elementor Professional)
  • Open the navigator

Elementor right-click support

Talking of the navigator…

The navigator is a extremely great tool that permits you to zoom out and see the general format of your design (or the DOM, for those who’re a developer). To edit a selected component, all you’ll want to do is click on on it within the navigator listing and Elementor will open its settings within the sidebar.

You may as well rename components in Navigator that can assist you bear in mind them. For instance, you might name a piece the “Hero Part” so you already know that all the pieces inside is within the hero space of your design:

Elementor navigator

New Theme Constructing Performance In Elementor Professional 2.0

If I advised you that you might use the identical interface from above to design your complete WordPress website – header, footer, weblog submit web page, and so forth. – that might be fairly cool, proper?

That’s what individuals had been so enthusiastic about in Elementor Professional 2.0. This model added true theme constructing performance to Elementor.

Meaning you possibly can basically use Elementor to design 100% of your WordPress website. Elementor even created a free theme that’s designed to make this as straightforward as doable.

Right here’s how the brand new Elementor Professional theme builder performance works…

Create A New Template

The theme builder works by way of “templates”. Whenever you create a template, you possibly can select what kind of template it’s from the drop-down:

elementor pro 2.0 theme builder

For instance, to design your header, you’d select Header. Equally, to design a single submit template, you’d select Single.

I’m going to design a Header submit template, however the identical basic ideas apply it doesn’t matter what a part of your theme you’re engaged on.

Select A Block Or Construct From Scratch

When you select what kind of template to create, Elementor will show a listing of Blocks that match that kind of content material

theme builder blocks

Whilst you can all the time construct all the pieces from scratch, these blocks can prevent a while.

When you launch the interface, you possibly can edit or construct your theme half utilizing the very same Elementor interface from above.

You’ll additionally get a brand new set of Theme Parts to make use of. For instance, whereas “Your New Weblog” in my demo doesn’t look very spectacular, that’s truly utilizing the Web site Title widget (which pulls robotically out of your WordPress settings):

All of those Theme Parts pull in data dynamically. For instance, for those who use the Submit Title component, it’s going to dynamically present the precise title of every submit.

You’ll additionally get new styling choices that apply to that particular theme half.

For instance, for those who model the part that accommodates your header components, you’ll get a Scrolling Impact choice that permits you to create a sticky header on sure units:

sticky header

Publish Your Theme Half

When you go to publish your theme half, Elementor will allow you to use Circumstances to manage precisely the place your theme half shows.

For a header, you would possibly wish to select the Total Web site choice to show it all over the place.

However these controls are literally fairly detailed, which might turn out to be useful for those who, say, simply wish to apply a selected submit template to a sure class of weblog posts:

theme part conditionals

And when you publish it, your theme half will begin working straight away. You possibly can see that, whereas I didn’t design an particularly good-wanting header, it’s certainly reside on my website:

elementer pro theme builder

Create Templates for Customized Submit Sorts

Up till now, I’ve primarily centered on how Theme Builder applies to your common WordPress website.

Nonetheless, for those who’re constructing customized content material websites, one other highly effective choice is the power to create templates for customized submit varieties. This, mixed with the dynamic content material characteristic that I’ll focus on subsequent, means that you can construct some actually customized WordPress websites.

For instance, for those who’re creating an actual property itemizing website, you might create a customized submit kind for “Home” after which use Elementor Professional to design the template for your home listings:

Once more, to actually harness the facility of this characteristic, you’ll want to pair it with dynamic content material, so let’s cowl that subsequent.

Embody Dynamic Content material in Your Theme Designs

If you wish to construct customized WordPress websites, Elementor consists of one other extremely highly effective characteristic with its Theme Builder:

Dynamic content material.

With Elementor Professional’s dynamic content material, you possibly can dynamically insert content material from WordPress and/or customized fields that you simply’ve added.

The probabilities for this characteristic are countless and that is what actually permits you to use WordPress as a full-service content material administration system.

Let’s return to our actual property itemizing instance…

To go together with your “Home” customized submit kind, you’d most likely wish to embrace customized fields for a home’s particulars corresponding to:

  • Bedrooms
  • Bogs
  • Sq. footage (or meters!)
  • And so forth.

With the dynamic characteristic, you might then robotically insert these particulars in your “Home” template. Then, Elementor will fill within the correct particulars for every home itemizing by robotically pulling all of that data from customized fields.

On my Elementor overview take a look at web site, I’ve already arrange a customized submit kind and some customized fields that I added with Superior Customized Fields. Right here’s what it seems like after I add a brand new “Home” within the WordPress editor:

Now, right here’s how you should utilize that data once you’re making a template utilizing Theme Builder.

So as to add the home title and outline from the native WordPress editor, you might use the common Submit Title and Submit Content material widgets that include Theme Builder.

However what about these customized fields?

To insert them, you might add a daily Textual content Editor. Then, within the textual content editor, you click on the Dynamic button, from which you’ll be able to choose ACF Discipline to focus on your customized discipline.

Then, you possibly can select the particular discipline and in addition prepend or append content material after the information:

Elementor dynamic content

And voila! You simply dynamically pulled in content material from a customized discipline to your design. You possibly can repeat the method for extra customized fields as wanted.

You need to use dynamic content material with extra than simply the textual content editor, too. For instance, you possibly can dynamically populate:

  • Photographs into picture widgets, backgrounds, sliders, and so forth.
  • Numbers into countdown timers or pricing tables.
  • Hyperlinks (URLs) into buttons or textual content hyperlinks.
  • Person profile data for logged-in customers (for instance, you possibly can create a entrance-finish consumer profile web page).

General, this characteristic is extremely versatile, and it’s positively one in all my favourite options in Elementor Professional.

With it, you should utilize WordPress to construct actually customized web sites while not having any particular technical data.

Unified Interface for Theme Builder – New in Elementor 3.0

When Elementor added full theme constructing assist in model 2.0, it was an enormous improve in design functionality, as I lined within the earlier sections. Nonetheless, the theme constructing nonetheless felt a bit “bolted on”. Every template was separate, which made it onerous to visualise how all the pieces connects. For instance, all of your templates had been simply blended collectively in a listing and also you couldn’t simply see what every template regarded like and the place you had been utilizing it in your website.

As of Elementor 3.0 (launched in September 2020), that’s fastened. Elementor Professional now has a unified interface only for theme constructing that permits you to simply see how your entire template elements match collectively.

You’ll additionally be capable to preview every template proper from the unified interface, which is actually handy to rapidly ensure you’re enhancing the best theme half:

New Elementor theme interface

When you click on on a selected template, you too can get a a lot bigger preview, in addition to see the place in your website you’re utilizing that template. You may as well edit the show situations while not having to open the total Elementor interface (which helps you to change the place you’re utilizing the template):

Template detail

Lastly, the opposite helpful characteristic is that you could rapidly zip straight to this interface proper from the Elementor editor sidebar.

Edit Totally different Theme Elements With out Leaving the Interface

One other helpful characteristic that got here barely earlier than Elementor 3.0 is the power to edit completely different template elements while not having to go away the Elementor interface.

For instance, let’s say you’re enhancing your single submit template. However in the course of the enhancing course of, you see one thing that you simply wish to change in your header template. Prior to now, you would wish to shut out of the editor, go to the template listing, after which edit the header template. Then, once you’re executed, you’d want to return to the only submit template.

That’s not the case.

Now, you possibly can simply click on to start out enhancing the header template proper within the interface:

Edit multiple templates from one editor

Then, once you’re completed, you possibly can simply click on once more to return to enhancing the only submit template.

Implement Your Personal Unified Theme Design System – New in Elementor 3.0

The unified theme builder isn’t the one new characteristic in Elementor 3.0 that makes it simpler to construct cohesive websites. Elementor 3.0 additionally provides a brand new Design System characteristic that permits you to simply arrange international colours and fonts to make sure that each web page maintains the identical cohesive model by default.

When you ever wish to make a change sooner or later, all you’ll want to do is go in and edit the worldwide colour or font as soon as and people adjustments will apply over your complete website.

In fact, you’ll nonetheless have the facility to override a world colour on a person foundation when wanted – you simply gained’t have to fret about messing round with the “default” look of your website.

When you’re focused on how this works on a extra technical degree, the Design System is powered by CSS variables.

You possibly can entry all of those international settings from the brand new Web site Settings space within the Elementor sidebar:

Elementor Design system in 3.0

And the neat factor is that you could add as many preset colours or fonts as wanted – you aren’t restricted by any arbitrary setup. For instance, I may even create a colour for the “WPLift Particular Sauce” (I can’t let you know what this colour is, although – it’s too particular):

Elementor global colors

Elementor Review: Elementor Professional WooCommerce Builder

When Elementor Theme Builder first launched, it was only for common ‘ole WordPress websites. Not anymore!

Now, Elementor Professional consists of WooCommerce Builder alongside Theme Builder.

The fundamental thought is strictly the identical – it’s simply taking Theme Builder and making use of it to your WooCommerce retailer, whereas additionally including new widgets for all of the vital particulars of a WooCommerce retailer.

With Elementor WooCommerce Builder, you possibly can design each your store archive web page(s) and your single product pages.

The neat factor is that you could create a number of templates to your merchandise, which is particularly helpful for a WooCommerce retailer as a result of it may not be optimum to make use of the identical format for all of your merchandise. For instance, you should utilize:

  • Template #1 for merchandise within the t-shirts class
  • Template #2 for merchandise within the luggage class

For your single product web page, you’ll get 13 new widgets to deal with all of the vital areas:

Elementor WooCommerce builder

You’ll equally get new widgets that can assist you construct your product archive pages.

Principally, you should utilize Elementor WooCommerce Builder to design just about all the pieces associated to your retailer’s merchandise.

Nonetheless, there are two vital pages the place you can’t presently use Elementor WooCommerce Builder:

  1. Your procuring cart web page.
  2. Your checkout web page.

Due to that, you’ll nonetheless wish to use a WooCommerce-pleasant theme even for those who’re utilizing Elementor WooCommerce Builder. That manner, you possibly can:

  • Use WooCommerce Builder to manage your store, class, and single product designs (together with your entire common WordPress content material.
  • Use your WordPress theme to manage your cart and checkout pages.

Elementor Professional Popup Builder – Construct Customized Popups

After the Elementor staff launched Theme Builder with Elementor 2.0, I assumed that might be it for the forms of content material that you might design with Elementor.

I used to be unsuitable…

In January 2019, Elementor launched one other new instrument – Popup Builder.

Because the identify suggests, Popup Builder permits you to create your individual customized popups utilizing the identical visible, drag-and-drop interface.

You additionally get entry to all of the Elementor widgets and design choices, which provides you a ton of flexibility. For instance, you possibly can create:

  • Electronic mail choose-in popups that use the Type widget to attach on to e mail advertising providers.
  • Login/registration popups that use the Login and Registration widgets.
  • CTA popups that use buttons to drive guests to motion.

You possibly can even use dynamic content material in popups, which opens up a complete new vary of options, corresponding to robotically inserting an individual’s identify once you show a popup for logged-in customers.

You possibly can goal your popups to your complete website or simply to particular items of content material. Then, like different WordPress popup plugins, you get further concentrating on and set off guidelines.

You get all the favored set off guidelines, together with exit intent:

  • After X seconds (or instantly)
  • Scroll depth, both a proportion or when a customer reaches a selected component
  • X variety of clicks (you too can set off a popup when a customer clicks a button to create a two-step choose-in)
  • Inactivity
  • Exit intent

You additionally get extra superior concentrating on guidelines that allow you to:

  • Present popups after X web page view or periods
  • Restrict what number of occasions to indicate popups
  • Present popups for guests arriving from a sure location (e.g. serps) or perhaps a particular referring URL
  • Conceal popups for logged-in guests (or particular consumer roles)
  • Goal popups to particular units (e.g. solely present for desktop guests)

You even have full management over the canvas to your popups. You can also make it any dimension and place it anyplace in your website. For instance, you possibly can create:

  • Centered popups
  • Full-display welcome mats
  • Notification bars that seem on the high or backside
  • Slide-ins that seem within the nook
  • And so forth.

General, Popup Builder is a robust instrument that may fully exchange the necessity for a 3rd-occasion popup or choose-in plugin. The one factor it’s lacking is a constructed-in characteristic for analytics or A/B testing (although you might use Google Analytics to trace popups with Occasions).

Right here’s how Elementor Popup Builder works…

Create a New Popup

To get began, you go to Templates → Popups → Add New.

Like different Elementor templates, you possibly can select between ranging from a clean slate or selecting from a ton of pre-constructed popup templates:

popup templates

When you select your place to begin, you possibly can edit it identical to you’d another Elementor design:

The one notable distinction is that you simply get some new choices to manage the canvas to your popup, which you’ll be able to entry by clicking the gear icon within the backside-left nook.

These settings allow you to management the scale (width/peak), place, animation, and so forth.

For instance, that is the place you’d select between a full-display filler or a notification bar (or the numerous different choices).

Select Focusing on and Set off Guidelines

When you’ve completed designing your popup, you possibly can click on the Publish button to decide on its concentrating on and set off guidelines.

These are divided into three tabs.

Within the Circumstances tab, you possibly can show your popup on sure forms of WordPress content material. You possibly can goal your complete website or particular:

  • Classes
  • Tags
  • Submit varieties
  • Authors
  • And so forth.

You possibly can even goal particular person items of content material.

Within the Triggers tab, you possibly can select the timing for when to show your popup:

After which within the Superior Guidelines tab, you possibly can select extra detailed concentrating on guidelines, together with an choice to indicate/conceal popups for sure units and conceal popups for logged-in customers (or particular consumer roles):

Elementor Review: 4 Different Options That I Love About Elementor Professional

Even earlier than the brand new theme builder performance in Elementor Professional 2.0, Elementor Professional already had a variety of useful options. Listed below are a number of the greatest…

1. Heaps Of Useful Widgets (That Can Change Different Plugins)

Elementor Professional provides a bunch of useful new components that you should utilize in your designs:

These components can exchange quite a lot of plugins in your website. For instance, you get components to simply create:

  • Types
  • Sliders
  • Worth tables
  • Social share buttons

And also you additionally get components that enable you to show your newest weblog posts (that is what we use to show Latest Weblog Posts on the WPLift homepage – test it out), in addition to WooCommerce product data.

example of post grid widget
We show these posts by way of an Elementor Professional widget

2. International Widgets

International widgets are tremendous useful if you’ll want to reuse the identical content material throughout a number of pages. Principally, you possibly can insert the identical international widget anyplace you need.

Then, to replace each place the place that widget seems, you possibly can simply edit the worldwide widget one time.

global widget

3. Stay Customized CSS

If you already know CSS, Elementor Professional permits you to add customized CSS on to widgets, sections, or columns.

Whereas many different web page builders allow you to add a CSS class or ID, Elementor permits you to write the precise CSS code with out leaving the interface, which is far more handy:

custom css

4. Professional Templates

Lastly, you additionally get entry to a bunch extra web page templates and blocks, which might pace up your design course of.

Third-Celebration Elementor Extensions Make Issues Even Cooler

Past simply plain making a stellar product, I feel another excuse that Elementor has been so profitable is as a result of the Elementor staff embraced the third-occasion developer neighborhood.

When you want much more performance, you could find a number of free and premium Elementor extensions to offer you much more management over your WordPress website. Listed below are a few of our favourite Elementor add-ons.

Elementor Review: How A lot Does It Price?

The core Elementor web page builder plugin is 100% free and accessible at WordPress.org. Even by itself, the free model is already fairly highly effective.

However in order for you entry to theme builder and all the opposite cool options in Elementor Professional, you might have three completely different choices, beginning at simply $49:

Elementor Pricing

I’m not going to instantly evaluate Elementor to the competitors (you are able to do the maths your self)…however for those who have a look at how different well-liked web page builders are priced, I feel Elementor Professional could be very aggressive, particularly when you think about that you simply now get theme constructing with none improve in value.

Elementor Review: Free vs Professional – Which One Ought to You Select?

Elementor free vs pro

By way of options that you simply get free of charge, Elementor has one of the crucial beneficiant free variations of any WordPress web page builder. With simply the free model alone, you possibly can already construct some fairly superior designs.

However on the identical time, Elementor Professional is full of new widgets and design choices, in addition to three extremely highly effective instruments in Theme Builder, WooCommerce Builder, and Popup Builder.

So in relation to Elementor free vs Professional, which one do you have to select?

Clearly, there’s no single reply right here and this resolution largely is determined by your distinctive conditions. However let’s undergo some situations…

When you simply wish to use Elementor to…

  • Add some aptitude to your weblog posts.
  • Create higher-wanting core pages, like styling the “About” web page to your weblog.
  • Construct some fundamental touchdown pages.

Then I feel you’ll most likely be positive with the free model of Elementor.

Principally, for those who largely depend on your theme to your website’s styling however simply wish to add just a little pop right here and there, the free model can get the job executed.

Nonetheless, for those who’re severe about constructing web sites and/or attempting to attain advertising targets, you’ll most likely wish to improve to Elementor Professional.

Listed below are some conditions during which I feel Elementor Professional actually shines…

You Need Extra Customization Choices Than Your Theme Permits

When you’ve ever felt restricted by the design choices that include your theme, you’re going to like Elementor Professional as a result of it principally eliminates the necessity for a theme.

As a substitute, you’ll get full management over each single pixel in your website, and you are able to do all of it from Elementor’s visible, drag-and-drop interface.

You’re Constructing Customized Content material Websites

When you’re constructing customized content material websites, Elementor Professional is a no-brainer. By “customized content material websites”, I imply websites corresponding to:

  • Job boards
  • Actual property itemizing websites
  • Enterprise directories
  • And so forth.

Principally, any kind of website the place you’re going past common WordPress posts and pages. For instance, utilizing customized submit varieties and customized fields to retailer new forms of content material.

WPLift is definitely a great instance of a customized content material website utilizing Elementor. Past our WordPress weblog, we’ve directories for themes and plugins. The layouts for each of those directories are powered by Elementor Professional.

There are two explanation why Elementor Professional is nice for customized content material websites.

First, you get entry to Theme Builder, which implies that you could simply create your individual templates for any customized submit varieties that you simply’re utilizing.

Second, the dynamic characteristic makes it straightforward to incorporate content material from customized fields, corresponding to these you’ve added with Superior Customized Fields, Toolset, Pods, and so forth.

Usually, including any such dynamic customized knowledge requires working instantly with the PHP in your theme’s template recordsdata. Nonetheless, with Elementor Professional, you are able to do all the pieces from the visible, drag-and-drop interface.

As a non-developer, I’ve discovered Elementor Professional’s dynamic characteristic to be a life-saver because it lastly permits me to harness WordPress’ energy as a full CMS.

You’re Operating a WooCommerce Retailer

When you’re constructing a WooCommerce retailer, Elementor Professional can also be a no-brainer.

First off, you get entry to WooCommerce Builder, which implies that you could create your individual templates to your store and product pages.

Second, even for those who plan to depend on your theme to your retailer’s designs, you continue to get entry to a bunch of devoted WooCommerce widgets that you should utilize to incorporate product data in a single-off Elementor designs.

You’re a Marketer

When you’re a marketer, Elementor Professional is full of options that can assist you convert extra guests.

First off, you get entry to the Type widget, which helps you to construct all types of lead-gen kinds. It consists of constructed-in integrations with well-liked e mail suppliers, in addition to a catch-all Zapier integration that may enable you to connect with different providers or CRMs.

In fact, you might use different type plugins and add these kinds to Elementor, however it’s handy to have the ability to entry all the Elementor design choices to your type, which is why I just like the constructed-in Type widget.

Probably the most highly effective characteristic for entrepreneurs, although, might be Popup Builder. As a result of Popup Builder offers you entry to the total Elementor interface, you should utilize it for all types of popups corresponding to:

  • Electronic mail choose-in/lead gens
  • CTAs
  • Two-step choose-ins (by triggering the popup with a click on)

You additionally get tons of concentrating on and set off guidelines to make sure that the best individuals see your provides. And with the dynamic characteristic, you too can personalize your popups to customers, which is one other strategy to increase your conversion charges.

Past the Type widget, you additionally get entry to different advertising widgets corresponding to:

  • Countdown timers so as to add urgency
  • Testimonials for social proof
  • Devoted CTAs to drive motion
  • Pricing tables

Lastly, you continue to get all of Elementor’s basic design flexibility, which implies you possibly can simply spin up touchdown pages while not having to work with a developer.

You’re Constructing Web sites for Purchasers

When you’re constructing web sites for shoppers, all the issues that I mentioned above are doubly true.

Moreover, Elementor Professional provides some good perks corresponding to:

  • Simpler pricing – since you get entry to so many options for one value, you possibly can streamline undertaking pricing. For instance, you don’t have to pay individually for a type plugin, slider plugin, and so forth. Elementor Professional consists of all of that for one value.
  • Easier updates – as a result of all the pieces comes from Elementor Professional (as an alternative of a bunch of separate plugins), there’s much less of an opportunity that your consumer can break issues throughout updates.

And for those who’re actually anxious about shoppers breaking issues, you possibly can select to not give them entry to Elementor. As a substitute, you might use dynamic content material to insert content material from customized fields. Then, you possibly can let shoppers edit these customized fields from the protection of the WordPress backend.

Elementor Is Sooner Than Ever in Elementor 3.0

Lastly, let’s shut out our Elementor overview with a fast speak about efficiency.

Efficiency is likely one of the issues that individuals all the time criticize about web page builders, Elementor included.

Sadly, that is, to some extent, simply one thing you’ll need to take care of. If you would like that straightforward visible drag-and-drop interface and also you need all these superior visible results, you’re not going to get as clear of a codebase as for those who’d coded all the pieces from scratch.

Nonetheless, some web page builders are higher than others on the efficiency entrance and there nonetheless actually are issues that web page builders can do to make themselves extra light-weight.

As of Elementor 3.0, launched in September 2020, Elementor has applied a few of these greatest practices to make itself much more light-weight.

One of many massive adjustments in Elementor 3.0 is a giant discount within the variety of DOM components that Elementor creates. When you’re not accustomed to what this implies, it principally signifies that Elementor provides much less “litter” to your website’s codebase, which implies cleaner code and quicker web page load occasions.

Past that, Elementor 3.0 additionally consists of massive enhancements to Elementor’s server-facet rendering processes and the way Elementor renders dynamic CSS values. As a substitute of dynamically rendering these values for each single go to, Elementor now caches them and may seize them from that cache when wanted, which takes quite a bit much less time.

By dashing up all of those server-facet processes, your website’s time to first byte (TTFB) and general web page load occasions needs to be quite a bit quicker as of Elementor 3.0.

Moreover, the Elementor staff is aware of that their customers care about efficiency, so the oldsters at Elementor are going to maintain engaged on this to make it doable to create even quicker websites with Elementor.

And in case you’re questioning, so long as you’re implementing different WordPress efficiency greatest practices and selecting quick internet hosting, it’s 100% doable to create lightning-quick WordPress websites with Elementor.

Elementor Review: Ought to You Use Elementor On Your Web site?

Simply performance, Elementor is already my favourite web page builder. Whereas I’m nonetheless locked into Thrive Architect on a few of my websites for legacy causes, Elementor is what I’ve personally used on each new web site that I’ve launched.

So I really feel fairly comfy recommending it simply on performance alone.

However there’s additionally one other invaluable factor that you simply get once you select to construct your website with Elementor:

The Elementor staff doesn’t relaxation on its laurels.

Regardless of already reaching a great quantity of success, they’re nonetheless consistently pushing out new options (just like the latest theme builder performance).

As a result of selecting a WordPress web page builder is a protracted-time period resolution, that’s a reasonably vital consideration. You wish to go together with a staff that’s in it for the lengthy haul and goes to proceed to not simply keep the plugin, but in addition enhance it.

Whereas Elementor actually isn’t the solely staff that matches that standards (Divi Builder and Beaver Builder are additionally fairly energetic, to call simply two), I feel the Elementor staff has probably the most spectacular resume over the previous few years by way of pushing out useful new options.

For these two causes, I feel Elementor is the very best web page builder for each now and sooner or later.

Get Elementor Free Get Elementor Professional

Leave a Reply