Due to the Google ranking signal update — Core Web Vitals. I had help a couple of websites to convert from WPBakery / Visual Composer / Elementor / Divi to Gutenberg.
Gutenberg vs Elementor
Why use Elementor
Elementor is so powerful, any layman non coder can pick up easily. It have lots of cool features and functionality. For advanced user, building website with dynamic content is super easy with Elementor.
Build website faster with Elementor
The ease of use of Elementor is way better than Gutenberg. As simple as moving a text blocks in Gutenberg is pain in the ass. Secondly is there are thousands of beautiful template with Elementor.
Use less plugin with Elementor
With Elementor, you can replace couple with plugins with Elementor widget, example like form. Benefits of less plugin is less headache to maintain.
Is possible to load Elementor under 2 second
Google suggest load speed under 2 second.
I'm Elementor Performance Expert, there are no problem for me to load Elementor site under 2 second. You may learn some speed up Elementor tips here.
In fact, I have a lots of enquiries from client request to build their website with Elementor. And I always recommend Elementor to anyone who need page builder.
Will Gutenberg replace Elementor?
The ease of use of Elementor is far more superiors than Gutenberg. As simple as moving a text blocks in Gutenberg is pain in the ass. Secondly is there are thousands of beautiful template with Elementor.
You can easily build a brochure site in a day with Elementor, and I would said extra day with Gutenberg block editor.
Furthermore every page builder is unique, I don't see any real Elementor replacement in the market yet.
We strongly don't advise to use Elementor to create post.
Why use Gutenberg?
You can easily to build with Gutenberg and score above 90 in Google Page Insights. For Elementor, you need to further optimise with defer JS, remove some assets, etc.
Building with Gutenberg is not as painful as you through, with Kadence blocks, I can build as fast as Elementor.
Gutenberg uses fewer assets scripts and page size is lighter compare to page builder. Less is more, less scripts and page size give you better score in Google PageSpeed Insights.
Faster with Gutenberg
Below is a very good example of building with Blocksy & Kadence block editor. With such result, I don't even need to optimise further.
This is another site with simple optimise with Free plugin Autoptimize, without any cache setup.
Price
Elementor has increased their price on 9th March 2021. The price from USD199 per year to USD999 per year for 1,000 websites.
KadenceWP's membership is only USD599 for lifetime membership with Unlimited website.
My favorite lightweight theme - Blocksy is only USD 299.
Can I change from Elementor to Gutenberg?
Yes of course, changing from Elementor to Gutenberg is not rocket science, with web design practices, you can easily score above 90 in Google PageSpeed Insights.
How to convert Elementor site to Gutenberg
Step 1: Research & planning.
For every website revamp, planing super important. I would suggest use lightweight theme like Blocksy, GeneratePress or Kadence. For Gutenberg block editor, I would suggest use Kadence Block.
My current stack is Blocksy Theme & Kadence Block. Can't wait for Blocky's block.
Step 2: Migrated to Rebuild in Staging site.
Putting an under construction on the website for weeks is not a wise idea for SEO. Always build in staging.
Step 3: Remove Elementor page builder and its add-on.
Unliked convert from WPBakery, you do not need to remove short code. Elementor DO NOT leave you any miserable of short code after you uninstall.
Step 4: Install lightweight theme
For those who have use lightweight theme with Elementor, may continue use back the theme. My current prefer theme is Blocksy. The theme customiser is the best I seem in a while. Way better than other lightweight theme in the market.
Step 5: Install Gutenberg blocks editor
My current prefer block editor is Kadence Block. Rebuild those pages with Gutenberg block editor is not as difficult as you think. The row layout is very handly.
Step 6: Optimise WordPress Database
After rebuild, I will use Advanced Database Cleaner Pro to optimise the database, remove tables left by Elementor.
Step 7: Speed optimization
Everyone love fast website, and Google suggest keep in under 3sec. You may follow this guide for Speed optimization for Core Web Vitals.
Is possible to speed up WordPress under a second
Below image is the results of convert from Elementor to Gutenberg. The PageSpeed Insights score 99 and the page load from 5.8 to 0.6 sec, 90% reduced!
Ending Thoughts
I hope this tutorial will help you to solve your problem. Buy me a coffee ☕ if this tutorial really helps.
If you need to Convert / Migrate from Elementor to Gutenberg service, let us get the dirty job done. Money-back guarantee!