Twenty Twenty One Theme Getwid

Twenty Twenty-One Theme Examples with Getwid Blocks

Home > Blog > Getwid Gutenberg Blocks > Twenty Twenty-One Theme Examples with Getwid Blocks

The Twenty Twenty-One theme embraces the fundamentals of the block editor’s anatomy. In simple terms, just like any official WP theme predecessor, this theme is made to work smoothly in Gutenberg.

If you take a look at its demo, you’ll see that it’s a perfect canvas for a portfolio or personal website.

Alongside the development of the block editor came the rise of the block editor addons. These addons offer many more blocks that are not offered by the native WordPress builder.

And in this post, we’re about to discover how the 2021 theme plays with one of them, Getwid, our WordPress blocks library that holds an approval rating of 94% based on 64 reviews and is so far used by 30,000+ people on their WordPress sites. Woohoo!

Getwid will help you add and design many more different functional and creative blocks still inheriting the native styling of the newest default WordPress theme. You are free to resort to it when you lack some particular content pieces or ready-made designs.

The Twenty Twenty-One theme embraces the fundamentals of the block editor’s anatomy. In simple terms, just like any official WP theme predecessor, this theme is made to work smoothly in Gutenberg. If you take a look at its demo, you’ll see that it’s a perfect canvas for a portfolio or personal website. Alongside the development of the block editor came the rise of the block editor addons. These addons offer many more blocks that are not offered by the native WordPress builder. And in this post, we’re about to discover how the 2021 theme plays with one of them, Getwid, our WordPress blocks library that holds an approval rating of 94% based on 64 reviews and is so far used by 30,000+ people on their WordPress sites. Getwid will help you add and design many more different functional and creative blocks still inheriting the native styling of the newest default WordPress theme. You are free to resort to it when you lack some particular content pieces or ready-made designs. [getwid blocks gutenberg] The key highlights of the Twenty Twenty-One theme Layouts the “wide” block width: 1240px [full width twenty twenty one theme] the “full” block width spans across the entire width of the screen [full width twenty twenty one block] Patterns In order to minimize the misuse of the blocks, the Twenty Twenty-One WordPress theme offers many pre-made patterns you can add to a page in a few clicks: [patterns twenty twenty one] Each pattern comes with its styling toolchain to help you customize it further: [patterns default wp theme] Colors You can choose a different base background color scheme via the WP Customizer > Colors. The theme will automatically choose complementary colors for the typography based on which background color you’ve chosen: [colors] This will save you so much time! The Twenty Twenty-One default theme also supports the dark mode. If it’s enabled, the site visitors will be able to view your site in a dark mode: [dark mode twenty twenty one] Footer widgets The theme supports footer widgets you can fill in with your content, for example, add links to posts, contacts info, images, social media icons and more. An alternative place for your social media links is a Secondary menu above the footer. [secondary menu] Let’s now see what you can create with Getwid and Twenty Twenty-One. More ready-made Getwid templates Getwid also ships with many more design patterns categorized by purpose, for example, you can add hero and subhero sections, call-to-action parts, contacts pages, testimonials and other designs commonly used across different types of websites. [getwid template library] Let’s see how one of them looks with the default Twenty Twenty-One styling: [getwid template contact us] Since you can change the styling of each individual block in this pattern, you can, for example, change a button position, style and color; change background color, and customize the image styling: [getwid styling] The vast majority of these patterns are made with the Section block - a powerful block that can house any number of blocks and comes with a ton of styling features, including the facility to use different backgrounds - gradients, videos, image, sliders and more. It allows you to use any section width: [section getwid] For example, let’s take another pattern and use an image in background: [background color section getwid] Or place a slider in background: [background slider getwid] Another pleasant thing is that you can make changes as for the block positions and alignments in a visual mode just by dragging and dropping the angles: [getwid angles] The section block is so diverse that it can help you add different shape dividers and apply animation effects. For example, let’s add a bottom shape divider: [dividers getwid] Or let’s make it more symmetrical: [dividers getwid2] With a combo of the Section block and the power of the Twenty Twenty-One theme, we expect your workload to be really enjoyable: you can combine different ready-made Twenty Twenty-One theme patterns with the Section block, automatically choose complementary colors via the WP Customizer and add any styling options you want. WordPress has never been easier! Image galleries, pop-up videos and sliders You can add breathtaking visuals, apply animation effects, create videos with Getwid and more. For example, create an awesome presentation with a video - you can also upload your cover image, choose a button style and more: [pop up wordpress block getwid] An Image Hotspot is among the unique Getwid blocks - it allows you to place animated markers over the image so that the site visitors can check out the details of each image part: [hotspot] With the unique content timeline block, you can build a timeline of events in a chronological order. [content timeline] It’s fully customizable as to the colors, styling and the blocks you can use inside the timeline containers. It looks good in the default WordPress Twenty Twenty-One theme: [timeline events wordpress block] Although the 2021 theme itself focuses on galleries and visual, Getwid still has something to offer: [image stack gallery] It’s an Image Stack Gallery which allows you to create a gallery and put images in unusual forms. There are several types of sliders. If you want to create a mere image slideshow, let’s place one inside the Section (and add some gradient background). [image slider block getwid] If you need to add text over the images, the Media and Text slider by Getwid will come in handy: [media and text slider] One more image-centered block is banner - you can several apply animation effects and decorations to it: [banner block] And it looks fine out of the box! You don’t need to sweat over each block for hours. Add functional blocks: the table of contents, tabs and more Getwid ships with numerous blocks to help you present information in a structured way, put information in all sorts of tabs or simply improve the presentation of your feature/offers/services sections. As we can see, most of the times these blocks play nicely with the default 2021 theme styling, so your task is to just add blocks, find the best position for them and probably change text colors if needed. For example, Getwid offers the toggle, accordion and tabs blocks for such types of content as FAQ pages. Here is one them, accordion, in action: [accordion block wordpress] You can optionally leave one tab opened by default, people will click on the rest of them: [accordion getwid] You can also create tables, the tables of contents, and other functional content elements. For example, the Table of contents block will come handy for long posts: [table of contents block] Getwid also comes with many blocks that would fit business websites. For example, there are a number of blocks for creating a countdown timer, testimonials, progress bars, pricing tables and more. For example, here is the pricing table: [pricing table] Getwid even deals with the narrowly dedicated niches, including such list templates you can use for restaurant or cafe websites: [pricing] Automatically sourced posts, pages and custom post types Getwid stands in the vanguard of working with the automatically sourced posts thanks to several dedicated blocks: the Custom Post Type, Posts Carousel, and Recent Post blocks. [custom post types] Going one step further, you can create a custom template for your posts, there are a few templates for this: [templates getwid] So your posts or custom post types will be shown in the format you created yourself: [custom post type getwid] As we know, these blocks are especially loved and used by Getwid users. Build better content in the Twenty Twenty-One theme with Getwid Thanks to the superpowers of Twenty Twenty-One (e.g. automatic color scheme) and the content-rich toolset of Getwid, you have almost no limitations when you need to build a portfolio, a business site or a blog in the block editor. The Getwid blocks most of the time seamlessly inherit the styling from 2021 providing you with awesome, good-looking content out of the box. Getwid WordPress Blocks is free to download, so grab it right away and start building better content in WordPress.

The key highlights of the Twenty Twenty-One theme

Layouts

  • the “wide” block width: 1240px

full width twenty twenty one theme

  • the “full” block width spans across the entire width of the screen

full width twenty twenty one block

Patterns

In order to minimize the misuse of the blocks, the Twenty Twenty-One WordPress theme offers many pre-made patterns you can add to a page in a few clicks:

patterns twenty twenty one

Each pattern comes with its styling toolchain to help you customize it further:

patterns default wp theme

Colors

You can choose a different base background color scheme via the WP Customizer > Colors.

The theme will automatically choose complementary colors for the typography based on which background color you’ve chosen:

colors wordpress

This will save you so much time!

The Twenty Twenty-One default theme also supports the dark mode. If it’s enabled, the site visitors will be able to view your site in a dark mode:

dark mode twenty twenty one

Footer widgets

The theme supports footer widgets you can fill in with your content, for example, add links to posts, contacts info, images, social media icons and more.

An alternative place for your social media links is a Secondary menu above the footer.

secondary menu

Twenty Twenty-One Theme Examples

Let’s now see what you can create with Getwid and Twenty Twenty-One.

More ready-made Getwid templates

Getwid also ships with many more design patterns categorized by purpose, for example, you can add hero and subhero sections, call-to-action parts, contacts pages, testimonials and other designs commonly used across different types of websites.

getwid template library

Let’s see how one of them looks with the default Twenty Twenty-One styling:

getwid template contact us

Since you can change the styling of each individual block in this pattern, you can, for example, change a button position, style and color; change background color, and customize the image styling:

getwid styling

The vast majority of these patterns are made with the Section block – a powerful block that can house any number of blocks and comes with a ton of styling features, including the facility to use different backgrounds – gradients, videos, image, sliders and more.

It allows you to use any section width:

section getwid

For example, let’s take another pattern and use an image in background:

background color section getwid

Or place a slider in background:

background slider getwid

Another pleasant thing is that you can make changes as for the block positions and alignments in a visual mode just by dragging and dropping the angles:

getwid angles

The section block is so diverse that it can help you add different shape dividers and apply animation effects. For example, let’s add a bottom shape divider:

dividers getwid

Or let’s make it more symmetrical:

dividers getwid2

With a combo of the Section block and the power of the Twenty Twenty-One theme, we expect your workload to be really enjoyable: you can combine different ready-made Twenty Twenty-One theme patterns with the Section block, automatically choose complementary colors via the WP Customizer and add any styling options you want. WordPress has never been easier!

Image galleries, pop-up videos and sliders

You can add breathtaking visuals, apply animation effects, create videos with Getwid and more.

For example, create an awesome presentation with a video – you can also upload your cover image, choose a button style and more:

pop up wordpress block getwid

An Image Hotspot is among the unique Getwid blocks – it allows you to place animated markers over the image so that the site visitors can check out the details of each image part:

getwid image hotspot

With the unique content timeline block, you can build a timeline of events in a chronological order.

content timeline getwid

It’s fully customizable as to the colors, styling and the blocks you can use inside the timeline containers. It looks good in the default WordPress Twenty Twenty-One theme:

timeline events wordpress block

Although the 2021 theme itself focuses on galleries and visual, Getwid still has something to offer:

image stack gallery

It’s an Image Stack Gallery which allows you to create a gallery and put images in unusual forms.

There are several types of sliders. If you want to create a mere image slideshow, let’s place one inside the Section (and add some gradient background).

image slider block getwid

If you need to add text over the images, the Media and Text slider by Getwid will come in handy:

media and text slider

One more image-centered block is banner – you can several apply animation effects and decorations to it:

banner block

And it looks fine out of the box! You don’t need to sweat over each block for hours.

Add functional blocks: the table of contents, tabs and more

Getwid ships with numerous blocks to help you present information in a structured way, put information in all sorts of tabs or simply improve the presentation of your feature/offers/services sections.

As we can see, most of the times these blocks play nicely with the default 2021 theme styling, so your task is to just add blocks, find the best position for them and probably change text colors if needed.

For example, Getwid offers the toggle, accordion and tabs blocks for such types of content as FAQ pages. Here is one them, accordion, in action:

accordion block wordpress

You can optionally leave one tab opened by default, people will click on the rest of them:

accordion getwid

You can also create tables, the tables of contents, and other functional content elements. For example, the Table of contents block will come handy for long posts:

table of contents block

Getwid also comes with many blocks that would fit business websites. For example, there are a number of blocks for creating a countdown timer, testimonials, progress bars, pricing tables and more. For example, here is the pricing table:

pricing table

Getwid even deals with the narrowly dedicated niches, including such list templates you can use for restaurant or cafe websites:

pricing list block wordpress

Automatically sourced posts, pages and custom post types

Getwid stands in the vanguard of working with the automatically sourced posts thanks to several dedicated blocks: the Custom Post Type, Posts Carousel, and Recent Post blocks.

custom post types

Going one step further, you can create a custom template for your posts, there are a few templates for this:

templates getwid

So your posts or custom post types will be shown in the format you created yourself:

custom post type getwid

As we know, these blocks are especially loved and used by Getwid users.

Build better content in the Twenty Twenty-One theme with Getwid

Thanks to the superpowers of Twenty Twenty-One (e.g. automatic color scheme) and the content-rich toolset of Getwid, you have almost no limitations when you need to build a portfolio, a business site or a blog in the block editor. The Getwid blocks most of the time seamlessly inherit the styling from 2021 providing you with awesome, good-looking content out of the box. Getwid WordPress Blocks is free to download, so grab it right away and start building better content in WordPress.

Details of each Getwid block

Download Getwid

Where do I edit the layout width of the Twenty Twenty-one theme?

In the Twenty Twenty-one theme, go to the needed block, click on the block settings panel and choose a wide or full layout. You can also use ‘Patterns’ (next to the ‘Blocks’) to insert the whole page parts with the already adjusted layouts.

How do I edit the Twenty Twenty-one theme colors?

You can choose a different base background color scheme for Twenty Twenty-one via the WP Customizer > Colors. The theme will automatically choose complementary colors for the typography based on which background color you’ve chosen. You can also choose a dark or lite mode (with the typography automatically adjusted) via the WP Customizer > Colors & Dark Mode.

How well do Getwid blocks work with the Twenty Twenty-one theme?

Since Getwid is initially built to inherit styling from any theme it works with, without adding any bloat or custom styling, it also works smoothly with the Twenty Twenty-one theme.

Was this article helpful?

Yes (2) No

You have already left your review.

2 Replies to “Twenty Twenty-One Theme Examples with Getwid Blocks”

  1. Hi! Nice tutorial, this tutorial help me to know about getwid and how to use the blocks. it’s an amazing experiance with WordPress book editor and getwind.

    Thanks for sharing

Leave a Reply

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