WordPress Full Site Editor Tutorial: How to Customize Twenty Twenty-Two Theme from Header to Footer

Learn how to customize your blog or business website using the new WordPress full site editor tutorial.

In this tutorial, we'll use the WordPress Twenty Twenty-Two theme which is the first with full site editing built in!

Download the tutorial assets & setup instructions:

The best way to support or say "thanks" is to start your website idea!

If you use my affiliate links, I get a small cut (no extra cost to you) that helps me create free tutorials like this.

In this video, we'll walk through your website's templates on a block-enabled WordPress theme, which let you edit every aspect of your pages and posts, down to the header/footer.

You can build and customize everything using WordPress blocks and patterns.

Here are the chapters to follow along:

Intro - 00:00
WordPress settings - 00:45
Set your home & blog page - 01:55
Full site editor overview - 03:54
Build homepage template - 05:42
Global styles - 07:55
Block patterns - 13:36
Re-usable blocks - 17:58
Build inner page template - 20:47
Email opt-in call-to-action - 28:28
Build single post template - 31:09
Build blog page template - 32:28
Final look at our customized blog - 37:46
Create your WordPress website today - 38:30

Use the links below to build your side business today!

___________________________________

Start Freelancing & Make Money with Your Skills!

___________________________________

Create Your First Website or Blog Today!

___________________________________

DISCLAIMER: Please note that some links are affiliate promotions. I only recommend products & services that I know and trust.

[zyglog]

Thanks for this video. I recently volunteered to create a new web site for our local Prostate Cancer Support Group. My previous web experience was writing HTML about 30 years ago. I knew I was going to use WordPress. After watching some videos I started out with the twenty twenty theme. I was confused regarding the theme and how to configure it. As I watched this video on the new twenty twenty-two theme and editor it suddenly made a lot more sense. Your video was very informative and interesting.

[nevyoung]

Learned more from this vid than from 3 previous vids I watched. Great stuff! Agree with @Bill Rees below - will have to watch it several times over for it all to sink in! Thank you.

[Paul-nh]

All I can say is WOW! As a rookie to WP 2022, this PROVES to me that itZ possible. Now all I have to do is slow play-back to one-tenth, hide my pineapple-vodka-slushy, and I'll be good to go. Thanks for this comprehensive peek into the possibilities! 😊👍

[jodeverill]

Excellent. Packed full of useful tips and tricks. I built a site based entirely on these techniques. Comprehensive and quick. You’re a great educator.

[chanescholtz]

So glad I found your video. I'm following step-by-step and it's making so much more sense! My site is starting to shape up nicely☺

[chriscaldwellvoiceovers]

Wow, I'm so appreciative for content like this. I've really enjoyed this! Thank you!

[BillRees]

Great stuff Ray. I'll probably have to watch it about 5 times for it all to sink in! But really, really, clear and useful. Thanks.

[nicolahendersonhumandesign]

Great video - super informative, thank you!

[martinkaspar]

Ray: you are a real hero 🌹🌹🌹 - Good job bro - perfect video 👍👍👍👍 Can you do one for the new Theme the TT3.

[sybdeclark]

Thank you so much! You mention using CSS: I can see how to add css classes to a block, under “advanced”. But where should we write the css code itself, i.e. the code for the class? (in a way that it won’t get overwritten by updates)?

[martinkaspar]

Hi Ray - many thanks for the heads up - but what about coming up with a vid that covers all the exciting new things that come with WordPress version 6.0. The world wide WP-Community is waiting for this video!

[docmac]

This was a great guide. Thanks very much

[martinkaspar]

Hello dear Ray - Brilliant introduction - thanks. your videos are a great resource: You provide an in-depth and crystal clear walkthrough of very important topics. Would you do some vids about the new Version 6.1 That would be awesome!

[TFGourmet]

how about custom fonts? how can I use them? I tried using custom fonts from by Brainstorm Force, but didnt work... using the theme twenty twenty-two

[GuitarC]

Hello. I've been following along and really appreciate this guide. Just what I had been looking for. I've been working on a site, was able to build pages and create a navigation menu with drop-downs and I believe I saved it in the templates. But I want to remove a redundant drop-down link and can't find the template. I've looked at each header template and template parts. Is there a way to identify which header template is being used for all of the pages? Same thing for the footer. The site looks proper, but when I look at all of the footer templates, I don't see the one that I had modified... unless I did it in another part of WP? Thanks.

[warrenbest]

twenty twenty-two How to change menu link colors on hover