WPBakery vs Elementor

For the past two years, Elementor has been our go-to WordPress page builder here at Gator SEM. We’ve used it to build websites for national brands and hardworking mom and pop shops. Elementor’s ease of use and live-editing capabilities have accelerated the speed with which we can go from concept to live website or landing page. And these sites are easy for clients to work with themselves.

We’ve also used WPBakery enough to say that the plugin rewards those who master its learning curve. Both plugins replace the basic WordPress editor with a frontend editor, allowing marketing people with little or no design or coding skills to create a professional website by dragging and dropping layout components.

The plugins differ in significant ways, but which is better for building professional-grade websites? We’ve weighed the advantages and disadvantages and crunched the data and believe we’ve come up with an answer to the question that has vexed digital marketing agencies since time immemorial/2016: WPBakery or Elementor? But first, consider this anecdote.

While researching themes for a new client — a national brand looking to elevate their image — we came across a beautiful theme from Qode Interactive’s high-end Elated line of themes. Elated themes are impeccably designed, but many are built with WPBakery, which we’d shied away from since Elementor had made our lives so much easier. In the end, the client loved the theme so much we decided to buy it anyway and get to work customizing it.

During the development of this website, which required a lot of customization and building pages from scratch, we finally got the hang of WPBakery. Meanwhile, Elementor made a boo boo. A new version of the plugin went out with a security vulnerability that Siteground, our WordPress hosting provider immediately caught and patched by forcing Elementor installations on all of its hosted sites to roll back to the last minor version of the plugin. Well, turns out the last minor version was a major update, an oversight on Elementor’s part, causing some Elementor-built sites to break.

After spending a lot of time working with WPBakery, we came back to Elementor to build a quick landing site for a real estate client and had it mocked up in a few hours. After a break from Elementor, the ease of editing was astounding.

All this to say that WPBakery and Elementor bring different value to different projects. Neither are perfect, and you should give both a try. Ultimately, you want the right tool for the right project. But in order to make that call you need to know the strengths and limitations of each, hence the rest of this article, which I promise will be far less anecdotal and more bullet-point-y.

Wait, but what about Gutenberg?

Lately WordPress itself has been trying to catch up with the popularity of page builders, and now offers a native version called Gutenberg.

Gutenberg was modeled on popular page builders like Elementor and WPBakery. But, being a purely open source creation, it is (in our humble opinion) riddled with the dubious UX choices that come with too many chefs in the kitchen. It’s still a work in progress, and certainly not going to replace page builder plugins anytime soon.

WPBakery Page Builder: Key Features

Let’s start with WPBakery, the veteran of the page builder ecosystem. It used to be called Visual Composer before the company split off into WPBakery and Visual Composer. Visual Composer is closer in its feature set to Elementor, while WPBakery has remained…well, WPBakery.

WPBakery hasn’t kept up with the trend toward live-editing and sitewide editing (headers and footers), but it makes up for it in performance, reliability, and by not trying to be everything for everyone.

WPBakery could be described as a hybrid drag and drop page builder, combining a relatively  primitive WYSIWYG interface that takes some time to master, with more options for back-end editing than you get with Elementor and its ilk. Some key features include:

• 50+ content elements
• Supports the creation of more complex grid-based layouts
• Integrates with 250+ plugins
• Fairly decent template library
• Can be extended via WPBakery Page Builder API
• Dedicated customer support

Elementor Page Builder: Key Features

Elementor has led the live-editing charge since it came on the page builder scene in 2016. A true drag and drop experience, anyone can pick up an Elementor-backed theme and produce a professional-looking* website. *Of course professional-looking does not always mean professional. A lot more goes into a high-performing professional website than just a pretty interface. But we digress…

If you want to mock up a landing page in less than a day, Elementor is the tool for the job. It comes equipped with access to a large library of readymade templates and widgets, even full website kits.

There is a catch. For all but the most basic websites, you will need a Pro subscription to unlock important features. The cost ends up being about the same as purchasing a WPBakery license and any needed addons.

(It’s worth noting that those extra Pro features are included with Gator SEM’s WordPress customization service.)

Here’s a rundown of Elementor’s key features (included with a Pro license):

• 50+ content elements
• Extensive library of Pro templates and website kits for a variety of industries
• Integrates with popular plugins and services, including WooCommerce and Mailchimp
• Pop-up builder with refinable logic
• A year of support and updates

Which is more popular?

As of July 2022, Elementor had 5+ million active installations. WPBakery had 4.3+ million active installations, but unlike Elementor, WPBakery does not offer a free version. WPBakery is popular with developers and novices alike, while Elementor appeals more to the novice user. For these reasons, we would venture that WPBakery is the more popular plugin overall.

Is Elementor faster than WPBakery?

This is an interesting question with two answers. Some reviewing sites claim Elementor is hands-down faster. This is simply not true. Those reviewers are conflating ease of use with performance.

Elementor is faster for mocking up websites and building landing pages, due to its live-editing capabilities and excellent UX.

In terms of page speed, WPBakery websites load 15% faster according to tests conducted by WooCart. Since WPBakery’s UX is simpler and provides less options for customizing individual elements (which generates a ton of inline CSS and JS), WPBakery sites tend to incur less code bloat and perform better. At least that’s our theory.

Now let’s take a closer look at each page builder’s strengths and limitations.

WPBakery: Strengths and Limitations

Strengths

Potential for faster page speed – WPBakery sites tend to load faster because they give users less ways to generate inline code that can slow page speed. The plugin is also slightly lighter and loads less files (less HTTP requests).

More back-end control –  WPBakery pages are built entirely out of shortcodes, so if you like using shortcodes, this is the page builder for you.

You always have the option of toggling back and forth between the visual editor and the back-end editor. And you can tap into WPBakery’s Page Builder API to extend the framework.

What you see isn’t quite what you get – WPBakery’s less than intuitive frontend is not always a strength, but sometimes it is. WPBakery’s learning curve acts as a barrier, making it a bit harder for website owners with no web design background to mess about and break things. For agencies like ours that hand over precisely designed websites to small business clients who may lack in-house design and coding talent, this can be a blessing in disguise.

Limitations

Steep learning curve – as we touched on above, WPBakery’s frontend editor is not purely WYSIWYG. You can’t see edits unless you save your work or preview it in a separate tab. The frontend is cluttered, which can make it difficult to know where to adjust settings when working with a moderately complex layout.

Responsive design – Other review sites will tell you that websites built with WPBakery are inherently responsive. In our experience, this is not true. WPBakery’s approach to editing for multiple viewports is closer to writing media queries — not intuitive or visual.

Requires an addon to use global widgets – The ability to create a global widget that appears on multiple pages and is edited in one place is not included with the standard WPBakery plugin, and must be purchased separately. In our opinion, this is a basic feature that should not be an addon.

No navigable tree view – The ability to jump to different sections of a page using a tree view doesn’t exist in WPBakery. Users with no web design background have a harder time getting around in WPBakery.

Limited template library – the lack of template options means you’ll be building from scratch a lot.

Portability – WPBakery’s reliance on shortcodes is a liability in terms of portability: it produces unreadable code after uninstalling the plugin.

Elementor: Strengths and Limitations

Strengths

No learning curve – When we say no learning curve we mean no learning curve. Anyone can use Elementor to make basic customizations to a template or build a simple page from scratch using drag and drop design elements.

Live editing – Elementor’s popularity can be attributed to its live-editing capabilities. Design elements change in response to the user adjusting the settings in real-time. This closes the gap between plotting a layout and realizing it. For non-designers or folks with limited coding skills, this has been a game-changer.

Create your own library of reusable template blocks – makes it easy to import and export template blocks and global widgets. This can be an advantage if you need to create a bunch of landing pages with slight variations.

Tree view for navigating between page elements – The tree view is convenient for labelling and traversing the contents of a web page. Also lowers the learning curve for the people who manage and edit content.

Responsive design – gives you the ability to visually adjust elements for three breakpoints: desktop, tablet, and mobile.This feature alone has saved us hundreds of hours of work refining responsive layouts.

Popup builder – we love the popup builder. You can set when it pops up, on what pages, and how often.

Global templating included out of the box – with a Pro license, of course.

Robust template and widget library  – In addition to shipping with a robust template library, many theme developers offer full website kits geared toward specific industries. These are administered by a separate (free) plugin called Envato Elements.

Portability – Produces clean, readable code after uninstalling the plugin.

Limitations

Requires an upgrade to Elementor Pro for basic UX elements – This is a common practice in the WordPress plugin industry; companies offer a bare bones product for free that requires a paid subscription to be useful in commercial contexts. We don’t love it, but as the wise sage Ice T once said, “Don’t hate the player, hate the game.”

(Pro features included in Gator SEM’s WordPress customization service.)

Overexposure of theme kits and design elements – Elementor’s success is also its weakness.We regularly come across Elementor-built websites that we’ve seen before. This is a problem for clients who need to set themselves apart in crowded industries.

Too much flexibility / code bloat – This is another example of how Elementor’s strength — flexibility — is also a limitation. The page builder offers so much flexibility it generates thousands of lines of CSS code that could more efficiently be handled by implementing global styles. Code bloat is a problem because it slows page speed, which is a factor Google now uses to assign page rank.

Buggy code – Going back to our anecdote at the top of this article, Elementor has been known to ship buggy code. We’ve also heard about buggy behavior with 3rd-party integrations. To be fair, WPBakery code has not been immune to exploitation by hackers, but it hasn’t happened in a while.

Both page builders can introduce vulnerabilities when they are bundled with themes. What happens is the theme developer or end-user doesn’t keep up with page builder updates, and security holes can open up unnoticed.

Elementor has learned from past mistakes and now warns you before you upgrade that things could break. However, it’s on you to make sure other plugins you are using will be compatible with their latest version, by testing in a staging environment. If you notice errors introduced by the Elementor upgrade, you will have to reach out to those plugin authors (or theme developers) to check compatibility. For this reason it is always wise to use plugins and themes that are actively maintained.

Feature Comparison

Here is a feature comparison, for those of you who like to see it mapped out.

	WPBakery	Elementor
Drag and Drop	✅	✅
Live editing	✗	✅
Advanced grid layouts	✅	wonky
Global widgets	addon	✅
Template library	limited	✅
Back-end editing	✅	limited
Popup builder	addon	✅
Extendable	✅	✗
Portable	✗	✅

How They Stack Up

In evaluating the two page builders, we chose five criteria that made sense to us as a search engine marketing agency. We tend to value ease of use and reusability higher than extendability, for example. Consider these scores in light of your own priorities and goals as a web designer/developer.

WPBakery	Elementor
Ease of use: 3.0 / 5.0 Performance: 4.5 / 5.0 Flexibility: 4.0 / 5.0 Reusability: 3.5 / 5.0 Reliability: 4.8 / 5.0 Total Score: 3.9 / 5.0	Ease of use: 4.9 / 5.0 Performance: 4.0 / 5.0 Flexibility: 4.5 / 5.0 Reusability: 5.0 / 5.0 Reliability: 4.0 / 5.0 Total Score: 4.5 / 5.0

Final Thoughts

When we broke it down quantitatively by criteria that made sense for us, Elementor edged out WPBakery by a healthy margin.

Elementor remains our go-to page builder for its prototyping speed and ease of use. But hard-won experience with WPBakery has given us a respect for the plugin as a reliable tool in any web designer’s toolkit. At the end of the day, client satisfaction in the product is what counts, and we’ve had successes using both page builders.

To be honest, both of these page builders suffer from an overload of options. For WPBakery users, that overload contributes to the steepness of its learning curve. For Elementor users, too many options encourages the practice of tweaking individual elements rather than applying global styles, which creates code bloat and can hurt performance. Both page builders could be improved from that standpoint.

Are there alternatives? Yes. Plenty of them. Beaver Builder, SeedProd, Visual Composer… the list goes on. They all have their fans and their detractors.

Have a page builder that you swear by? Let us know in the comments.

Want to be informed about new posts at Gator SEM? Follow us on LinkedIn and sign up for our newsletter for more tips and tricks delivered right to your inbox.