Developing the Full Site Editing version of Twenty Twenty-One

Twenty Twenty-One Blocks is the name of the official Full Site Editing version of the upcoming default theme.

Twenty Twenty-One Blocks is an experimental theme created as an example to highlight what is possible with Full Site Editing.

The theme will need GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ and the Full Site Editing experiment to be enabled. It will not be part of CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress., but once complete it will be available in the theme directory.

During the theme creation process, the goal is also to help identify problems and limitations with Full Site Editing.

It is a unique opportunity to help shape and improve WordPress themes and the theme creation process.

The theme is part of the theme experiments repository on GitHubGitHub GitHub is a website that offers online implementation of git repositories that can can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/.
The development of the theme started this week, and the target release date is December 2020.

Everyone is welcome to contribute to the theme by creating issues or pull requests to the theme experiments repository, and take part in the discussions.

Discussions and bug scrubs for Twenty Twenty-One Blocks will take place during the BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. based theme meetings, twice monthly at Wednesday @ 16:00 UTC in the themereview slackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. channel. The next meeting is scheduled for Nov 4th.

#full-site-editing, #themes

Block-based Theme Meeting Notes 17 June, 2020

This post summarizes the latest bi-weekly BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience.-based Themes meeting (agenda, slack transcript). This meeting was held in the #themereview SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. channel on Wednesday, June 17, 2020, 12:00 PM EDT and was moderated by @jffng.

GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ Update

New Features

Gutenberg 8.3.0 was released last week with a host of new features. Specifically for themes, two new experimental theme supports are available:

  • Cover Blocks experimental padding control. To enable this, themes need to declare add_theme_support( 'experimental-custom-spacing' ) to see the new controls. Documentation is forthcoming for the Theme Developer Handbook.
  • Control link color in the paragraph, heading, group, columns, and media & text blocks. This can potentially override a theme’s hover state, so theme developers may need to find a workaround. This enhancement sets the stage for theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML. to eventually handle link styles. Themes can opt-in by declaring add_theme_support( 'experimental-link-color' ) and get the following additional controls:

Also merged in 8.3 a FSE bug fix solving an issue that occurred when the theme supplied an index.html but no front-page.html, causing the site editor to appear blank. It also creates an index.html so that if the theme has no fallback template.

@aristath’s related utility code in the Theme Experiments repo helps with the opposite side of this problem — installing an experimental FSEFSE Short for Full Site Editing, a project for the Gutenberg plugin and the editor where a full page layout is created using only blocks. theme that doesn’t have Gutenberg installed.

In progress theme-based Gutenberg PRs and Issues

On the global styles / theme.json front, there is an issue that asks if theme presets be expanded to line-height, padding, and margin. Subsequent PRs trying out implementing presets for line-height and padding include PR 23177 and PR 23176. There is discussion around whether these presets should be added via add_theme_support (as they were for link color) or if working via theme.json is all that is needed.

This led to a discussion of the proposed hierarchy/relationship between theme.json and add_theme_support. @richtabor foresees theme.json being the owner of the vast majority of these sorts of design defaults, with add_theme_support as the “in-between” for now, or the logic-based overrides of theme.json. @kjellr, @poena, @aristath disagreed saying experimental-themes.json provided more flexibility for a clean start in FSE so long as it supports the logic provided currently by add_theme_support. An issue is now open in GitHubGitHub GitHub is a website that offers online implementation of git repositories that can can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/ for wider discussion.

Open Floor

@prtksxna asked if themes should register block styles for full-site blocks like site-title or post-title. @acosmin pointed out theme authors can register any block styles but can’t register blocks in themes at the present time.

@poena asked if other FSE users have encountered an issue where changes to html files are not reflected in the site editor and is looking for additional testing.

@jffng reminded the group the #fse-outreach-experiment channel is open in Slack. If you have questions or want to provide feedback, join there.

#meeting-notes, #gutenberg, #full-site-editing, #block-based-themes