Replacing WordPress Page Builders with Themes and Gutenberg
I’ve been watching the advancements being made with the block editor (aka Gutenberg) ever since it’s initial release in WordPress 5.0 and wondering how useful it would become. Here we are at version 5.5 almost 2 years after it’s release and things are stabilizing and 3rd parties are extending its functionality in great ways.
The evolution and power provided by the new block editor made me re-think my current stack of using a premium theme + a page builder for my websites. I’ve always found it a bit clunky to define theme settings and then use page builders which may also define their own style settings. It just seemed like there were duplicate settings and competing styles that sometimes caused problems and seemed unnecessary.
I feel that the current path now is to either choose a premium theme and use the block editor or choose a simple vanilla base theme and a page builder. So I recently evaluated which path I wanted to take moving forward.
After doing some research I decided I wanted to try and replace my page builder and just use a premium theme along with the block editor. I had several goals for doing this.
- Simplify having to manage both a theme and a page builder
- Increase the speed of my site
- Lower the annual subscription costs for managing multiple sites
So I took one of my current sites ( Digital Legacy Management) built on the OceanWP theme and Elementor to see if I could replace it with Astra Pro and the block editor without any changes to design or functionality.
Simplifying Things
I created a clone of my site and then started my testing. It took a bit of work to configure all the settings and re-map how I created certain elements to be created using the new tools. For example I switched the footer from using an Elementor template in the theme builder to using the built in Astra footer widgets. For the home page I switched from using an Elementor page to importing one of the Astra starter templates for Gutenberg that closely matched my current page and then just made a few minor edits to that. One of the other changes was to the archive page. Instead of using the Elementor custom template, I switched to using the built in Astra settings. I can also leverage the block editor now to create a post grid which is used in the home page as well. In the end I was able to very closely match my current site and just made a few little tweaks.
Now that all the changes are complete I find it easier to manage the site with the ability to use the native theme customizer for most of the changes instead of having to bounce back and forth between the page builder and theme in some cases wondering where certain settings are configured. I’m a big fan of trying to leverage core as much as possible and limit the number of plugins and customization and this has accomplished it for me.
Migrating the site from my clone to the production site wasn’t too difficult. I was able to export the theme settings and then manually update several of the remaining elements such as the custom home page and footer widgets. I’m sure I could have been more efficient with import export but it took me less than 30 minutes to do manually. After completion it was time to test the site speed as compared to the previous stack.
Site Speed
After completing the site I headed over to the Google page speed insights to do a before and after comparison of the site performance. As you can see in the images below there were considerable gains. I still have some more tweaks to make for improvements. But without any changes the performance increase was impressive.
Cost Savings
So at the current time the annual retail cost of using OceanWP and Elementor for 4 or more sites which is my current situation is $129 and $199 respectively for a total of $328.
I replaced both of those for just the cost of Astra Pro which has an annual retail cost of $59 for unlimited sites.
A couple things to note here. You should take careful consideration as to what your requirements are and then select the best tools as necessary. There are many factors to consider and my scenario doesn’t cover all of them. All of these tools are great choices and I will continue to evaluate my other sites before migrating them. Also note that all of these tools offer deals and specials which can bring the costs down considerably.
With regards to the theme. I decided to switch from OceanWP to Astra primarily because I find it to have better support and integration with Gutenberg. Besides the starter templates I already mentioned they also have one of the most popular Gutenberg related plugins that adds features to blocks. I’ve also read a few comparisons that showed it provided better performance which i found to be true in my case. It also doesn’t hurt that there are cost savings as well.
Final Thoughts
I will say that in my case I had a pretty simple site and was able to migrate without any noticeable loss of design or functionality. I do love Elementor and it definitely has much more power and control, but for this site it wasn’t really necessary with the capability provided by the Astra Pro theme and the block editor now native to WordPress. If you want to learn more about the differences between Gutenberg and a page builder here is a great breakdown for you.
I wanted to share my experience as I’m sure many people are currently wondering whether it’s time to re-evaluate their stack of tools used for existing and new WordPress sites now that we’ve seen Gutenberg mature and offer so much more functionality. Hopefully this article was helpful in that respect.
Originally published at https://krynsky.com.
