Gutenberg Hub Launches a Block-Based WordPress Theme Directory – WP Tavern


Within the daybreak of the block theme period, the WordPress theme listing might use a reimagining. That’s what Munir Kamal got down to do earlier than WordPress 5.9 launches later this month. He announced an alternative theme directory on the Gutenberg Hub web site earlier at the moment. It lists all of the block themes which can be formally hosted on WordPress.org.

Screenshot of the Gutenberg Hub theme directory, which lists theme screenshots in a three-column grid.
Gutenberg Hub’s theme listing.

The interface and expertise are much like the official theme listing and for a very good cause. Kamal is pushing for adjustments on WordPress.org.

“I seen the shortage of information the official theme listing supplies,” he mentioned. “I need to provoke a dialogue round this to repair it, and thus created this as an idea/experiment. Now that it’s an period of the brand new technology of WP themes (Block Themes), the themes listing must be reimagined. Block themes are all about colours, typography, block kinds, patterns, and templates. As a WP consumer, I want to see all that information associated to a theme after I discover themes within the listing. I would like to decide on with out putting in and testing a number of themes.”

Single theme pages on this reimagined listing embody extra information than the official listing. As an alternative of merely a screenshot and outline, every web page shows the theme’s shade palette, supplies typography examples and information, and previews a number of content material blocks.

Screenshot of the Octane WordPress theme page on Gutenberg Hub. Includes theme description, screenshot, colors, and typography sections.
Octane theme web page.

One factor that makes trendy themes distinctive is their included theme.json file. This file permits theme authors to register settings and add kinds that work in each the editor and the front-end. This degree of standardization didn’t exist till WordPress 5.8 rolled round final 12 months.

It additionally permits builders like Kamal to construct new instruments on prime of it. When practically all the info associated to a theme is in an ordinary format, it’s straightforward to tug out and experiment with it.

For instance, as a result of there’s a particular key within the theme.json file for colours, anybody can seize and show them by way of code. Gutenberg Hub’s listing shows these as a palette alongside every theme. Customers may even click on to repeat them.

Homepage of the Gutenberg Hub theme directory. Mouse cursor is hovering a specific color from a theme's palette. It's hex code appears in a tooltip.
Copying a theme shade.

This could have been virtually not possible up to now as a result of WordPress didn’t have a approach for themes to outline one thing so simple as a shade palette.

The listing additionally auto-generates social photos for every of the themes. The next for Mebae and Pacer each present their description, fonts, colours, and screenshot.

For years, WordPress.org theme previews have been stricken by sub-par demo system. In the present day, the stay demo can present starter content material if a theme supplies it. Nevertheless, there isn’t a present FSE assist for the function. Gutenberg Hub shows the identical stay preview as proven within the official listing.

Kamal has partially addressed this concern by including a “Content material” button. Clicking it permits customers to see dozens of blocks in motion.

Preview/demo of the Tove theme with faux content. The content displays 1-6 headers, a horizontal rule, and paragraph.
Tove theme content material preview.

This supplies a basic overview of what the theme seems like, however the preview expertise continues to be missing. A handful of featured photos would add some visible oomph to the house/weblog and archive pages.

Kamal has plans to include theme templates and patterns into the preview sooner or later. These additions would make theme demos extra helpful.

He doesn’t plan on stopping there. “Different plans embody offering a brilliant helpful search and filter performance that makes it simpler to trim down the end result to the closest wants of a consumer,” he mentioned. “And possibly a comparability instrument {that a} consumer can use to match two themes side-by-side with sensible components to determine between the 2, reasonably than opinions, downloads, and so forth.”

The work Kamal has put in to date seems promising. There may be nonetheless a lot that might be improved if we had a whole group effort behind this. With the block theming function launching with WordPress 5.9, there isn’t a cause to stay to the previous theme preview system when a lot extra is feasible.


If I had one additional want for Gutenberg Hub or WordPress.org, it could be for all baby themes to be listed on their mum or dad theme’s web page. However, I’ll take this redesigned listing first.


Leave a Reply

Your email address will not be published.