Justin Tadlock · May 13, 2020 · 57 Comments

yH5BAEAAAAALAAAAAABAAEAAAIBRAA7 Where Gutenberg Went Wrong: Theme Developer Edition design tips block-themes-640x360 Where Gutenberg Went Wrong: Theme Developer Edition design tips Themes with block editor styles on WordPress.org.

With full-site editing just around the bend, it is a fair question to ask whether the WordPress ecosystem is prepared for such a transition, particularly on the theme development side of things.

It is no secret that theme developers have struggled to keep up with the barrage of changes between Gutenberg plugin updates and, ultimately, major WordPress versions. It is also a fair question to ask who is steering the ship. Where are the site developers, theme authors, and other designers who spend every day crafting the front end of the web? Where are the forward-thinking solutions that make sure the project maintains backward compatibility?

There have been some efforts to mend the broken divide between the Gutenberg project and theme developers such as the fortnightly block-based themes meetings. However, those meetings, by and large, are general updates on things the Gutenberg team has already developed or will ship soon. Those meetings are a good stepping stone toward better communication, but the project needs a project planner with both the vision of the future landscape and a sense of the day-to-day issues that theme authors contend with.

The reality is that there are only 132 themes out of 7,455 that list block editor styles as a feature in the official repository. We are a year and a half into the lifespan of the block editor officially merging into WordPress, yet the face of the platform is made up mostly of themes that have shoehorned some basic block styles into mediocre designs. The themes that truly stand out with full block-editor support are few and far between. Many of those are also bidding heavily on Elementor or other page builders.

Whether you like the block editor is of little consequence when there is no buy-in from theme authors. Every week, I check the theme directory for new themes, hoping to find a hidden gem. Every week, I am disappointed to see new themes dropping in 2020 with no support for the block editor. There is an entire segment of users who might enjoy the editor if only they had something more than Twenty Twenty to play around with — it is a fine theme but is not everyone’s cup of tea.

yH5BAEAAAAALAAAAAABAAEAAAIBRAA7 Where Gutenberg Went Wrong: Theme Developer Edition design tips themeforest-block-themes-768x559 Where Gutenberg Went Wrong: Theme Developer Edition design tips ThemeForest’s listing of block-styled themes.

ThemeForest sellers are besting free WordPress.org theme authors 18 to 1 in terms of support with over 2,300 themes listed as Gutenberg-optimized. Granted, themes from the massive marketplace are known to have every feature they can in an attempt to one-up the competition. Also, many of them either have built-in page builders or support third-party solutions.

Still, for the flagship feature of the platform, end-users should expect something more from the official theme directory. A third-party marketplace should not be the only game in town. At the moment, much of the offerings on WordPress.org feel lackluster at best. The handful that go the extra mile, such as the Rosa 2 and Go themes, have mature businesses funding the effort.

There is some broken trust between theme authors and WordPress at the moment. Some shout it loudly (as folks can attest from WP Tavern comments section). Others are more quietly trying to figure all this out.

Even Carolina Nymark, one of the representatives for the official Themes Team, shared some concern. “How do all of you theme authors keep up with the changes to Gutenberg?” she asked in a tweet. When the team leads are not up to speed, it is not good for the project as a whole.

“I don’t,” replied Anders Norén, the primary developer behind Twenty Twenty, to Nymark’s question. “I wait until something breaks (in the beta releases) and try to fix it then. Trying to support changes in the Gutenberg plugin while maintaining support for the block editor in Core is bad for your health.”

There is a major concern from theme authors about the future. It is hard to get excited about the current possibilities when there is uncertainty over what theme development will look like in 12 months. There is no clear and detailed roadmap about how things will work, and many theme designers feel like they are playing catchup from week to week. Instead, they should be able to more clearly look ahead and push early ideas into play.

My ultimate fear is that the Themes Team will one day flip the switch and require all themes going into the directory to support the block editor like it had to do with the customizer in 2015. If theme authors do not organically make the transition such a day may come. The team will be stuck as the bad guys in the middle.

It is easy to identify some of the major pain points for theme authors. Changes between updates will inevitably break something with the theme design.

Breaking HTML changes.

Breaking CSS changes.

Missing class names.

Different methods of handling alignment, depending on the block.

Dealing with inline styles after years of being taught to avoid them.

All of these issues are roadblocks for theme authors. And, when things get in the way of theme authors doing their jobs, they trickle down to end-users.

This is not the WordPress of the last decade. The WordPress that promised to not break things with updates. The WordPress where a one-off theme by a non-professional designer still worked four months later.

The Gutenberg project is still in its infancy. It can be fun to play with, but it can also be messy. I am as much of an evangelist for the block editor as anyone, but I can recognize when there is a clear and present issue of trust between theme authors and the developers of the project.

Currently, theme authors who are attempting to cover all of their bases are designing for at least a couple of versions of WordPress, multiple versions of Gutenberg, and the classic editor plugin. It is a dizzying array of testing for one theme. Those with a dozen or more themes…well, it is not an ideal situation.

A holistic approach needs to be taken toward theme and site design. Theme authors need to see the details of the roadmap and contribute to it, carving the features they see as relevant into stone for the coming years. They need to know that the buttons block design they sweated over for hours this past week will continue working next week.

It all starts at the project management level.

If a breaking HTML change needs to happen, theme authors need more than, “X change needs to happen for Y feature to work.” They need to see ownership of the mistake in the initial planning phase for X, backward-compatible code solutions, and a path toward fewer of the same mistakes happening.

Theme designers still need some sort of design framework. The current utility classes are like a poor man’s version of Tailwind that is being pieced together as the project adds new features without the foresight to look at the future landscape. Maybe the upcoming Global Styles feature can tackle that on a larger scale that provides compatibility across themes.

Ultimately, there needs to be more communication between the Gutenberg team and theme authors who are building themes for the official WordPress theme directory. Perhaps there should even be a new team or sub-team formed focused solely on theming in the block era and working directly with Gutenberg developers to identify pain points. Whatever happens, someone needs to inspire the next generation of themes into being. Until then, most theme authors are stuck wondering what they will need to fix next.

Up next: block/plugin development edition?

Posted in Opinion, Themes

Tagged gutenberg