How to move from Divi to the WordPress Block Editor (Gutenberg)

This guide will show you how to move from the Divi Theme to the Gutenberg Block Editor.

If you would like to download my free Divi Module to Gutenberg Block cheat sheet click here https://www.pootlepress.com/wp-content/uploads/2021/03/divi-to-gutenberg-cheat-sheet.pdf

The cheat sheet maps the most important Divi Builder Modules to their equivalent Gutenberg Block.

Here are the plugins I used in the Video
- WooBuilder Blocks to customize the WooCommerce Product Page https://www.pootlepress.com/woobuilder-blocks/
- Storefront Blocks to customize the WooCommerce Shop Page, Listings Page, and Category Page
https://www.pootlepress.com/storefront-blocks/
- Gutenslider to add sliders to your pages
https://wordpress.org/plugins/gutenslider/
- Editor Plus to add a tabs block
https://wordpress.org/plugins/editorplus/
- Gutenberg Pro to add a testimonials block, and more control over the Columns Block
https://www.pootlepress.com/gutenberg-pro/
- CoBlocks to add an Accordion
https://wordpress.org/plugins/coblocks/

To read the full post go here https://www.pootlepress.com/2021/03/how-to-change-from-divi-to-the-block-editor/

Timeline
0:00 - Intro
0:50 - The Divi Container Module (columns)
3:44 - The Divi Call to Action Module
6:27 - The Divi Slider Module
9:20 - The Divi Accordion Module
11:06 - The Divi Testimonials Module
17:38 - The Divi Tabs Module
20:35 - The Divi Blog Module
24:16 - The Divi WooCommerce Product Module
28:30 - The Divi Shop Module
33:28 - Migration tips

INTRODUCTION
Divi is one of the popular WordPress Themes in the World, and is now used on over 750,000. One of the key reasons that Divi is so popular is because it comes with its very own page builder, called the Divi Builder.

The Divi Builder is a drag-and-drop page builder that makes it easy to create great-looking websites.

However because the Divi Builder is built into the Divi Theme, if you change your Theme all your content will be wrapped in Divi code.

Why move from Divi to the Block Editor?
There's four important reasons why you should think about moving your site away from using the Divi Theme.

1) The Divi Theme fails the Google Core Web Vitals test
In May 2021, Google is releasing a big update to their ranking algorithm where page experience and page speed are going to become a very important ranking factor.

Unfortunately for Divi Themes users, the Google Core web vitals update is bad news. This is because the Divi Theme will slow down your website and your page speed scores quite a bit.

My test was run on a site using the Divi Theme with no plugins installed. You can test the page speed scores for your own website by going to the Google Page Speed website.

In my test, Divi scored 28 out of 100 on the mobile test, and 72 out of 100 on the desktop test.

Divi is slow because it contains so much functionality that should normally be added via plugins.

So in summary, page speed is increasingly important to your Google Ranking, and the Divi Theme performs very poorly, so your best option is likely to be to look for a new faster Theme.

Here are four great Themes that you might consider. These are all built with great Block Editor support and are lightweight and fast.

2) Block Based Themes are here – great alternatives to Divi
Over the past year, forward looking Theme companies have really embraced the Block Editor. Here's four great Themes that you might consider as replacements for Divi. These all have free versions so you can test them out.

Kadence
Storefront great for ecommerce sites
Blocksy
Astra
18tags this is our Theme :)

3) Divi is no longer better at page design than the WordPress Block Editor
First a little history.

When Divi was first released, the WordPress editor was just a simple word processor, with very limited page layout options.

The old WordPress Editor, now known as the Classic Editor, was fine for simple text and image layouts, but very limited if you wanted to achieve proper page design.

However the default WordPress Block Editor can match Divi in most page designs now.

In addition the WordPress Editor is now true drag and drop, making it very intuitive to use.

4) You can now use the WordPress Block Editor to customize WooCommerce Pages
One of the real advantages of using Divi is its WooCommerce Modules. These allow you to edit and style WooCommerce elements using the Divi Builder. This allows you to use Divi to create custom WooCommerce Shop and Product pages.

However, It's now possible to customize the WooCommerce Product Page using the WooBuilder Blocks plugin and the WooCommerce Shop Pages using the Storefront Blocks plugin.

WooBuilder Blocks and Storefront Blocks contain all the WooCommerce Modules – currently available within Divi Builder – that you need to construct unique WooCommerce Pages.

In addition, WooBuilder Blocks also contains sales-boosting Blocks such as a Sales Countdown Block, and Stock Countdown Block.

Видео How to move from Divi to the WordPress Block Editor (Gutenberg) канала Jamie WP