The New Twenty Twenty Theme in WordPress 5.3

Published in WordPress.

A few weeks ago the new version of WordPress was released. WordPress 5.3 is characterized, mainly, by all the UX and UI improvements it includes in the block editor and by its new default theme.

Twenty Twenty has been designed with the WordPress block editor in mind. In today’s post I would like to briefly introduce the new theme, share with you some of the things that make it special, and teach you how you can set it up and adapt it to your needs.

Twenty Twenty at a Glance

With each new WordPress update, the block editor takes a qualitative leap forward (don’t forget that the editor itself is under a very active development and available as a plugin). The ultimate goal of Gutenberg is to become a fully-fledge, user-friendly page builder that allows users to design and structure their websites as they wish.

New Twenty Twenty theme in WordPress
New Twenty Twenty WordPress theme.

The responsibility of a WordPress theme is to add some personality to the structure and design created by the user in the block editor. As defined by the creator of the theme:

Twenty Twenty is designed with flexibility at its core. If you want to use it for an organization or a business, you can combine columns, groups, and media with wide and full alignments to create dynamic layouts to show off your services or products. If you want to use it for a traditional blog, the centered content column makes it perfect for that as well.

Anders Norén

One interesting fact about the new WordPress default theme is that, unlike its predecessors, it hasn’t been created from scratch—it’s based on a theme that already existed in the WordPress.org repository: Chaplin.

Promotional image of the Chaplin theme.
Promotional image of the Chaplin theme for WordPress.

Another feature that distinguishes Twenty Twenty is the typography it comes with, Inter, designed by Rasmus Andersson. It’s a free and open typeface created to facilitate text reading, especially when font size is very small.

Screenshot of Inter’s home page (an open typeface).
Inter is the default typography that comes with Twenty Twenty.

How to Install the New Twenty Twenty Theme

As I’ve already mentioned, this theme is the new default theme in WordPress 5.3. Therefore, if you are creating a new WordPress installation and use its most recent version, the theme will already be there.

Twenty Twenty theme is the default theme in WordPress 5.3
Twenty Twenty theme is the default theme in WordPress 5.3.

But it is also possible to install it in earlier versions of WordPress. Just go to Appearance » Themes » Add new and look for the theme “Twenty Twenty”:

Twenty Twenty is already included in WordPress 5.3
Twenty Twenty is, as any other theme, extremely easy to install.

Keep in mind that the theme has been designed with Gutenberg in mind, so I recommend you only use it if you create your content with the block editor.

How to Customize Twenty Twenty

The theme is easily customizable from the WordPress’ built-in theme customizer. Click on Appearance » Customize and you will see all the available options:

Customizing Twenty Twenty in WordPress
Customizing Twenty Twenty in WordPress.

I’m sure you’re already familiar with most of the available settings, so let’s take a closer look at those that I think are the most interesting. One of the first things I’d personally tweak in Twenty Twenty is its color palette, because I don’t like the sepia tone it uses by default. Instead, I’d use something whiter:

Twenty Twenty default color scheme
Twenty Twenty default color scheme.

Post Appearance

By default, the appearance of blog posts is sober and elegant. As you can see in the following screenshot, the title appears next to some meta information (author, publication date, category), all shown prominently and very cleanly:

Default view of a post in Twenty Twenty
Default view of a WordPress post in Twenty Twenty.

And right after the title comes the featured image, which more or less blends with the content.

If you don’t use featured images (or you use them only from time to time), this default view is probably the best. But if you do use featured images in all your posts, I recommend you change your posts’ templates to Full Width Template:

Page and post templates available in the theme
Page and post templates available in the theme.

With this template, the featured image becomes even more relevant and is merged with the title and the post’s meta data. As you can see, the image will take the first fold completely:

Template with the featured image using the the first fold completely
Template with the featured image using the the first fold completely.

which is a feature I find pretty neat (no surprise here, as it’s pretty close to what we’re using in our own site, right? 😉)

Menus

Another thing I like about the theme is that it allows you to create multiple menus, depending on the style you like the most. On the one hand, we can choose between two menu options for the desktop:

  • Horizontal menu. It’s the menu shown in all previous screenshots. Options are always visible in the top bar of your website.
Different menus in the Twenty Twenty theme
Different menus in the Twenty Twenty theme.
  • Extended menu. It’s a “hidden menu.” To reveal it, you simply need to click on the ellipsis icon (next to the previous menu) and the extended menu will slide in from the right corner:
Extended Twenty Twenty theme menu
Extended Twenty Twenty theme menu.

Another feat that’s quite nice is the social menu. With it, we can add links to our social networks and the theme will automatically show each profile as a button with the icon of the social network in question:

The social menu of the Twenty Twenty theme
The social menu of the Twenty Twenty theme allows you to add links to your social networks and appear with the corresponding icons automatically.

This is not something that is new to this theme (it’s been available for a while, now, in all Twenty-something themes), but I still love it anyway.

Widgets and Search

Finally, it is also worth mentioning the widget areas the theme includes. Unfortunately, the options we have here are quite limited: you can only add widgets in the footer. So, if you wanted to have a sidebar in your blog or something similar, I’m afraid you’ll have to create a child theme and adapt the templates to your needs.

Twenty Twenty comes with two widget areas in the footer, which correspond to the two columns you see in the capture
Twenty Twenty comes with two widget areas in the footer, which correspond to the two columns you see in the capture.

Regarding WordPress’ built-in search capabilities, the theme includes a quick form for searching stuff on your blog. There’s a button in the menu with a Search icon. Click on it and the search box will show up on the top of your screen via JavaScript:

Dynamic search box include in Twenty Twenty
Dynamic search box include in Twenty Twenty.

Summary

The Twenty Twenty theme is the next step in the Twenty series that comes with every new version of WordPress. I wouldn’t say it’s a revolutionary theme, but in my opinion it’s a very elegant theme that perfectly integrates with WordPress’ new features and capabilities. If you’re thinking about upgrading to a new theme and don’t know which one to use, give Twenty Twenty a chance. It’s fast and looks very nice.

Featured image by Ankhesenamun 96 on Unsplash.

PoorNot badGoodGreatExcellent (No Ratings Yet)
Loading...

Leave a Reply

Your email address will not be published. Required fields are marked: •

I have read and agree to the Nelio Software Privacy Policy

Your personal data will be located on SiteGround and will be treated by Nelio Software with the sole purpose of publishing this comment here. The legitimation is carried out through your express consent. Contact us to access, rectify, limit, or delete your data.