Block Themes Meeting Notes for 16 December 2020

Channel: #themereview

Facilitated by @kjellr

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/ + Themes Highlights

  • WordPress 5.6 was released last week.
  • HeaderHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. blocks will soon have a font-weight setting
  • We want to load the Site Editor in an iFrame to give us a clean slate for styles in the front and back end.
  • Custom units are now an option for the spacing control.

There are more Gutenberg updates in the latest Gutenberg + Themes post.

Twenty Twenty-One (TT1) Blocks

Work is accelerating on the new 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. version of TwentyTwentyOne. This is centered around this project board.

The aim of this project is to reevaluate all of the Block specific CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site. in TwentyTwenty one and determine if it’s still needed, and if it is, whether to move to Gutenberg; make it configurable via Global Styles, or add it to TT1 Blocks.

In many cases this is resulting in new issues and PRs in Gutenberg. We are keeping track of these on the board. Cards that are blocked by a Gutenberg issue should be moved to “Blocked” until the Gutenberg issue is fixed. This will give us a comprehensive list of all the issues we need to fix to get TT1 Blocks launched.

With the FSE Outreach Program starting up again soon, we’d like to add TT1 Blocks to the Theme Repository to make it easier for users to test Full Site Editing. We’ll use the name TT1 Blocks to ensure that users don’t get confused with the default theme TwentyTwentyOne.

Requirements for Block Themes

There was some discussion about the requirements for full site editing themes. The following changes were proposed:

  • Make the 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. file a requirement
  • Remove the requirement for specific php templates (e.g. header.php)

We need to ensure that the block markup in a theme submission is valid. Exactly how we go about this is something which still needs exploring.

Block-based Themes Meeting Agenda: December 16

Below is the agenda for this week’s Block-based Themes meeting.

Time: Wednesday, December 16, 2020, 10:00 AM EST
Channel: #themereview

Agenda

  • 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 updates in 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/
  • Check in & discussion about the Block-based Twenty Twenty-One Theme
  • Discuss requirements for full site editing themes
  • Open Floor / Q&A

Please comment if you have any other topics you’d like to see discussed!

+make.wordpress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org//coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.#agenda #meeting

Discussion: Requirements for full site editing themes

As explorations of the minimum viable full site editing theme continues and the outreach program is starting, it is time to have a first discussion about requirements for 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. themes in the theme directory.

Having basic requirements is one of the steps needed for us to be able to open up theme submissions:

  1. Requirements
  2. Update the Theme Check pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party to allow full site editing themes
  3. Strengthen reviewer knowledge
  4. Activate 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/ on the theme previewer -Completed

These are discussions points and not a complete proposal.

You can compare the items below with the current requirements.

New code requirements:

Valid 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. markup: There must be no block validation errors on theme switch.

For this requirement, we need to research if it is possible to validate the block markup automatically.

Minimum required files:

  • style.css
  • readme.txt
  • functions.php
  • index.htmlHTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites. (placed inside the block-templates folder)
  • Temporary: Comments.php is required as without it, a PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. http://php.net/manual/en/intro-whatis.php. warning is shown.

    A 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. (or experimental-theme.json) file is recommended.

Requirements that may need to be adjusted:

Plugins: Themes are allowed to require Gutenberg as long as Gutenberg is needed to enable full site editing.

Options and Settings
Theme options may only be included as:

  • Theme_support
  • Global style settings
  • Block patterns
  • Block variations
  • Block styles

Items under this requirement that become irrelevant or confusing because blocks are used instead of PHP functions:

  • Use the CustomizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings. for implementing theme options
  • Save options in a single array
  • Don’t use transients for things they shouldn’t be used for, like storing theme options
  • Use sane defaults and don’t write default setting values to the database

Presentation vs Functionality: Images that are not plain placeholder images and essential for the design are allowed.

Items under this requirement that become irrelevant or confusing because blocks are used instead of PHP functions:

  • The theme options should not be pseudo custom post types and save non-trivial user data
  • Non-design related functionality is not allowed

CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Functionality and Features

Items under this requirement that become irrelevant or confusing because blocks are used instead of PHP functions:

If incorporated, features must support the WordPress functionality:  

  • Sidebars
  • Navigation Menus
  • Post Thumbnails
  • Custom Headers
  • Custom Backgrounds
  • Editor Style
  • Logo

Use template tags properly

Include comments.php (via comments_template())

Requirements that remain the same:

  • Licensing
  • AccessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) (temporary exception for skip to content link)
  • Readme file
  • Importing or downloading
  • Documentation
  • Naming
  • Screenshot
  • Image guidelines (exception for placeholder images that are essential for the design)
  • Stylesheets and Scripts
  • Privacy
  • Selling, credits, and links
  • Child themes

Requirements that it is not currently possible to follow:

Language / translation ready


Request for feedback

  • Which of the current requirements are relevant for full site editing themes?
  • What new full site editing specific requirements needs to be added?
  • How do we best present the requirements for full site editing themes?
    • On a separate page
    • In a separate section of the current requirements page
    • Other, describe your suggestion in the comment

#full-site-editing, #guidelines, #themes

Gutenberg + Themes: Week of Dec 7, 2020

Hello! This is the 31st weekly roundup of theme-related discussions, fixes, and developments in 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/

Please weigh in on the tickets below — your voice and feedback are welcome! 

Issues / Discussions:

  • Blocks: Headings 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.: add support for font weight. 27639
  • Blocks: Allow paragraphs to use CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site. columns. 27118
  • Blocks: Revisit appender margins. 27392
  • Blocks: Add custom units to box control. 27626
  • 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.: Semantic Template Parts 27337
  • FSE: Load content in an iFrameiframe iFrame is an acronym for an inline frame. An iFrame is used inside a webpage to load another HTML document and render it. This HTML document may also contain JavaScript and/or CSS which is loaded at the time when iframe tag is parsed by the user’s browser.. 25775
  • FSE: Provide a CSS reset. 27116
  • FSE: Allow responsive styles in 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.. 27107
  • FSE: Try adding support for child themes: 27305
  • FSE Blocks: Support wide/full alignments for the Query block container. 27589
  • FSE Blocks: Allow Post Featured ImageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. blocks to have a consistent height. 27620
  • FSE Blocks: Add comment form block styles. 27673
  • Global Styles: Change the behaviour of the reset button 27483
  • Global Styles: Allow making text flushed left or justified 27300
  • Global styles: Add a global spacing variable 27315

Merged/fixed:

  • Blocks: Scope image block style variations to only the image block. 27649
  • FSE Blocks: Site Logo: Remove line height rule. 27623
  • FSE Blocks: Site Logo: Add rounded block style. 27621
  • FSE Blocks: Query block: Adjust mobile margins. 27619 
  • FSE Blocks: Query block: Allow inheriting the global query arguments 27128
  • FSE Docs: Update documentation to show how a theme can have FSE automatically enabled. 27680

Overview Issues:

  • Full Site Editing Milestones. 24551
  • Template Tags in Full Site Editing. 22724 
  • Missing query block functionality. 24934
  • Query and LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. block tracking: 24762

General Resources:

Thanks to @joen and @scruffian for help pulling this post together. Please let us know if it was helpful in the comments!

#gutenberg-themes-roundup

Meeting notes for December 8

Our agenda for this meeting can be found here:
https://make.wordpress.org/themes/2020/12/06/themes-team-meeting-agenda-for-december-8/

Weekly updates:

In the past 7 days,

  • – 237 tickets were opened
  • – 242 tickets were closed:
  • – 220 tickets were made live.
  • – 13 new Themes were made live.
  • – 207 Theme updates were made live.
  • – 4 more were approved but are waiting to be made live.
  • – 22 tickets were not-approved.
  • – 0 tickets were closed-newer-version-uploaded.

Resolution process for issues found in live themes

During the meeting there was a short summary of the main points of the proposal. The full proposal can be read here: https://make.wordpress.org/themes/2020/11/19/feedback-requested-resolution-process-for-issues-found-in-live-themes/

It was requested that we include a clarification for when a theme is suspended temporarily, and when a theme is suspended permanently.

The request for feedback was open between November 19 and December 7. During this time, there was one comment asking if the consequences were strict or severe enough, but no suggestion for how the process could be improved was included.

Based on the result of the discussion we will continue with implementing the proposal.

The next step is to publish a page with all the information about the resolution process.

Open floor

A reminder to all theme authors to test their themes with WordPress version 5.6, and to test their older themes for any compatibility problems related to the jQuery change.

#meeting-notes, #themes-team