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.

Why Elementor convert to Gutenberg?

After a year of announcing Core Web Vitals, and yet to see any improvement from Elementor. I really wish they can catch up as Elementor is powered 4 million websites.

Another reason is Gutenberg is the default WordPress block editor. Is way more easy to maintain the website, you can easily to build a Gutenberg website to score above 90 in Google Page Insights. And is more difficult with Page Builder (I don’t minify Java Scripts).

Gutenberg vs 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.

YouTube video

Plus, the ease of use of Elementor is far more superiors than Gutenberg. I can easily build a 4 page brochure website in a day, but not with Gutenberg.

Building with Gutenberg is way more easier than I thought, with Kadence blocks, I can easily build up some brochure site in few days.

Gutenberg uses fewer assets scripts and page size way lighter compare to Elementor or page builder like WPBakery / Visual Composer / Divi. After building few websites with Gutenberg, I felt most brochure site DO NOT require using Elementor to build.

I do come across an Elementor website with additional of 8 different addons. Which is crazy, it make the website so heavy, every page needs to loads a lot of extra assets from each Elementor addon. Make it impossible to optimise for speed.

Price

Elementor just raise up their price on 9th March. 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 favourite lightweight theme – Blocksy is only USD 299.

There are some FREE & SOLID Gutenberg editors in WordPress plugin directory too. Example like Editor Plus by Extendify and Getwid by MotoPress.

How to convert Elementor site to Gutenberg

  1. Research & planning. I always take time to plan. Which plugin to be removed, which plugin to be replaced.
  2. Back up and create a staging website. Putting an under construction on the website for week is not a wise idea for SEO.
  3. Remove the Elementor 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.
  4. Install theme and Gutenberg blocks editor, I use Blocksy theme with Kadence Blocks editor
  5. Use theme’s customizer to custom the header and footer of website. The Blocksy header & footer builder is the best I had use. Way better than other lightweight theme.
  6. Rebuild those pages with Gutenberg block editor. Is not as difficult as you think. The row layout is very handly.
  7. After rebuild, I will use Advanced Database Cleaner Pro to optimise the database, remove tables left by Elementor.
  8. Speed optimisation for Core Web Vitals.

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!

elementor to gutenberg pagespeedinsights 99
Convert Elementor to Gutenberg
elementor gutenberg
Convert Elementor to Gutenberg