Best WordPress Page Builders Compared 2018
Offsprout is the only WordPress website builder for freelancers and agencies.
Offsprout is a WordPress page builder. So to write an article called “Best WordPress Page Builders Compared” will rightly raise some eyebrows and invite accusations of bias.
But, in trying to build the best page builder for freelancers and agencies we tried almost everything else out there. And we continue to try to keep our finger on the pulse of what features people want and what features other builders have.
This article does not attempt to choose sides as it’s obvious which side we’d choose.
Instead, we’re trying to lay out the features that matter most to people, explaining what those features are, and letting you know which WordPress page builders have them, and which don’t.
If you think we’re leaving out important features or we’ve made a mistake in our chart, please leave a comment and we’ll try to correct the record.
Our Criteria for Choosing the Best WordPress Page Builders
This compares the features that you get when you buy the premium versions of the top page builders.
There are valid arguments to be made about including 3rd party add-ons or comparing only free page builders, but we’ll leave that to other articles.
We’ve also left out some page builders that you may use and like. If you think we’ve left one out that compares favorably in the features listed in the chart, please let us know in the comments section and we can work with you to add it.
Here’s our current list of the top WordPress page builders:
- Offsprout (Pro and Theme)
- WP Bakery
- Beaver Builder (Pro and Themer)
- Elementor (Pro)
- Thrive Architect
Why include Gutenberg?
There has been talk about whether or not Gutenberg will kill page builders. I think this chart shows that Gutenberg has a long way to go for that to be the case.
WP Page Builder Comparison Chart
|Sort||Feature||Offsprout||WPBakery||Beaver Builder||Elementor||Thrive Architect||Divi||Gutenberg|
|3||Drag and drop||Yes||Mostly||Yes||Mostly||Yes||Mostly||Limited|
|5||Column width drag controls||Yes||No||Yes||Yes||Yes||No||No|
|6||Column width drag locks||Yes||No||No||No||No||No||No|
|7||See changes live||Yes||No||Yes||Yes||Yes||Yes||No|
|8||Create new columns by dragging||Yes||No||Yes||No||Yes||No||No|
|9||Row padding drag control||No||No||No||No||No||Yes||No|
|15||Google fonts||Yes||No||Yes||Yes||Yes||Uses Customizer||No|
|16||Upload your own font||No||No||Yes||Yes||Yes||No||No|
|17||Upload your own icon set||No||No||Yes||No||No||No||No|
|18||Site logo||Yes||No||No||Uses Customizer||No||No||No|
|21||Navigate to containing elements||Yes||No||No||No||Yes||No||No|
|22||Navigate to other pages||Yes||No||No||No||No||No||No|
|23||Create new page from builder||Yes||No||No||No||No||No||No|
|24||Edit header/footers/etc from builder||Yes||No||No||No||No||No||No|
|25||Apply new sitewide elements from builder||Yes||No||No||No||No||No||No|
|26||Set user permissions from builder||Yes||No||No||No||No||No||No|
|27||Edit post meta link from builder||Yes||No||Yes||No||No||No||No|
|28||Admin link from builder||Yes||No||Yes||Yes||No||No||No|
|36||Save Page Template||Yes||No||Yes||No||No||No||No|
|38||Save and Publish||Yes||No||Yes||No||No||No||No|
|42||Full Change History||No||No||No||Yes||No||Yes||No|
|45||Module-specific user permissions||Yes||Yes||No||No||No||Yes||Yes|
|46||Builder action user permissions||Yes||Yes||No||No||No||Yes||No|
|47||Set user permissions per user||Yes||No||No||No||No||No||No|
|48||Set user permissions per WordPress role||No||Yes||No||No||No||Yes||Yes|
|53||Save module templates||Yes||Yes||Yes||Yes||Yes||Yes||No|
|54||Save page templates||Yes||No||Yes||Yes||Yes||Yes||No|
|55||Save row templates||Yes||Yes||Yes||Yes||Yes||Yes||No|
|56||Live template preview||Yes||No||No||No||No||No||No|
|57||Templates use centralized color scheme||Yes||No||No||No||No||No||No|
|60||Save global rows||Yes||No||Yes||Through Admin||No||Yes||No|
|61||Save global columns||Yes||No||No||No||No||No||No|
|62||Save global modules||Yes||No||Yes||Yes||No||Yes||Yes|
|63||Live global preview||Yes||No||No||No||No||No||No|
|66||Design your entire site||Yes||No||Yes||Yes||No||No||No|
|69||Blog post template||Yes||No||Yes||Yes||No||No||No|
|73||Background image screen||Yes||No||Yes||Yes||Yes||Yes||No|
|74||Background image screen width||Yes||No||No||No||No||No||No|
|75||Background image parallax||Yes||Yes||Yes||Yes||Yes||Yes||No|
|76||Bleed full width||Yes||Yes||No||Yes||No||No||No|
|81||Background image screen||Yes||No||No||Yes||No||No||No|
|85||Mobile column width control||Yes||Yes||Yes||Yes||No||No||No|
|86||Mobile spacing control||Yes||No||Yes||Yes||Yes||Yes||No|
|87||Mobile border control||Yes||No||Yes||No||No||No||No|
|88||Mobile font size control||Yes||No||No||Yes||Yes||Yes||No|
|92||Email marketing integration||No||No||Yes||Yes||Yes||Yes||No|
|96||Advanced Custom Fields||No||No||Yes||Yes||No||No||No|
|101||Easy Digital Downloads modules||Yes||No||No||No||No||No||No|
|105||5-Minute Site Grower||Yes||No||No||No||No||No||No|
|108||White label help docs||Yes||No||No||No||No||No||No|
|111||Saves HTML, not shortcodes||Yes||No||Yes||Yes||Yes||No||Yes|
Page Builder Features Explained
Below, I go into detail about each feature included in the chart.
Click into text and edit the text as you see it rather than in something like a modal settings window. It can also be referred to as editing in place.
Drag and Drop
Click on a module, column, or row, and drag it around the page, dropping it where you’d like it to be. “Mostly” in this row refers to the inability to create columns by dragging. “Limited” means that there is no real concept of columns.
Changes are made in the environment that a visitor to your website sees, so that you can see exactly what your site will look like as you edit it.
Column width drag controls
Change the width of columns by dragging rather than by clicking into a settings panel.
Column width drag locks
Guides to help lock widths into conventional breakdowns such as halves, thirds, fourths, and fifths.
See changes live
As you make changes in a settings panel, you are shown what those changes look like instantly.
Create new columns by dragging
Create a new column on the fly by dragging a module to the side of an existing module as opposed to going into a settings menu and choosing the number of columns from there.
Row padding drag control
Increase or decrease top and bottom padding within a row by clicking and dragging on a drag zone.
Create a color scheme in your site options and then assign those colors to various elements in your site. This allows you to change the color scheme and have colors change across your entire site rather than having to set or change colors in each module individually.
Create button designs in your site options and then assign those designs to the buttons in your site. This means that you can change the button skin in your site options and all of your site’s buttons that are using that button skin will be updated automatically.
Create row designs in your site options and then assign those designs to the row in your site. This means that you can change the row skin in your site options and all of your site’s row that are using that row skin will be updated automatically.
Select a Google font to use for paragraphs and heading text.
Upload your own font
Upload a custom font file and use that instead of a Google font or a built-in font.
Upload your own icon set
Upload a custom icon set and use that instead of built in icon set(s)
Set a logo for your site, and then use that in a logo module.
Navigate to containing elements
If you’re editing a module, there are links to edit the column and row/section containing that module. Another way to think of this is breadcrumbs.
Navigate to other pages
Choose another page to edit from the builder mode rather than having to go back into the WordPress backend and navigate from there.
Create new page from builder
Create a new page or post from a template without leaving the builder. This is opposed to having to exit builder mode and go into the WordPress backend to create a new page or post there.
Edit header/footers/etc from builder
A link to edit the headers, footers, and other sitewide content inside the builder, rather than having to exit the builder, go into the WordPress backend and create or edit sitewide areas in the backend.
Apply new sitewide elements from builder
Rather than having to go into the WordPress backend, and, on an individual basis, select which sitewide elements apply to which pages or page types, this means that you can assign sitewide elements to the page that you’re working on without leaving the builder.
Set user permissions from builder
Create and preview user permissions roles without leaving the builder.
Edit post meta link from builder
A link to edit the meta for the post/page that you’re working on is shown within the builder interface.
Admin link from builder
A link to the WordPress admin is shown within the builder interface.
Create a new page or post.
Undo or redo a change.
Show the module selector.
Show the row template selector.
Show the global template selector.
Save Page Template
Save the current page that you’re working on.
Save changes to the current module or page.
Save and Publish
Save changes to the current page and publish it.
Undo or redo any changes that you’ve made.
Full Change History
Go through the full history of changes that you’ve made and restore a previous version.
Module-specific user permissions
Control exactly which modules a user can edit, add, move, or delete.
Builder action user permissions
Control exactly which actions a user can take like add pages, create/delete templates, edit globals, edit rows, edit design options, etc.
Set user permissions per user
Assign capabilities on a per user basis.
Set user permissions per WordPress role
Assign capabilities on a per WordPress user role basis.
How many page templates come with the builder.
How many row/section templates come with the builder.
Save module templates
Save you module configurations as templates that you can use elsewhere in the page builder.
Save page templates
Save page templates that you can use as starting points for other pages or posts in your site.
Save row templates
Save row/section templates that you can use elsewhere in the page builder.
Live template preview
See what saved templates will actually look like in your site when you are looking at the templates available to you.
Templates use centralized color scheme
Colors in templates refer to a centralized color scheme so that when you use them, they are already using the colors of your site rather than the colors of the template.
Save global rows
Save a row/section as a global that can be reused throughout your site and when edited, will be updated everywhere.
Save global columns
Save a column as a global that can be reused througout your site and when edited, will be updated everywhere.
Save global modules
Save a module as a global that can be reused througout your site and when edited, will be updated everywhere.
Live global preview
See what your saved globals look like when you are shown a screen to add them.
Design your entire site
Edit things like your headers, footers, sidebars, and other site-wide areas that appear on multiple pages rather than just the content in the page content area.
Create designs for your archive pages like category and tag archives where posts of a given taxonomy are listed. This means you can control how the posts are displayed and the content around the post display area.
Create a custom 404 page.
Blog post template
Create a design for your blog posts that all posts will use by default. This means you have the ability to control how the title, post date, featured image, etc. will appear when a blog post is shown.
Set the background of a row to be an image.
Background image screen
Create a screen layer over the image so that text within the row or section can be seen more easily.
Background image screen width
Control the width of the image screen layer so that you’re only screening part of the image.
Background image parallax
Add a parallax effect to the background image of a row.
Bleed full width
Even when a row is contained in a smaller area, you can still override that containment and stretch the row to the full width of the page.
Set a background color for columns.
Set a background image for columns.
Background image screen
Add a screen over the image background in columns.
See what your design looks like on different devices within the page builder.
Mobile column width control
Most page builders will automatically stack modules for mobile viewing, which is a preferred behavior. This gives you the ability to control columns in mobile in the event that you do not want adjascent columns to stack but want them to be side by side even in mobile.
Mobile spacing control
Padding and margin controls for modules and rows/sections that can be edited on a per-device basis so that you can have a certain spacing for laptops, and then different spacing for tablets and phones.
Mobile border control
Border controls that can be edited on a per-device basis so that you can have a certain border for laptops, and then different border for tablets and phones.
Mobile font size control
Font size controls that can be edited on a per-device basis so that you can have a certain font size for laptops, and then different font size for tablets and phones.
Create forms out of different input types from within the page builder.
Email marketing integration
Link optin or contact forms to email marketing accounts like MailChimp or Active Campaign.
Trigger an action when the page builder detects that the user is about to exit the current page.
Advanced Custom Fields
Integrate text fields with values from the Advanced Custom Fields plugin.
Integrate text fields with values from the Pods plugin.
Custom modules for things like a WooCommerce buy button and cart link.
Easy Digital Downloads modules
Custom modules for things like an Easy Digital Downloads buy button.
Set goals for actions that you would like users to take on a given page and create multiple versions of a page to see which page leads more users to take that action.
5-Minute Site Grower
Special website creation wizard that allows you to input company information, social media profile urls, and select page templates, and will create a fully designed site for you.
Add your branding to the page builder.
Store all of your templates in a central location and then connect sites to that location so that you don’t have to import and export templates in order to get access to your template library.
White label help docs
Help documentation that does not have any branding so that clients can be pointed to the help docs of the page builder while still being given a white label experience.
Saves HTML, not shortcodes
When the plugin is deactivated, the content remains as HTML, not as WordPress shortcodes.
Conclusion: Which WordPress Page Builder is the Best?
That’s for you to decide!
We certainly work every day to make Offsprout the best website builder for freelancers or agencies building websites for clients.
But that doesn’t mean that it will be the best for you.
All of these page builders have their strengths and weaknesses. Some are stronger than others. And if you’re trying to decide which to use, I’d encourage you to try them out and see for yourself. Both Offsprout and Beaver Builder have demos where you can try before you buy.
Please be sure to leave any other features or page builders that you’d like us to include in the comments section below!
Offsprout was founded by two former college freshman roommates. Drawing from their experience building their web design business, JurisPage, which was acquired in 2016, Offsprout is singularly focused on being the best white label website building tool for web design businesses.