Twentig – Essential Plugin for Twenty Twenty-Two, Twenty-One & Gutenberg Block Themes

Description

The easy way to build a beautiful website.

The Twentig plugin helps you customize the default WordPress theme (Twenty Twenty-Two, Twenty Twenty-One & Twenty Twenty) and all block themes the way you want with Google Fonts, styles, custom layouts, and many more options.

With enhanced Gutenberg blocks, pre-designed block templates, and starter websites, you’ve got everything you need to build stunning pages that look great on any device — no coding or design skills needed.

“Twentig is a plugin that essentially gives superpowers to the default theme.” — Justin Tadlock, WP Tavern

Customize the most popular WordPress themes. Your way.

Twentig offers powerful features to customize the default theme (Twenty Twenty-Two, Twenty-One & Twenty Twenty) and all block themes — making it easier than ever to create your own professional website.

Advanced theme customization. From post grid to sidebar to header and footer layouts, our plugin provides endless ways to enhance your WordPress theme. Change the look and feel of your website by customizing the fonts (Google Fonts), site layout, global styles, 404 page, and more.

Custom page templates. Control the look of your entire page with our page templates. Easily remove the page title, header, footer, or set a transparent header. Now you can use Gutenberg blocks to create a custom hero, landing page, coming soon page, and more.

Tailored design. Twentig brings design improvements to the default WordPress theme. Our additional block settings and pre-designed block templates are specially built for it — so it’s simple to make beautiful pages with Gutenberg blocks.

Do more with Gutenberg blocks.

Twentig enhances the existing Gutenberg blocks — taking the WordPress block editor to a new level of design and creativity.

Block customization made easy. We’ve added the right amount of features to the Gutenberg core blocks. So you can easily customize your blocks to fit your needs with just a few clicks.

Powerful Gutenberg block features. Twentig provides alternative styles, advanced block settings, and CSS classes. From columns style to group shape divider to typography settings, you have the best tools to customize the Gutenberg blocks and build gorgeous pages.

Build your pages with ready-to-use templates.

Twentig brings hundreds of pre-designed block patterns and page templates — making it easier and faster than ever to create stunning pages.

Flexible block templates. Choose from a variety of versatile block patterns and page templates that you can mix and match to fit your project. Our block template library is designed to enable a wide range of uses and endless design possibilities.

Professional design. Our templates are responsive and give your pages a professional look right from the start — no coding or design skills needed.

Start with a pre-built website.

This feature is currently only available for the Twenty Twenty-One and Twenty Twenty themes.

Instead of starting from scratch, you can quickly import one of Twentig’s starter websites crafted by award-winning designers.

The simple way to import starter websites. Choose from a variety of starter websites and seamlessly load them in a few seconds in the Customizer. Preview and customize your theme any way you like before publishing it to your live site.

Check out the starter websites to see the power and flexibility of the Twentig plugin.

Twentig features list

Check out the screenshots to see how Twentig can transform your theme and the Gutenberg blocks.

ADDITIONAL THEME OPTIONS

Header

  • Header layouts
  • Sticky header (Twenty Twenty-One and Twenty Twenty themes)
  • Header decoration
  • Additional elements: search bar, social icons, button
  • Menu link style
  • Responsive breakpoint

Footer

  • Footer layouts
  • Custom copyright and remove “Powered by WordPress”

Site Layout

  • Content width
  • Wide width

Blog Posts Page

  • Blog layouts: stack, post grid, sidebar
  • Featured image options
  • Blog content options
  • Blog meta options

Single Blog Post

  • Featured image and post title layouts
  • Blog sidebar
  • Single post meta options
  • Hide comments section

Typography & Colors

  • Google Fonts options (curated collection and custom Google Fonts)
  • Google Fonts pairings and Google Fonts presets (Twenty Twenty-One and Twenty Twenty themes)
  • Font settings
  • Color options

Pages (Twenty Twenty-One and Twenty Twenty themes)

  • Custom page templates: remove the page title, header, and footer, or set a transparent header
  • Featured image and page title layouts
  • Custom 404 Page

ADDITIONAL GUTENBERG BLOCK SETTINGS

  • Gutenberg core blocks: top margin and bottom margin, responsive visibility
  • Group: shadow, shape divider
  • Columns: gutter, responsive layout, columns style (card, border), text alignment, stretched link
  • Media & Text: styles (shadow, overlap), responsive layout, reverse stack order, stretched link, full height
  • Cover: styles (shadow, inner border, rounded), aspect ratio, stretched link, hover effect
  • Heading: typography options, decoration
  • Paragraph: wide width, typography options
  • List: styles (dash, checkmark, arrow, border, no bullet, inline), typography options, spacing
  • Image: styles (rounded, shadow, frame, border), shapes, image filter
  • Gallery: stack variation, styles (rounded, frame), fixed width columns, image aspect ratio, gutter, vertical alignment, responsive layout, caption size, border, image filter
  • YouTube, Vimeo, SoundCloud, and Video blocks: style (frame)
  • Latest Posts: styles (card, border), image aspect ratio, heading size, stretched link, text alignment
  • Social Icons: hover effect
  • Quote: additional styles
  • Pullquote: additional styles
  • Table: styles (border, inner border), vertical alignment
  • Navigation: block spacing, responsive breakpoint, menu icon, menu icon size
  • Post Excerpt: max number of words
  • Post Featured Image: styles (rounded, shadow, frame), image aspect ratio
  • Archive Title: option to hide the prefix
  • Post Author: link to author archive, inline layout, avatar shape
  • Post Tags and Post Categories: styles (outline, pill, hashtag)
  • Tag Cloud: style (pill)
  • Search: style (underline)

GUTENBERG TEMPLATE LIBRARY

Hundreds of Gutenberg block patterns grouped by following categories:

  • Columns
  • Text and Image
  • Text
  • Hero
  • Cover
  • Call to Action
  • List
  • Numbers, Stats
  • Gallery
  • Video, Audio
  • Contact
  • Team
  • Testimonials
  • Logos, Clients
  • Pricing
  • FAQ
  • Events, Schedule
  • Query (block themes)
  • Headers (block themes)
  • Footers (block themes)

Dozens of pre-designed page templates:

  • Homepage
  • About
  • Services
  • Contact
  • Single Page

Get more

Enjoying Twentig?

Screenshots

  • Twentig. The easiest way to build a website that fits your project — no coding or design skills needed.
  • Start with a pre-built website. Easily import one of our beautiful starter websites (currently available for Twenty Twenty-One and Twenty Twenty).
  • Create a beautiful blog. Customize the design of your blog any way you like.
  • Customize your header. Change the layout and style, display social icons or a call-to-action button, and even stick the header to the top.
  • Customize your footer. Change the layout and style, edit the copyright, remove "Powered by WordPress", and more.
  • Add Google Fonts. Easily change your theme’s fonts with our font pairings or pick the Google Fonts of your choice.
  • Build with the Twentig template library. Create your pages in no time with our Gutenberg block patterns and page templates.
  • Customize the Gutenberg blocks. Transform the existing Gutenberg blocks with advanced settings to create a beautiful page.
  • Build with Gutenberg block patterns. Choose from hundreds of ready-to-use patterns that you can mix and match.
  • Build with custom page templates. Control the look of your entire page. Remove the page title, header, footer, or set a transparent header.
  • Create a custom 404 page. Delight your visitors with a stunning 404 page.

Installation

Install Twentig

To install and activate Twentig:

  1. Log in to your WordPress Dashboard.
  2. Click Plugins > Add New.
  3. Type Twentig in the search box.
    Alternatively, you can click on Upload Plugin to upload the plugin .zip file.
  4. Click on Install Now.

Once the installation has finished, click on Activate.

Install the default WordPress theme

To take full advantage of Twentig and the Gutenberg block editor, we strongly recommend that you use the Twenty Twenty-Two theme (or Twenty Twenty-One if you prefer to use a classic theme with the Customizer).

To install and activate the Twenty Twenty-Two theme:

  1. Log in to your WordPress Dashboard.
  2. Click Appearance > Themes.
  3. Search for the Twenty Twenty-Two theme and click on Activate.

After installation

Twentig features appear inside the Gutenberg block editor and the Site Editor (or inside the Customizer for classic themes).

  • Inside the Gutenberg block editor, you can find Twentig patterns by clicking the + icon.
  • Inside the Gutenberg block editor, you can find additional block settings in the block settings sidebar (Style, Twentig settings, and Advanced panels) — depending on the selected block.
  • For block themes such as Twenty Twenty-Two, inside the Site Editor (Appearance > Editor), you can find additional style options (Google Fonts, content width, wide width) in the Styles and Twentig Styles sections.
  • For the Twenty Twenty-One and Twenty-Twenty themes, inside the Theme Customizer (Appearance > Customize), you can locate our additional options in the Site Identity, Colors, and Twentig Options panels.

For more details, see our quickstart guide.

FAQ

What are the requirements for using Twentig?

We recommend that you use the latest version of WordPress to take full advantage of Twentig and the block editor.

Should I install the Gutenberg plugin?

No, using the Gutenberg plugin on a production site is not recommended because some features are experimental and unstable. Moreover, Twentig isn’t fully compatible with the Gutenberg plugin.

Is Twentig easy to use?

With Twentig, no coding or design skills are needed. You can customize the WordPress block themes and the Gutenberg blocks in a few clicks. Our responsive pre-designed block patterns and page templates make it even easier to build professional-looking pages.

Do you have a quickstart guide?

Yes, you can find it on our website.

How to customize the Twenty Twenty-Two theme or any Gutenberg block theme with Twentig?

To customize your block theme, open the Site Editor (Appearance > Editor). From there, you can see the Styles icon in the top-right corner. In the Styles section, Twentig adds Google Fonts to the Typography panels.

Next to the Styles icon, you can find the [tw] icon. In the Twentig Styles section, you can change the Heading font family (with Google Fonts), the content width, and the wide width.

Twentig also provides additional settings to the Theme blocks and Design blocks that let you customize your website any way you like.

How to customize the Twenty Twenty-One & Twenty Twenty themes with Twentig?

To customize your theme, launch the Customizer (Appearance > Customize). Here you can easily make and preview changes to your website before publishing them.

For the Twenty Twenty-One theme, find our additional options in the Site Identity, Colors, and Twentig Options panels.

For the Twenty Twenty theme, find our additional options in the Site Identity, Colors, Cover Template, and Twentig Options panels.

How to insert a pre-designed block template?

To insert a block pattern or a page layout:

  1. Inside the Gutenberg block editor, place your cursor where you want to insert the pattern.
  2. Click the + icon to add a new block.
  3. Click on the Patterns tab.
  4. Browse the categories and click on the pattern you want to insert.

How to remove the page title, header and footer or set a transparent header for Twenty Twenty-One or Twenty Twenty?

To let you control the look of your entire page, Twentig provides 4 custom page templates. To change the template of a page:

  1. Open the page you want to edit.
  2. In the Settings sidebar, open the Page tab.
  3. In the Template panel, select the desired template.
  4. Update the page to apply the change.

Is Twentig RTL ready?

Yes! Both Twentig and the default WordPress theme support RTL (Right to Left) languages.

Reviews

20 January 2022
The plugin offers quite some options to the default WP themes and I highly recommend the plugin. I have not had issues or bugs with it while using it, the code is well writtent and support is provided fast in case you need it.
19 January 2022
I like the idea of using the original wordpress theme and extend it. And the Twentig-team has done a great job doing it. With their templates + 10min. of personal final touch (no coding) you have a fast, free and beautiful website. Thanks and well done!
Read all 124 reviews

Contributors and Developers

“Twentig – Essential Plugin for Twenty Twenty-Two, Twenty-One & Gutenberg Block Themes” is open source software. The following people have contributed to this plugin.

Contributors

“Twentig – Essential Plugin for Twenty Twenty-Two, Twenty-One & Gutenberg Block Themes” has been translated into 4 locales. Thank you to the translators for their contributions.

Translate “Twentig – Essential Plugin for Twenty Twenty-Two, Twenty-One & Gutenberg Block Themes” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Change Log

1.4.3

Release date: May 24, 2022

For block themes:

  • New: Adds vertical block spacing setting to the Columns block.
  • New: Adds Roboto Flex as a font-family option.
  • Compatibility: Updates block patterns for WordPress 6.0.

For Twenty Twenty-One and Twenty Twenty themes:

  • Compatibility: Adjusts CSS to make columns layout compatible with WordPress 6.0.

1.4.2

Release date: May 19, 2022

For the Gutenberg block editor:

  • New: Adds aspect ratio setting to the Cover block.
  • New: Adds new hover effect options to the Cover block.
  • New: Adds new styles (rounded and rounded corners) to the Cover block.
  • New: Adds vertical alignment setting to the Gallery block.
  • New: Adds “Caption on hover” CSS class to the Gallery block.
  • New: Adds “+” menu icon option to the Navigation block.
  • New: Adds letter spacing CSS class to the Navigation block.
  • New: Adds new styles (rounded, subtle border) and “Black & white” CSS class to the Featured Image block.
  • New: Adds “Text shadow” CSS class to the Paragraph, Heading, and Post Title blocks.
  • New: Adds “Link no underline” CSS class to the Post Date, Post Terms, and Post Author blocks.
  • Compatibility: Adjusts CSS to make Gallery and Cover settings compatible with WordPress 6.0.

For block themes:

  • New: Adds style (underline) to the Search block.
  • New: Adds styles (outline, pill, hashtag) to the Post Categories and Post Tags blocks.
  • New: Adds style (pill) to the Tag Cloud block.
  • Compatibility: Deprecates the Twentig gutter setting in favor of the new block spacing setting for Columns, Gallery, and Navigation blocks (for WordPress 6.0).
  • Compatibility: Makes Twentig Styles panel compatible with WordPress 6.0 and 5.9.

For Twenty Twenty-Two theme:

  • Compatibility: Adjusts CSS for full-width blocks inside the editor for WordPress 6.0.

For Twenty Twenty-One theme:

  • Enhancement: Updates the Google Fonts .json file.

For Twenty Twenty theme:

  • Enhancement: Updates the curated Google Fonts list.

1.4.1

Release date: March 22, 2022

For the Gutenberg block editor:

  • Fix: Unloads editor-related assets in the block-based widget editor to prevent error notice.
  • Fix: Adjusts spacing for the pattern preview.

For Twenty Twenty-Two theme:

  • Fix: Adds font preset for Extra Extra Large size.

For Twenty Twenty theme:

  • Fix: Restores the content width inside the Gutenberg block editor.
  • Fix: Restores layout and color for the privacy page (fixes the latest theme’s update).

1.4

Release date: March 11, 2022

Twentig 1.4 brings powerful features to supercharge Twenty Twenty-Two, the new default WordPress theme, and all block themes. Build a beautiful website with advanced style options, enhanced Gutenberg blocks, block patterns, and more.

This release adds support for the Twenty Twenty-Two theme and all block themes:

  • New: Adds style options (Google Fonts for Font family settings, Heading font family, Content width, Wide width).
  • New: Adds settings to Theme blocks (Navigation, Post Excerpt, Post Featured Image, Archive Title, Post Date, Post Author).
  • New: Adds Headers, Footers, and Query patterns.
  • New: Makes Twentig patterns compatible with block themes.

For the Gutenberg block editor:

  • New: Adds Shape setting to the Image block.
  • New: Adds Hard shadow style for Group, Columns, Media & Text, Image, and Cover blocks.
  • New: Adds Responsive visibility settings to Gutenberg blocks.
  • New: Moves Twentig page layouts inside the block inserter.

For Twenty Twenty-One theme:

  • Fix: Restores the style inside the pattern preview.
  • Enhancement: Update block patterns to match the latest versions of core blocks.

For Twenty Twenty theme:

  • Fix: Restores the style inside the pattern preview.
  • Enhancement: Update block patterns to match the latest versions of core blocks.
  • Fix: Restores the outline button border.

See changelog for all versions.