If you’ve begun thinking about creating a website, you might wonder about your different options as you get started. First, choose whether you’ll use a hosted solution like Wix, Weebly, or WordPress.com, or a self-hosted solution like WordPress standalone software. Then consider whether you’d prefer to build your website on your own, or hire a professional and spend your time concentrating on your organization’s main mission.
WordPress as a self-hosted, standalone solution gives you complete freedom over your website’s design, content, and features. If you’ve selected self-hosted WordPress for your site, and decided whether to hire a website developer or build your own site, your next consideration is whether to use a page builder.
What is a page builder?
A page builder gives you a visitor-side view of your website, and allows you to place content visually on your website. This is the same principle that is often used in hosted “website builder” solutions like Wix or SquareSpace. The page builder set-up gives you a clearer vision of the end result than you would have using a classic “What You See Is What You Get” (WYSIWYG) editor. You can easily add rows, columns, images, text, videos, or whatever you need.
Even if you hire a website developer to create your website, you may want to use a page builder to make it easier for you to add your own content during the site build process, or to add or adjust content at a later date. This can keep your expenses down and allow you to rely on your website developer to create features and functionality for your website, instead of having her simply add your content to the site.
Most users can learn how to use a page builder fairly easily, because you don’t have to know any HTML code to be able to use one. Page builders are generally “drag and drop” systems, and most come with excellent documentation and instructions.
Using a page builder can help you keep your website’s style consistent across all of your pages.
What are the downsides of a page builder?
These days, there are not a lot of downsides to using a page builder. These are issues to be aware of:
- A page builder may slow your site down, because it adds a lot of features and code on the back end. You or your web developer can mitigate this issue with proper website optimization.
- Some page builders are tied to particular themes, and fill up the back end – the part you wouldn’t see while you are using the page builder – with code that only works when that theme is in use. If you choose to switch to a different theme, you would have to manually remove that code from the content area to make your original content readable. You would also lose the layout in that case.
WordPress has several viable page builder options:
- Beaver Builder
We are big fans of Beaver Builder. It is flexible, fairly easy to learn to use, and gives you a pretty true-to-life view of what your web pages will look like from your visitors’ point of view.
Elementor is another good option. Those coming to self-hosted WordPress from SquareSpace or Wix may find it to be the best fit, since it has a similar interface. Graphic designers may also prefer Elementor, which has some similarities with Adobe Photoshop / Illustrator.
Gutenberg is the official name of WordPress’s own page builder, or “block editor.” It was released in December 2018, with WordPress 5.0, and is included in WordPress automatically. As of this writing, we do not yet consider it a full fledged page builder, because the workspace doesn’t resemble the webpage’s front end closely enough. It does offer you “blocks” for building your website with, though, and this may fit your needs.
Beaver Builder and Elementor both have Pro versions for extra features and flexibility. All three page builders have third-party plugins, or add-ons, available for extended features. When we set up Beaver Builder or Elementor for clients, we provide training on how to use the page builder.
What does a page builder look like?
Let’s compare the admin editing side and front end views of these three page builders.
In these examples, you can see that the admin editing side of Beaver Builder looks almost identical to the front end view. This makes for an easier visual editing experience for the user.
On the admin side, this is what your page looks like with Beaver Builder:
When you click to edit an area in Beaver Builder, the editing tools and window can pop up over your page, or you can tack them to the left or right side of the screen if you prefer.
On the front end, your web page looks the same:
When using the Elementor page builder, you can hide the tools, or display them, using the small red tab on the left side of the page.
This is what Elementor looks like with the tools displayed. They are fairly intuitive and easy to use if you’ve already worked with drag-and-drop style page builders:
This is the front end of your web page with Elementor. It is also almost an exact match of the page you see while editing, so is a comfortable experience.
You can add a new block element with Gutenberg with the tools at top left. Further options for editing blocks are available on the right side of the screen. The page width doesn’t match that of the front end of the website unless you make specific modifications with CSS or a plugin.
The page created with Gutenberg generally resembles the page as it was on the editing screen, but you now see other page elements you couldn’t see on the editing screen, like the sidebar. This makes the page creation experience less intuitive than with other, full-experience page builders, but still gives you a general idea of what your page will look like. If your website design is fairly simple, though, you may find Gutenberg to be a good fit for you.
Have you used one of these page builders, or another not mentioned here? Which is your favorite, and why?
Note: Some links on this page may be affiliate links, and we may gain a small commission should you purchase a product through these links. We only recommend products we like and use.