Introducing the Twenty Twenty-Four theme


In this tutorial, we will explore the new WordPress default theme. The idea behind Twenty Twenty-Four was to make a default theme that could be used on any site, with any topic.

Learning outcomes

  1. Highlighting who can benefit from the theme.
  2. Identifying what makes this theme unique.
  3. Exploring the various patterns and templates that come with the Twenty Twenty-Four theme.
  4. Discovering the available style variations.

Comprehension questions

  1. What makes the Twenty Twenty-Four theme different from other default themes?

Transcript

Introduction

Good day, and welcome to Learn WordPress. Let’s take a closer look at the great new theme, Twenty Twenty-Four, that is now available. The Twenty Twenty-Four theme is designed to take advantage of the design tools introduced in WordPress 6.4.

Learning outcomes

The learning outcomes for this session are to highlight who can benefit from the theme, to identify what makes this theme so special, and then to explore the various patterns and templates that come with the Twenty Twenty-Four theme, as well as, discover the available style variations.

Who can benefit from the theme?

Who can benefit from this theme? The Twenty Twenty-Four theme is versatile and designed for various website types, with a focus on three use cases, entrepreneurs and small businesses, photographers and artists, and lastly, writers and bloggers. The idea behind the Twenty Twenty-Four theme was to make a default theme that can be used on any type of site with any topic. If you are an entrepreneur or business owner, the theme has got you covered. There are multiple patterns available to build a business website. The Twenty Twenty-Four theme also really caters well for photographers and artists. And finally, the theme can also be easily customized for blogs.

What makes this theme special?

Firstly, what makes this theme so special? Well, number one, it’s modern and elegant design. Number two, there are a variety of patterns available. And number three, one of my personal favorites is the fact that you have access to whole page patterns and templates. And of course, there are beautiful style variations to choose from.

Whole-page patterns

The first example I wanted to show you was how I created the structure for this About page in one click. As we scroll through the About page, you will notice different sections. And these sections are, of course, patterns that have been added together. To achieve this, let’s start with the blank page. Click on the Inserter, go to Patterns, and in this case, I am after a page pattern or a whole page pattern. So I’ll select Pages, and here we can see a preview of the different pages that are available, and I will select the About page, or the About page pattern. Here I have the layout for my entire About page and now I can just start modifying it and changing it to meet my needs.

Let’s add another whole-page pattern. In this case, an RSVP landing page. After selecting pages, I will scroll down to the bottom and select RSVP Landing. Now I have an RSVP landing page with vertical text, which I can update and tweak to meet my design needs.

Single patterns

Let’s look at some other patterns that come with the Twenty Twenty-Four theme. First up is a pricing table. Next, you can add a pattern to introduce your team to your clients. Or maybe you would like to add a testimonial to a page. There is also a cool call-to-action banner pattern that you can use to get more subscribers. Or maybe you would like to add a section about frequently asked questions. Lastly, there is even a pattern to show off client logos or sponsorships. There are many other patterns to explore and use. It is also worth highlighting some gallery patterns that come with the Twenty Twenty-Four theme to display images or to create a portfolio.

Templates

Now that we have talked about all the fantastic patterns that come with the Twenty Twenty-Four theme, we will shift our attention to templates. Let’s make our way to the Site Editor and select the blog home template. Here we will see that the theme provides us with a whole page template. When we open up the template, we will notice that the structure for our home page has already been created with a beautiful layout and design. Now the user can merely add their own content and make the relevant modifications.

One of the other available templates worth pointing out is the Page with sidebar template. This is perfect for bloggers or for folks who prefer a sidebar on their website. There is also a template named Single with sidebar which allows you to assign this template to single posts if you want your single posts to also have a sidebar. Another unique template that comes with your Twenty Twenty-Four theme is named Page with wide image.

Style variations

Now that we are in the Site Editor, we can also make our way to Styles to explore the various style combinations that come with our theme. When I click on Browse styles, I get a nice zoomed-out view of all the different style variations. This allows me to see how I can change the look and feel of my site. The theme incorporates the sophisticated Cardo font for headlines and Sans Serif for paragraphs for enhanced readability.

Conclusion

Enjoy exploring the new default theme, and visit Learn WordPress for more tutorials and training material.

Workshop Details


Presenters

Wes Theron
@west7

I am an Instructional Designer for the WordPress open-source project sponsored by Automattic. I am a strong supporter of the open-source movement. I have a background in education and content development. I am a husband, father, dreamer and lifelong learner.