[Guide] How to Switch From Page Builders to Gutenberg Blocks

[@amente]

These tutorials are awesome. I'm changing all of my sites using your videos. Thank you! And please, continue the good work.

[@JackCao]

That's amazing! To think my videos made an impact brings joy to me. 😊 Thank you for your support!

[@infowaygr8257]

Keep up your excellent videos about Gutemberg. You are a true game changer! Hi from Greece!

[@indrarangari]

Namaste Jack Bhai... I Got your channel yesterday on a youtube search related to Gutenberg blocks and after watching your one video, I am watching all the videos back to back. Thanks for giving us Amazing value, Love from Bharat (India) 🇮🇳

[@yapchenpo95]

More of Kadence theme please. Thanks! Keep it up!

[@martinkaspar5095]

Dear Jack this is top-notch: thank you very much - this is so awesome - ❤🙏🏻🙏🏻🙏🏻💐🙏🏻🙏🏻🙏🏻❤ plz do more WP-Tutorials The worldwide WordPress-Community needs your cool stuff - keep on making such awesome vids !!!!

[@gaminglebron8687]

Hey man, don't know how to say this but you're doing such an amazing job! So helpful and informative! I seriously cannot believe you have such a low subscriber count. You deserve a lot more! Continue the spirit, you have insanely great potential!

[@kevinhayler3499]

Jack helped me to remove my sitebuilder. A very genuine man. Got great advice. Saved me so much time and hassle. Thanks.

[@JackCao]

It's my pleasure working on your site Kevin. Thank you for putting your trust in me too 😊

[@CarlMadsen]

Thank you times 1000, Jack. This is exactly what I was looking for! I have 3 different page builders in my current site and the new site is already loaded with Kadence Themes and Kadence Blocks. My next step was frustrating me , and this video NAILED it. Thanks again.

[@jagonly]

Hi, i'm your new subs. Your vid was really helpfull. Did you do Divi swicth to guttenberg too? Thanks

[@dr_leigh_the_vet]

This is great thank you so much. Would love to see some tutorials switching an existing theme (like Avada) to oxygen and Gutenberg.

[@martinargimon730]

Hi jack. Could u perhaps do a quick video how to move a site built with ‘Elementor’ ( Using the ‘Hello’ theme) , to a Wordpress Gutemberg Blocks site . Thanks

[@KodyKimani]

Wow the exact video I need to watch!

[@ionbuilds]

These tutorials are awesome. Do you have tutorial from Divi to Guttenberg/Kadence Blocks?

[@cloninger1973]

How hard is it to go from the page builders to Gutenberg and change themes but still keep the blog posts on my site untouched with the dates and content still intact? Thank you for your help

[@javierordonez5587]

Hello Jack!!, Great Video and information. I wanted to ask you about all the plugins that I have installed from all the other themes? do you have a video that explains how to removed them? please let me know, Thaks!!.

[@jackliu3634]

Hi, Sir Your video is great and so in your mind, we don't need to elementor to build the page?

[@ajtam05]

In any case, this step-by-step helped. My website is fairly new and no traffic, so prob best to do it before it gets too messy. You got a subscriber out of me. Thanks!

[@StartUpK]

Could you please make intensive one for switching from divi to kadance.

[@javedbadshah8513]

I was thinking of the same thing and you came up with this video! Its been a while I've been watching your videos and all of them are very informative and helpful. Keep up 👍 the wonderful work ur doin

[@19mad92]

another great vid! Thank you, you create just awesome value. What is your setup you use? What combination of theme and plugins?

[@justtatythings]

Hi Jack! I just created a staging site and am transferring everything over from thrive to Kadence blocks. I was wondering if changing to Gutenberg blocks would affect SEO since the coding is different? I just want to know how Google will see my content :)

[@lakarama]

The same question!

[@thierrydebelder2947]

Cool tutorial. If you install Spectra you can add a star rating, way easier then the method you showed with the icons Jack.

[@MatBobby]

How about moving from Divi to Gutenberg and removing all of the short codes?

[@JackCao]

What does the shortcodes do? I think you may need to find alternative replacement before you make the switch.

[@krisang6961]

Great video. Thank you very much. Can you do a video to switch from Total Theme (WPBakery) to Gutenberg?

[@veroniquevanheerden7897]

Thanks so much, I feel motivated again, I will do the changes, from elementor to Gutenberg, but can you please do a video on Blocksy theme, or should I change to Kadance, the thing is I like my sticky transparent header, and Kadance don't over it in the free version, please help 😊

[@JackCao]

I did a video on Blocksy's sticky header. kzbin.info/www/bejne/pXTSm6KVoZ12mac Which area of Blocksy would you like me to cover?

[@gaminglebron8687]

Hi! Could you make such a tutorial for Astra?

[@siddhanthsukhdeve9405]

Sir can you please make a video on best settings for WP Rocket

[@JackCao]

There is actually no "best settings" for WP rocket. It is all about trial and error because everyone's site is different.

[@riezan]

Oh I thought Gutenberg is a page builder!. Thanks for this bro. I've been following your reviews on such a topic

[@JackCao]

Thank you! If you have any tutorial request, let me know 😊

[@drammeh1209]

Can you make a tutorial or side by side comparison with Bricks builder and others builders including Guttenberg?

[@JackCao]

Sure! I am planning a speed comparison video between Gutenberg vs all page builders. Or, are you talking about the usability between Gutenberg and Page builders?

[@KodyKimani]

Is there a way to add a related posts element to the bottom of every post - I just tried but made a mess of it?

[@JackCao]

Yes, depending on the theme you use. If you are using Kadence, Generatepress, Blocksy, or other themes that allows "Hook Elements", you can add related posts below your content. In the next video on my channel, I will be demonstrating how to create a magazine style website, where I will be using hooked elements a lot. I hope that helps.

[@KodyKimani]

@@JackCao Thank you so much! I will definitely watch that - it's generate press I'm using by the way. I bought the pro version. I just switched from Oceanwp and ditched elementor - well I'm working on the staging version.... one post at a time .... lol ... i'll get there!

[@esthermirandalima]

Thank you for this vídeo!

[@gregjones9199]

I've hit the wall with DIVI so I'm going to take Jacks's advice here. Not only is Divi slow, but I keep paying so-called tech gurus to fix my site to no avail. I guess it's time to pull the trigger. And hopefully, Divi won't present me with even more bugs as I get it off my site. Thanks, Jack.

[@jabien]

Any recommendations for a posts block that will let you manually select which posts are featured? (Not just by category or tag)

[@JackCao]

Yes. It will be the Post Grid/Carousel Block from the Kadence Blocks Pro. I did a tutorial creating a magazine site from scratch and it will show you how to select a specific post or page from your site. kzbin.info/www/bejne/lanFoa2KqM-cfLs

[@lingobol]

Please create a video comparing fastest themes. Compare the best and provide your recommendation.

[@Businessnavigate]

fantastic training - thank you

[@JackCao]

Glad you enjoyed it!

[@andyvonbusse3503]

Jack, great videos. Can you take a look at Gutentor and see what you think? They have an amazing amount of templates for Gutenberg. From Nepal of all places.

[@JackCao]

Wow! Just checked it and it seems to have many blocks and templates. Maybe I will do a deep dive on that Block Plugin.

[@kevinhayler3499]

I use Beaver Builder with Generate Press and changed all the pages easily apart from the home page. I cannot figure out how to reproduce the same layout at all. All I want is a full header with 3 tiles below. Then a sidebar to the right and 5 blog previews to the left. Easy with BB, but not without. At least for me.

[@JackCao]

Let me help you. Send me an email. [e-mail]

[@kevinhayler3499]

@@JackCao thanks Jack I sent you a message . Any tips appreciated.

[@ernestomorrisonp.3479]

great video !! thanks a lot !!

[@GigaBuzzStore]

I would like to use the Nicepage theme instead of the Kadence. Have you any video tutorial on that?...

[@JackCao]

Unfortunately I don't have a tutorial on them. Very interesting theme, I will check them out. 😊

[@muslimkhan100]

Very useful liked and subscribed.

[@JackCao]

Awesome, thank you!

[@tomfraser3086]

I have switched most of my websites from Divi to Gutenberg (Kadence Theme) I have one, though, that has 100+ posts and each post has a Gallery and a Video Player with up to 10 videos....I'd like to make the switch, but frankly, i'm really apprehensive

[@earthgraduate726]

Hi Jack , is there any custom positioning or absolute positioning plugin available for Gutenberg ?

[@JackCao]

Yes. Coming soon here: jackcao.com/stackable Its version 3 which is releasing this month will have lots of cool animations and customizations with clean codes. 🙂

[@earthgraduate726]

@@JackCao actually I'd like to move an image , block or column anywhere within a block without changing its size . I hope it does the job for free .

[@ajtam05]

I just started my affiliate blog and initially bought JNews theme (which I still like) and I believe it automatically downloaded the Elementor plug-in? In any case, being new to Wordpress, I didn't know anything and just used Elementor because it looked easier and thought it's all the same since it was available. I eventually ran my website for speed and realized it was subpar on both GTMetrix and Page Speed Insights (more so here). Then I used Autoptimize and Async, which boosted GTMetrix to 88% for speed and 90-94% for structure. But Page Speed went from Mobile from 15 to 30-35 and Desktop from 65 to 70-90. Problem was......I was having issued with mobile version functionality with the button etc because of the async loading of CSS/JQuery/JS etc. Played around until it worked on mobile and now the actual speed feels a lot faster, but because everything is inline CSS, my mobile is around 7-12 and desktop is around 40-50 rating. I lose either way. Lol Sigh...luckily I only have about 6 posts so far, but I really just want to write articles. This is such a pain a newbie. Lol

[@Lulu-kt6gr]

What if I just use Gutenberg going forward, after 48 posts with Elementor? Will that help speed? I’m adding Ezoic and just Now learning about the pitfalls of Elementor:(

[@Tripwithadi]

Great content Jack.. Can you please help.. How to remove white spaces between row layout in kadence? I already set the top-bottom padding and margin to 0.. But when previewing, I still can see there is white spaces.. (I used colored background)

[@JackCao]

In every row layout, there will be 2 layers. The row layout and the section. Each of them comes with padding and margin. And if you are adding an element on top of the row layout, it has its own padding and margin as well. So, I would recommend that you visit each layer and check the padding and margin.

[@RohitKumar-qt1hr]

Hey. How sustainable it is to use plugins like the kadence blocks plugins? Or any block plugins for that matter. Don't they make the website clumsy just like the page builders do?

[@RohitKumar-qt1hr]

For example, removing plugins that use shortcodes can be tricky. And sometimes removing plugins can leave cache files that you have to remove manually.

[@JackCao]

From what I know, Gutenberg Blocks do not leave cache files on the server. When deleted, blocks used are automatically converted to html, but they will not look the same as when the plugin is installed. As for sustainability, I think it is here to stay because it is supported by WordPress and inherited in the WordPress editor.

[@marioluna6203]

Thank you for the amazing tutorial! I have just one question in mind. If I already have an Elementor site set up, would it be possible to build the same pages in Gutenberg page by page and just replace the previous page after the new one is ready? This way I could avoid any SEO problems from sudden switches and do everything at my own pace.

[@JackCao]

If you mean to revert your elementor page back to the wordpress editor, and redesign it with gutenberg blocks one page at a time, then yes, that's another way to do it! 😀

[@marioluna6203]

@@JackCao Awesome, big thanks for the reply!

[@letyjay9715]

great question, exactly what i was looking for. i wanna ditch my theme ! waste of my money tbh!

[@3urnUp]

QUESTION: Can I use Gutenberg to create customized archive pages, such as the author pages and some categories? I'm doing this with Elementor.

[@JackCao]

I am pretty sure you can and this is a topic I will do a tutorial on hopefully this week or the next. 😀

[@beatriceprinz6308]

It would be fabulous if you create a website from scratch using Flexia theme also available templates provided by various plugins, like Ultimate Addons, Stackable etc

[@RealignYourMind]

So all this did for me was switch my theme to Kadence but it's still operating inside the Elementor plugin. I still don't know how to make the full switch from Elementor to Gutenberg. You did not cover how to install Gutenberg or any of that.

[@JackCao]

I have quite a few tutorials on my channel that shares with you how to design a page using Gutenberg Blocks. You do not need to install the "gutenberg" plugin from WordPress, that plugin is for exploratory purpose. Instead, install "Kadence Blocks" and those designing blocks will appear in your Wordpress editor.

[@robertdavidlang52]

BTW, Live Canvass can make blocks for Guttenberg and you can remove LC and the blocks work perfectly as Guttenberg blocks. Why? Because they are coded exactly the same way.

[@peakminute]

I want to switch one site to Gutenberg. However, some elements break in my case, I've tested already. Heck, some companies might be doing it on purpose to lock clients...

[@JackCao]

Yeap. Most page builders will lock you in to their content platform, even though they say they won't. It is a painful process, but a necessary one, in my opinion. Please do the change on a staging area.

[@peakminute]

@@JackCao 10 years ago all page builders were a thing (talking about posts). It was hard to do simple tasks like make a container and divide the layout into several sections horizontally. Now I've checked: all tables, buttons, and custom HTML will be broken in my case. Heck, I need to lock a time and start working on about 50 posts.

[@vwtourandtransportbali6555]

hi jack how i can switch for woocomerce from elementor go to Gutenberg Blocks, couse im not see the Gutenberg Blocks on woocomrece

[@JackCao]

You can't directly edit Woocommerce content with Gutenberg Blocks. That's something that the WordPress community is working on. So, I have created this video to show you how to customize single product pages with Gutenberg Blocks: kzbin.info/www/bejne/eGeqmmilaqqBaqc&pp=sAQA

[@limsauliang4967]

Hi jack, have u tried the new builder called "bricks", other youtuber said it is the best builder now days. What is your opinion jack?

[@JackCao]

Trying that now. Just bought the builder. Will do videos on that 🙂

[@RedcubeX24]

Hey Jack! Any tips on mobile editing? Responsive editing in Thrive is a blessing while with Gutenberg landing the perfect layout is a real pain. Ive noticed that some blocks in kadence arent responively editable. For example, take the info box. Align the image right on desktop, left on mobile. Preview mobile in gutenberg -> image is right View real mobile -> image is left This is a real pain.

[@JackCao]

Hmm.. I understand what you mean. It is hard to get a full gauge of how your site will look like on Gutenberg. So, what I would do, just like all the tutorials I do on my channel, I always have a split screen. On the left, I will have the gutenberg editor, and on the right, I have a live page where it will reflect all the changes (I will resize the browser accordingly to have a live view of desktop and mobile). And I will refresh the live page whenever an edit is made. This way you skip the reliance on Gutenberg preview (hence avoiding pain) 😊

[@gumballdegree]

Hi Jack, can you help me with this issue? I'm trying to build a homepage with kadence AND kadence blocks. I have a blog site and I used the "posts" block, but when I use it and set in to show the last 6 posts (for example) there's no pagination option for readers to go back to previous posts. Am I missing something?

[@JackCao]

Hello! Thank you for reaching out! The "posts" block under the Free Kadence Blocks does not have pagination. If you need the pagination, you would need to use the "Post Grid/Carousel" from the Kadence Blocks Pro. Check this: bit.ly/kadence-post-grid

[@thelongarmmarine]

I’ve been using Elementor Pro/Astra for most of my sites...but if I rebuild them in Gutenberg/Kadence, won’t there be some 'artifacts' left when I deactivate/delete the plugin & theme? Or will it be 'clean' & show the best speeds & analytics? Thanks for the videos!

[@JackCao]

No, there won't be any "artifacts", and those elements created with elementor will be reverted back to its original HTML form. You might lose some elements as well. For Thrive Architect, it is the icons and buttons. Elementor might be different. So, I highly recommend that you work on a staging area. Also, a switch doesn't immediately guarantee a 90+ score. You still need to do some adjustments and optimization, and making sure those elements created in Elementor doesn't break in Gutenberg. It is a tedious process as you have to visit each page to make the adjustments.

[@nguyentuan7704]

but guttenberg doesnt offer many templates kit to work on, i have problem with website´s design

[@JackCao]

Try this Block plugin: jackcao.com/stackable It has many ready made designs, specially made for convenience.

[@productpromotions1736]

Hi how about generatepress premium theme

[@JackCao]

Generatepress is the fastest WordPress theme on the market. They are the king of speed, but lack in generic customization. If you need customization, you will need to know CSS, html, & Javascript. Otherwise, you will have to contact their awesome support to help you out. You can use this link to get the latest discount: jackcao.com/generatepress

[@productpromotions1736]

@@JackCao ya actually I have a generate press premium theme. I would love to have a private conversation with on this with you mate...

[@ernestomorrisonp.3479]

you rock!!

[@TiagoDezan]

Hi Jack, I hope everything is fine with you. Would it be possible for you to clarify something for me? I want to have Kadence's annual membership ($ 169) and I saw that Kadence Blocks is included in that membership. My doubt is whether the version of Kadence Blocks included in the membership is PRO or the normal (free) version. Thank you for everything :)

[@JackCao]

The Full Kadence Membership ($169 / year) includes every product of Kadence which means it includes the PRO version of Kadence Blocks. 😊

[@MisteR--]

I seriously wait the next versions of Kadence or other Gutenberg addons because graphically it stay very very poor comparing to Divi. If someone think different I have a challenge ... recreating my website on Divi to Gutenberg

[@KrzysztofGrodzki_fusserg]

How do you think this is the time when you should seriously consider moving to building your website on Gutenberg?

[@JackCao]

Absolutely! Because in the next Google update web vitals will officially be considered a ranking factor. Page builders will not get you good web vitals and Gutenberg will. Plus, as Gutenberg matures, it will have more and more features. Currently, Gutenberg blocks provides up to 80% of what page builders can offer, so all the more reason to make the switch early. 😀

[@gambomaster]

It's simple. Just use Bricks Builder. It looks like a child of Elementor, Divi and Oxygen. It can also load gutenberg blocks and vice versa. 🙂

[@JackCao]

You know it is even harder to switch from one page builder to the other right? Because with bricks you have to rebuild the theme area from scratch. It is easy of you start fresh but most of us have a running website.

[@BgmSquadReloaded]

1st view

[@JackCao]

Thank you!

[@BgmSquadReloaded]

@@JackCao anytime bruh... ❤️

[@victorrenevaldiviasoto9728]

The #1 issue because I don't want to go Gutenberg is because of the painful responsiveness it has and the fact that 83% of my traffic is from mobile devices

[@tvmamak1482]

You don't need to switch to Gutenberg if SEO is not important

[@JackCao]

I agree.

[@deniss.3661]

Hello! Check the email (and spam) with a letter of cooperation (ConveyThis)