⏰ TIMESTAMPS BELOW. Using a real client's website, I will show you in this tutorial how to switch from Elementor to Gutenberg, how to migrate your website to different web hosting, and the super-easy way to make a website responsive across all devices. You'll learn how to make a WordPress website using the WordPress Block Editor, Kadence Theme and Kadence Blocks. You'll see how Gutenberg makes your website faster with better Google Core Web vital scores compared to Elementor.

🔔 SUBSCRIBE & HIT THE 🔔 to turn on notifications & never miss a new upload!

🔗 USEFUL LINKS 🔗

REM Chart = https://www.jackinthenet.com/from-pix...
Kadence = https://www.jackinthenet.com/kadence
SiteGround = https://jackinthenet.com/sg

⏰ TIMESTAMPS ⏰

Intro (00:01)
Why switch to Gutenberg (00:50)
Google Core Web vitals (01:20)
Hosting (02:15)
Free Kadence Theme & Gutenberg Blocks (03:30)
My client's existing Elementor website (04:00)
How to set global colours (05:00)
Designing the Hero Section (06:30)
Making Kadence full width and removing page title (09:50)
Parallax images (10:30)
Heading titles and the DOM tree (11:25)
Row layout backgrounds and overlays (13:45)
Padding vs Margin (15:00)
Create a menu using custom links (17:30)
How to use REM to make typography fonts responsive across all devices (19:15)
Mobile-friendly design (26:00)
Designing multi-column layouts (27:20)
Image borders and box shadow effects (28:30)
Designing header, logo, favicon, nav menu & CTA button (34:00)
Kadence sticky header (38:00)
Fixed vs Parallax image and icon list (39:20)
Kadence footer and creating custom widget block CTA button (43:30)
How to make an anchor menu scrolling effect using Kadence advanced HTML anchor (45:55)
Adding animations for headings and paragraph text with Kadence Blocks Pro (49:35)
How to migrate WordPress website from one host to another (53:55)
Comparing before and after Google Page Speed Insights (57:15)
Thank you (58:15)

Thanks for watching, make sure to comment! And who do you know that would benefit from this tutorial? Spread the love, share this with them.

Jack in the Net
https://www.jackinthenet.com

#gutenberg #wordpress #kadence


Affiliate Disclaimer: This video & description contains affiliate links. If you buy a product through this you won't pay any extra, but I get a small commission. Thank you for that support it really helps to keep making free video tutorials.