Reading view
Gutenberg Changelog #73 – Gutenberg 14.1, next default theme, design Tools in WordPress 6.1
Gutenberg Changelog #72 Gutenberg 13.9, 14.0, WordPress 6.02, Themes and Design Tools
Gutenberg Changelog #71 – Gutenberg 13.8, Fluid Typography, updates to the Block API and more
Gutenberg Changelog #70 – Gutenberg 13.7, Template Creation Enhancements and First Full-Site Editing Themes in Woo Commerce Marketplace
Gutenberg Changelog #69 – Gutenberg Releases, WordPress 6.0.1, the Create Block Theme
Gutenberg Changelog #68 – WordCamp Europe, Gutenberg 13.4 and WordPress 6.1
Gutenberg Changelog #67 Gutenberg 13.2 and 13.3, WordPress 6.0 and more
Gutenberg Changelog #66 – Gutenberg 13.1, New Zealand, InnerBlocks
Gutenberg Changelog #65 – Gutenberg 13.0, WordPress 6.0, Inline Token Proposal and more
Gutenberg Changelog #64 – Gutenberg 12.9, Example Repo, and Inline Tokens
Gutenberg Changelog #63 – Block Pattern Directory, WebFonts API and Gutenberg 12.8
Gutenberg Changelog #62 – Gutenberg 12.7, a New Call for Testing, the Web Fonts API Arrival
Block Theme Building Tips
When building block themes there is often more than one way to achieve the same thing. It’s often not clear which of these options is preferable. Below I outline some tips and guidelines that I find helpful. The guiding principle here is to remove as much complexity as possible from the theme; instead block themes should be using the affordances provided by Gutenberg.
1. Avoid using CSS
As much as possible, block themes should avoid providing CSS. Gutenberg increasingly offers design tools which allow theme builder to control the design of the theme without using CSS. If it is not possible to achieve a particular design without CSS please create an issue for it on Gutenberg so we can consider adding a design tool to achieve the design.
2. Reuse patterns rather than implementing custom templates
As the number of block themes we build grows we will have an ever increasing number of templates and template parts in each theme. In practice there are a small number of patterns which can be reused on many themes. We should be aiming to reuse existing patterns rather than implementing new templates. This means we need clever patterns which are able to reuse settings from theme.json.
3. Prefer theme.json to block settings
Connected to the point above, when we want to change the appearance of a block in a template or a pattern it is usually better to do so in the theme.json file than in the block template. This means that the design will be used for all instances of the block, not just the edited instance. It also keeps templates design agnostic, so that they be reused (see above).
What other tips do you have for building block themes?