While working with WordPress, you are get recommended to use a page builder probably less if you’re a developer or maybe a bit more if you’re a newbie. With the right mix of minor to major functionalities, the likeliness towards page builders is growing at a moderate pace. Likewise, considering this a fertile niche to tap on, WP developers keep on making brand new additions. If you’ve been directed to this post, then it is with the hope that you’ll end up reading a quick and a hands-on review of yet another fantastic page builder.
Today, I’ll be toying around with the Elementor which is a free and open-source (with a pro version) front-end page builder plugin by the company named Pojo. To find out whether it lives up to its claims and you should use it or not, you’ll need to dig into this review with me. But first, let’s start with a few basics about page builders.
About WordPress Page Builders!
The most native procedure while working with a page builder is that you drag-drop elements and your web page is ready to be launched in real time. They help you create beautiful looking sites in just a blink! And that too without writing a single line of code. Page builders save the initial time-consuming process of coding things from scratch.
This scenario has encouraged a good deal of WP themes to include a page builder of their own. But still many prefer to offer this feature by being compatible with third party plugins. Elementor Page Builder is one such standalone plugin that gels quite well with many of your existing themes and plugins.
Reviewing the Elementor Plugin
Elementor is an intuitive drag and drop page builder plugin. It upgrades the default WordPress editor so that you can build custom designs for your website in real time without any glitches or time lags. All the page layouts can be monitored via a live editing interface which displays the web page instantly.
The plugin was launched in June last year and till now it has done a fantastic job by grabbing a audience of more than 50,000 active installs. It’s stylish, comfortable to use and offers many content elements. Plus it’s free to download. 🙂
The plugin offers a rich feature-set like:
- More than 22 widgets for live page editing. It includes both customizable and third party widgets. This means that by drag and drop you can get a well-styled layout for your page.
- With Elementor you can get access to fully customized layouts. You can edit properties like color, typography, fonts, alignment, etc. to get pixel perfect designs for yourself.
- The plugin is fully responsive and lets you view the web page on different devices. This makes Elementor both flexible and accessible.
- Another prominent feature is its support for RTL themes. The plugin’s core is built to support multiple languages. In addition, you get an automated translated panel along with RTL typography support and developer options to add new languages.
- Elementor also supports different CPTs which you can easily enable from the settings section.
- Apart from these Elementor offers many other features like parallax scrolling, full-width background images, advanced buttons, custom headings, etc. You can explore more of such things by giving this plugin a spin.
Let’s now jump to its working and find out how well this plugin delivers.
Like many other plugins, Elementor adds a new section in the website’s dashboard after the basic plugin setup (i.e. Installation & Activation). From here you can configure the main plugin Settings, access your Library and Tools.
Elementor Settings Page is the first thing which you should configure. Here, you find a good deal of options for post types and style. You can even restrict different user roles from accessing the plugin and allow the developers’ team to collect anonymous data.
If you’ve ever worked with page builders, then you probably have a good idea that most of these create a large, colored button on the edit screen. Elementor does the same. I think it is way too big for my taste and clearly disrupts the flow of writing inside the WP Admin dashboard.
Earlier, it was somewhat bright red and was not so appealing to eyes. Currently, it is blue which is a good change. Ahmad wrote Why You Should Never Use Colored Icons Inside the WP Admin Panel and I tend to agree with him.
WYSIWYG Editor: Click this button and you are directed to a front-end WYSIWYG editor. This is quite similar to the default WP Customizer but with multiple style options and layouts. Here, on the left, you can find the Elementor’s main control panel with your live site on the right. Initially, the live site is nothing more than a blank screen which is left open for you to implement your design skills.
Creating Web Layouts
The plugin developers have eased out the process of adding new elements and widgets. You can either build it from scratch via drag and drop or click the Add Template button to choose among the pre-made design templates. I tried uploading one of their templates, and it took quite long to apply. So, I think this area needs to be looked.
However, the overall process of creating new web layouts is pretty easy. You can add new sections which appear in the form of a grid. Each grid is quite flexible regarding customizability. You may adjust the dimensions and positioning of a particular grid according to your choice.
Adding and Configuring Grid Elements
The Elementor page builder offers a complete range of widgets which they call it the elements. These are the building blocks of your posts and pages. Just drag and drop the required widgets from the left menu and create dynamic web pages.
Did You Know? Here, I need to give a special mention about the exclusive WordPress element blocks which allow you add WordPress-related stuff like Posts, Pages, Categories, etc. This feature is somewhat new, and you rarely find in rest of its counterparts.
Easy Configurations are a big win. Likewise, each element can be easily configured through a set of options which appear on the left side the next moment you drag and drop any element on the front-end. From here, you can make custom settings from some very basic to advanced ones like Custom CSS Classes, Borders, Backgrounds, Margins, Paddings, etc.
The plugin’s live testing feature has been one of its distinguishing characteristics because there are not many such page builders which allow you to test it in real-time for each element. However, Elementor has solved this issue pretty neatly by adding a pre-built responsiveness test option into the left panel. In just a few clicks you can get a good idea of how your post/page is going to look on Desktop, Tablet, and Mobile.
I love that Elementor launched a full-fledged free version last year. It was not really a lite version per se but was a fully working page builder. That’s what I think how they built a good name in the community. As the popularity grew and Elementor grabbed a user base of more than 10,000 active installs within the first three months of its launch — I was pretty sure there was going to be a pro version.
So, those of you who need to amp up their feature-set, the team at Elementor has come up with a Pro version which is equipped with powerful features to show off your content. Its premium version is pretty much worth it as you can completely control the exact look which you want your visitor to see first.
Despite, its free plugin delivers nearly all the features which are attributed to a page builder plugin, still here are the reasons why you should upgrade to its paid version.
- A live form editor.
- A pre-built slider tool.
- Advanced widget options.
- Fully compatible with WooCommerce.
- Comming Soon: flip Boxes, Masonry, Blog Pagination and Ken Burns Effect.
- Advanced settings for mobile responsiveness.
- For more control over page designs, you can add live custom CSS.
- Embed your designed template anywhere you want e.g. sidebars, headers, footers, etc.
- And a lot more.
The team has fully kept your need in mind and has come up with flexible pricing plans for the premium version. Its basic one site subscription is for $49 which extends up to $199 for unlimited sites. I think the price is quite reasonable especially when you have some biggies to compete with like Divi, Beaver Builder, and Visual Composer. But everyone has got their own taste.
It’s Your Turn!
Despite the tough competition, Elementor has proved itself to be a straightforward page builder plugin. However, I think the team needs to simplify the widget and template selection process a bit as I found it to be a bit complicated for new users. Similarly, the content editing and configuration also needs a little revision and can be made even more intuitive.
But all in all, what really matters is that the Elementor creates appealing page designs directly from your front-end without any glitches or lag. Thankfully, the plugin developers have done a thorough job and have succeeded enough in delivering this essential functionality.
Certainly, Elementor is a decent choice to make while working with page builder plugins and you should definitely give it a spin. Try it out and let me know how well did it work for you. Drop in your feedback in the comments section, or you can reach out via Twitter as well.
SUBSCRIBE TO DEVELOPERS TAKEAWAY!
A Premium Development Newsletter by TheDevCouple! What is TheDevTakeaway?