Custom WordPress themes can be built in different ways. Most professional developers prefer to use Advanced Custom Fields (ACF) to allow all the content to be updated from the admin page. But it’s also possible to allow changes to the layout of a page using ACF Flexible Content, page builders like WP Bakery, Elementor, Beaver Builder or the native Gutenberg editor in WordPress.
How do you know what to choose?
It’s not fair to say that they are alternatives for the same use case, even if they overlap in some cases. This lovely discussion on Reddit illustrates that point.
The decision between page builders and ACF comes down to a handful of factors that we’ll go through in this article. But first, let’s describe the options we’re talking about.
Page builders
With an empty WordPress installation, you can set up a blog and not much else. With a page builder plugin, or a theme with a page builder built into it, you transform your WordPress site into a drag-and-drop website builder. It’s similar to Wix and Squarespace, but with more flexibility on both the setup, extensions available, and where you want to host it.
Here are some of the popular choices for page builder plugins:
- WP Bakery – Our preference, if we need to choose one
- Beaver builder
- Elementor
Others are implemented into premium themes:
- Divi – Our preference, if we need to choose one
- Cornerstone (X-theme)
Setting up a site with a page builder requires little development skills for basic use, but could get very tricky if you’re aiming for more advanced features.
Advanced Custom Fields
The other option is to bring specific controls into the WordPress admin page to control the content on the front-end. The most popular option by far is the plugin Advanced Custom Fields. It can also be used in combination with other solutions like Custom Post Types and WooCommerce, which we do on almost all the sites that we build.
You need to have coding skills to master Advanced Custom Fields, although it’s not rocket science. Your front-end will also need to be coded separately, where you add the content as variables that connect to fields that you set up in the WordPress admin as power-ups to your page editor.
With over a million active installs since it was released in 2011, ACF has elevated WordPress to a more powerful content management system, undoubtedly contributing to the growth of WordPress itself.
It has been widely adopted by developers and agencies who have leveraged it to give clients control of content without the need to use shortcodes, page builders, or even post_content at all. Developers have complete control over where data appears on the front end of the site, avoiding the inevitable client edits that break the whole look of the page.
Here’s their own guide to getting started with ACF.
Advanced Custom Fields with Flexible Content
It’s also possible to create page templates with ACF that carry what could be called a “modular flexibility”. Since many websites are consistent in their design across pages, it’s likely that new pages on a site will reuse section layouts that already exist on similar pages.
In ACF, the developer can use a Flexible Content setup on a page template that allows all (or some) sections to be added and moved around with drag-and-drop. This allows a non-developer user to go in and modify or create pages where they control the content and order of appearance of sections, but not the actual section design.
Here’s an example:
Factors for choosing between a page builder and ACF
1. Flexibility for the website admin
The first is how much control you want to give the administrator of a site. A page builder would allow them to redesign their site using drag-and-drop functionality in the admin view. With ACF, you’re restricted to editing content within the structure that was set by the developer. Here’s an example of what you’d be able to change with a page builder, but not with ACF:
Some agencies use this flexibility as a selling point, and for a knowledgeable client that could come in handy. But other agencies wouldn’t want their clients to touch the design at all, and see limited flexibility as a feature (“unbreakable”).
Businesses and agencies with a “Growth Marketing” approach will be interested to experiment with their landing pages. Having the opportunity to easily edit and create new pages calls for at least some templates to be flexible enough for it. For this purpose, either a page builder setup could be used or flexible content with ACF.
In order to achieve flexibility in the example above with ACF and Flexible Content, the bottom section would need to be pre-built by the developer. But once that’s done, users can add as many of those as they want, wherever they want on the page. Here’s an example:
2. Developer’s coding preference
A second factor is how the developer prefers to build sites. A page builder can be used to quickly set up a page or an entire site using drag-and-drop of pre-built modules like galleries, text boxes, and forms. If a designer has prepared a custom design for the site already, the task will be to set up the page so it looks just like the designs. It’s not too difficult if the design is straight-forward, but could be tricky if the designer was creative.
Most developers prefer not to use page builders since they bring too many constraints. Tweaks that go beyond the immediate capabilities can take forever to complete.
I asked our Head of Production about the time it takes for our developers to build a site with Flexible Content setup instead of normal ACF. His answer was that it actually doesn’t add any significant time at all (unless the design is complex, but that’s another story). Page builders, on the other hand, take us significantly longer to use. But partly that’s also because we’re not spending too much time learning how to use them most effectively.
“Most developers prefer not to use page builders since they bring too many constraints.”
So in reality, a Flexible Content setup could actually save total project time, especially if the designer makes sure to design pages that reuse sections instead of all having unique page templates.
3. Page speed
Maybe the most common argument for avoiding page builders is that they use more code to generate the same result, which reduces the page speed. Considering the importance of page speed today for SEO, that’s a big deal. However, depending on which tool you use for testing page speed, you might find that page builders can also get a good score.
In this performance test of different page builders, the lightweight version SiteOrigin loaded faster than the others but also includes fewer features. When we compared a Divi build to an ACF build a few years ago, we found that the Divi version had 13 times as many lines of CSS code compared to the ACF version.
What about Gutenberg?
At the time of writing, WordPress’ own visual editor Gutenberg has only been out for about 6 months, so it’s still too early to say if it will replace the existing page builders. According to WordPress themselves, it’s meant for the whole spectrum of users: “Experience the flexibility that blocks will bring, whether you are building your first site, or write code for a living.” (source: https://wordpress.org/gutenberg/)
Still, not a single agency that we work for has started to use it. Some have tried and abandoned their projects for various reasons, but it doesn’t seem to be stable enough yet.
But what about later? Well, the community is still divided on whether it’s the great new thing or a total disaster. We don’t have a roll-out plan for any partners, but we are experimenting to be prepared.
Gutenberg with ACF
While Gutenberg comes with some out-of-the-box blocks that you can use, you can also create your own blocks as you do with ACF flexible content sections. You can either do it with JavaScript code according to WordPress’ own tutorial or you can use ACF to develop your own blocks.
If we’re back to ACF, then what’s the benefit of Gutenberg? The main benefits of Gutenberg would be that it’s built into the WP core and that you get a more visual experience as an editor. The preliminary result will show already in the editor so you don’t have to check it with the preview link.
Conclusion
For a professional business website built on WordPress, using ACF is still the go-to solution. But if you want to give more flexibility to how pages can be edited, you have some options:
- ACF Flexible Content
- Page builder plugins
- Page builder themes
- Gutenberg
For non-developers who want to build their own websites, ACF is not an option and Gutenberg becomes somewhat limited. That leaves the page builders as the primary candidates.
But if you have the budget for getting a custom design for your website, you’re probably better off with an ACF-based solution using Flexible Content. The page builders would be trickier to use for the developer and make the website slower for visitors. Even if ACF Flexible Content has been around for several years, we see that it’s growing in popularity among our partners.
But keep in mind, if you use Flexible Content you need to plan ahead for the type of flexibility you will need. All sections and styling options will be built into the theme by the developer, leaving you with a stable theme that gives you a limited set of options – but hopefully enough to cover your needs.
Click here if you’re interested to learn more about our services.
