What’s new in Gutenberg 11.3? (18 August)

Two weeks have passed since 11.2, so here we are again for a new 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/ release, 11.3.0. This update includes inserter performance improvements, new controls for 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. Dimensions, and some enhancements around how we handle Featured Post Images.

New Dimensions Panel

Replacing the Spacing Panel, this new Dimensions Panel gives us a deeper control over supported spacing, size, and other related style options. It also offers the ability to customize what you’d like to have shown. This is a great addition that builds on the overall dimension controls work across blocks.

Block inserter performance improvements

The block inserter is getting a big performance boost! Enjoy searching and inserting blocks with speed and ease.

Dimension controls for 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. Block

There are now new height, width, and scale controls for the featured image block, bringing it into greater parity with the Image block. This change impacts the Query 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 in a big way by allowing even more layout options.

New icons for Reusable Blocks and Template Parts

New icons are now available for Reusable Block and Template Parts to make them each more recognizable and more intuitive to interact with.

11.3.0

Enhancements

  • Block Library
    • Button: Add padding block support. (31774)
    • Post Featured Image: Add basic dimension controls. (31634)
    • Template Part: Try new icons for reusable blocks and template parts. (34002)
  • Block Patterns
    • Add translationtranslation The process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. context on titles. (33734)
  • Block Editor
    • Enable rich previews for internal links. (33086)
  • Components
    • Add new ColorPicker. (33714)
    • Promote ItemGroup. (33701)
    • Polish the focus style for the segmented control. (33842)
    • Tune appender margin. (33866)
    • Update snackbar to use framer motion instead of reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. spring. (33717)
    • Use updated range styles. (33824)
  • CSSCSS Cascading Style Sheets. & Styling
    • Reduce specificity of reset & classic styles. (32659)
  • Document Settings
    • Disable spellcheck and autocomplete in permalink slug field. (33708)
  • Global Styles
    • Dimensions Panel: Add new ToolsPanel component and update spacing supports. (32392)
  • REST APIREST API The REST API is an acronym for the RESTful Application Program Interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data. It is how the front end of an application (think “phone app” or “website”) can communicate with the data store (think “database” or “file system”) https://developer.wordpress.org/rest-api/.
    • Improve the likelihood of getting rich link previews by modifying UA string for URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org Details REST API endpoint. (33747)
  • Site Editor
    • Add error boundary. (33921)
  • Template Editor
    • Template Mode: Add busy state to template creation modal. (33076)
  • Widgets Editor
    • Add error boundaries to widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. screens. (33771)

Bug Fixes

  • 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)
    • Fix some JAWS bugs. (33627)
  • Block Library
    • Button: Fix justification for button block when selected. (33739)
    • Image: Fix issue with canInsertCover not being set to false for empty arrays. (33863)
    • Query Pagination Numbers: Fix first page’s link. (33629)
  • Block APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways.
    • Dimensions Support: Switch dimensions block support back to using spacing key. (34030)
  • Block Editor
    • Closing the block inserter decrements block type impressions. (33906)
    • Fix block appender position in classic themes. (33895)
    • Fix positioning discrepancy with draggable chip. (33893)
    • Force link text to wrap in the Link UIUI User interface when encountering extra long link text. (33753)
    • Improve display of LinkURL menu and fix spacing. (33652)
    • Only show rich preview for image and description if data is available. (33660)
    • URL Details: Avoid PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher notice when parsing protocol-relative icon URLs. (33779)
  • Components
    • useBreakpointIndex: Attach resize event listener to window instead of document. (33902)
    • Components: Fix RTL on custom gradient picker. (33831)
    • FontSizePicker: Use number values when the initial value is a number. (33679)
    • FormTokenField: Avoid error when maxLength value is hit. (33623)
  • CSS & Styling
    • Fix navigation block placeholder preview markup. (33963)
  • Global Styles
    • Avoid rendering duplicate elements stylesheet. (33680)
    • Fix presets for blocks with multiple selectors. (33951)
    • Fix Global Styles transient key clash. (33844)
  • MetaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. Boxes
    • Fix Safari 13 metaboxes from overlapping the content. (33817)
  • Navigation Editor
    • Avoid React warning when creating a new menu. (33843)
    • Fix regressed menu selection dropdown placeholder value for Nav Editor menu locations UI. (33748)
  • Site Editor
    • Fix the site editor breaking in firefox. (33896)
  • Post Editor
    • Editor: Safer isPreviewingPost check. (33840)
  • Template Editor
    • Only show post template actions to users with correct capabilities. (33392)

Performance

  • Block Library
    • Improve the rendering/update performance of the image block. (33974)
    • Do not add to the block-library CSS bundle the colors that come from theme.json. (33924)
  • Block Editor
    • Lazy render the inserter search results. (33868)
    • Lazy render block types in the inserter. (33749)
  • Parsing
    • Improve the performance of the parser by removing the automatic custom classnames handling. (33903)
  • Post Editor
    • Refactor the HierarchicalTermSelector so that it does not cause unnecessary loading of terms. (33418)
  • Template Editor
    • Template Mode: Remove ‘per_page’ argument from the template data selector. (33742)

Experiments

  • Full Site Editing
    • Site Editor: Implement a settings object filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output.. (33737)
    • Template part selection popover – minor style updates for visiblity. (33733)
    • Template Part placeholder – Add title step to creation flow. (33703)
  • Navigation Block
    • Navigation: Fix navigation block appender invalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid. htmlHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers.. (33964)
    • Enable the ability to remove a link from the Nav Link block in the Nav Block. (33777)
    • Fix navigation margin collapsing. (33021)

Documentation

  • Handbook
    • Add documentation to disable remote calls for block patterns. (33930)
    • Add missing comma. (33764)
    • Add more details about block attributes. (33880)
    • Add spaces in add_theme_support documentation code. (33796)
    • Correct spelling and grammar in documentation. (33860)
    • fix: supports.color.gradients is plural. (33781)
    • fix: Broken link in documentation to block support mechanism. (33780)
    • Update documentation to reflect new automated process for feature grouping. (33573)
    • link fix: Block editor SidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. Tutorial. (33308)
  • Library
    • Fix gutenberg_resolve_template() return documentation. (33800)
    • Fix misspelling of “queries” in filter documentation. (33799)
  • Packages
    • Example for rest_endpoints filter in PHP. (33738)

Code Quality

  • Block Library
    • Site Logo: Use getMedia shorthand. (33992)
    • Featured Image: Use getMedia shorthand. (33943)
    • Search Block: Removed components class from icon button and polished css. (33961)
  • Components
    • Components utils: rtl() return type, rtl.watch() utility. (33882)
    • InputControl to TypeScript. (33696)
    • Use the __unsafe_useEmotionCache in the useCx hook. (33982)
  • CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Data
    • Deprecate getAuthors in favor of getUsers. (33725)
  • Global Styles
    • No longer read from experimental-theme.json. (33904)
    • Remove the experimental prefix and rename theme.json files. (33925)
  • Post Editor
    • Refactor MetaBoxesArea to to functional components using hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same.. (30542)
  • Scripts
    • Fix typo in format change message. (33945)

Tools

  • Testing
    • Add search performance measures and make other measures more stable. (33848)
    • Avoid double parsing the content when loading the editor. (33727)
    • Block Hierarchy Navigation waits for the column to be highlighted. (33721)
    • Widgets Editor: Try to fix flaky 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. inspector test. (33890, 33965)
  • Build Tooling
    • Readable JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. assets 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: Fix webpack 5 support. (33785)
    • Scripts: Use cssnano to minimize CSS files with build. (33750)
    • Scripts: Webpack configuration update to minimize CSS. (33676)
    • Scripts: Update webpack to v5 (try 2). (33818)
    • Scripts: Add missing fallback for target in webpack 5 configuration. (34112)
  • ESLint
    • Include .jsx extenstion when linting import statements. (33746)
  • 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/ Contributor Templates
    • Update bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. issue template to use forms. (33713, 33786, 33761)
  • Plugin
    • Plugin: Fix jsdoc/check-line-alignment ESLint warnings. (33901)
    • Correct function_exists() check typo introduced in #33331. (33513)

Performance Benchmark

The following benchmark compares performance for a particularly sizeable post (~36,000 words, ~1,000 blocks) over the last releases. Such a large post isn’t representative of the average editing experience but is adequate for spotting variations in performance.

VersionLoading TimeKeyPress Event (typing)
Gutenberg 11.37.23s38.57ms
Gutenberg 11.27.82s37.89ms
WordPress 5.87.99s41.44ms

Kudos to all the contributors that helped with the release! 👏

Thanks to @javiarce for our preview assets, @cbringmann and @mkaz for proof reading this post, @annezazu‘s great copy edits, @priethor for shepherding the process along so helpfully, @youknowriad for helping 🧑‍🚒 with the release, and everybody else who contributed to this release for your wonderful work!

#block-editor, #core-editor, #gutenberg, #gutenberg-new

CSS Chat Summary: 12 August 2021

The meeting took place here on Slack. @notlaura facilitated and @danfarrow wrote up these notes.

CSSCSS Cascading Style Sheets. Custom Properties (#49930)

   --wp-admin--theme--primary--step-10: #1a5686;
   --wp-admin--theme--notification: #d63638;
   --wp-admin--theme--notification--contrast: #fff;
   --wp-admin--theme--success: #00a32a;
   --wp-admin--theme--info: #72aee6;
   --wp-admin--theme--warning: #dba617;
   --wp-admin--theme--error: var(--wp-admin--theme--notification);
  • @robertg asked a question about where new custom properties should be defined. @ryelle answered that they should be in custom-properties.css, in the body selector so that they can be overridden by colour themes later

How should box-shadows be handled?

Working time

  • @notlaura started the 20 minute session where contributors can work on the project while having help available in the 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
  • @robertg asked if the :hover and :focus pseudo-classes should have separate custom-properties. @ryelle answered that one custom-property can be defined for --hover and also used for :focus
  • @wazeter asked about the timeline. @notlaura replied that for the 5.9 release we would be aiming for the end of August. @ryelle clarified that this is the target for “early“ consideration. We’ll know the target for the completed project when the real cutoff has been announced but she expects it to be around early-mid October
  • @notlaura added that next week’s meeting (August 18) is the last scheduled week for working time
  • @wazeter asked where questions about quirks should be addressed. @notlaura replied post in the #core-css channel or comment in the PR
  • @robertg asked if we are just targetting color, background-color, and border-colors for now. @notlaura added box-shadow, noting that this will need some additional discussion

CSS Link Share / Open Floor

Thanks everyone!

#summary

Editor Chat Agenda: 18 August 2021

Facilitator and notetaker: @itsjusteileen

This is the agenda for the weekly editor chat scheduled for Wednesday, August 18, 2021, 04:00 PM GMT+1.

This meeting is held in the #core-editor channel in the Making WordPress 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/..

  • Gutenberg 11.3.0 RC.
  • Whats next in Gutenberg: July and August.
  • Updates based on updated scope for site editing projects and WP 5.8:
    • 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 WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. Editor.
    • Navigation Block & Navigation Editor.
    • Template editor.
    • Patterns.
    • Styling.
    • Mobile Team.
  • Task Coordination.
  • Open Floor.

If you are not able to attend the meeting, you are encouraged to share anything relevant for the discussion:

  • If you have anything to share for the Task Coordination section, please leave it as a comment on this post.
  • If you have anything to propose for the agenda or other specific items related to those listed above, please leave a comment below.

#agenda, #core-editor, #core-editor-agenda, #meeting

Dev Chat Agenda for August 18, 2021

Here is the agenda for this week’s developer meeting to occur at August 18, 2021, at 20:00 UTC.

Blogblog (versus network, site) Post Highlights

Bringing to your attention some interesting reads and some call for feedback and/or volunteers

Components check-in and status updates

  • Check-in with each component for status updates.
  • Poll for components that need assistance.

Open Floor

Do you have something to propose for the agenda, or a specific item relevant to the usual agenda items above?

Please leave a comment, and say whether or not you’ll be in the chat, so the group can either give you the floor or bring up your topic for you accordingly.

This meeting happens in the #core channel. To join the meeting, you’ll need an account on the Making WordPress Slack.

#agenda, #core, #dev-chat

CSS Chat Agenda: August 19, 2021

The next weekly CSSCSS Cascading Style Sheets. meeting is Thursday, August 19 at 21:00PM UTC in the #core-css channel in Making WordPress Slack.

CSS Custom Properties (#49930)

Focused on substituting existing colors throughout CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. stylesheets, the CSS Custom Properties project aims to make working with Adminadmin (and super admin) Themes & Admin Color Schemes easier and more reliable both in Core and Plugins.

The #core-css team is looking for contributors interested in adopting a stylesheet (a process outlined here).

No prior contributing experience is required — we’re happy to assist anyone who would like to participate!

Meeting Agenda

  • Welcome (21:00PM UTC)
  • Announcements & Housekeeping
  • CSS Custom Properties (#49930)
    • Overview
    • How to Get Involved
    • Status Check-In & Blockers
  • Open Floor
  • Working & Collaboration Time
  • Huddle Up & Closing Discussion (21:50PM UTC)
  • CSS Link Share (Bring neat examples & helpful tools!)

#agenda

Upgrade/Install Meeting Notes, August 17

On August 17, the Upgrade/Install component met to discuss the proof of concept that builds on the rollback update failure 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 prepare it to merge in CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. Slack logs.

In the post and during the meetings a number of concerns and potential improvements were mentioned, so here are the next steps:

  1. @aristath will write steps for manual testing, in time for the next Test scrub (Friday, August 20) ✅ Instructions in the Pull Request
  2. @francina will liaise with the Test Team and Hosting Team (aka cross post 😇) so the PR can be tested ✅
  3. @sergeybiryukov will do the code review once there is a good amount* of testing.

The conversation led to other two topics

  1. Unit tests for the updater classes. They don’t exist. Should they exist? Yes. But it’s a big task and it needs a dedicated initiative. Let’s take one step at a time.
  2. #51928 is independent from the auto-updates/failures/rollback items, but closely related. As @pbironmentioned, failure data can give information about areas in the updater that could use more error checking/recovery logic, etc. The results are anonymous and seen only by the .org system folks.

If you have input on any of the above, please leave a comment – here or on the relevant PR/Tickets.

Thanks!

#core-auto-updates, #updater, #upgrade-install

X-post: FSE Program Theme Design Survey Results

X-comment from +make.wordpress.org/test: Comment on FSE Program Theme Design Survey Results

A Week in Core – August 16, 2021

Welcome back to a new issue of Week in CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. Let’s take a look at what changed on TracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. between August 9 and August 16, 2021.

  • 33 commits
  • 31 contributors
  • 43 tickets created
  • 5 tickets reopened
  • 37 tickets closed

Pending the appointment of the WordPress 5.9 team, a number of tickets have been fixed, waiting for the next minor releaseMinor Release A set of releases or versions having the same minor version number may be collectively referred to as .x , for example version 5.2.x to refer to versions 5.2, 5.2.1, 5.2.3, and all other versions in the 5.2 (five dot two) branch of that software. Minor Releases often make improvements to existing features and functionality.(s).

Ticketticket Created for both bug reports and feature development on the bug tracker. numbers are based on the Trac timeline for the period above. The following is a summary of commits, organized by component and/or focus.

Code changes

Build/Test Tools

  • Add schema reference to PHPUnit config files – #53363
  • Declare two TestCase classes as abstract – #53363
  • Enable running the tests on PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher 8.1 – #53891, #53635
  • Hard deprecate WP_UnitTestCase_Base::checkRequirements()#46149
  • Hard deprecate WP_UnitTestCase_Base::checkRequirements()#46149
  • Make the polyfills loading more flexible – #46149
  • Remove Unicode character from PHPUnit version check message – #53363
  • Revert [51602] for now to investigate test failures on PHPUnit < 7.0 – #46149
  • Simplify the PHPUnit test workflow – #53891
  • Add unit tests for the wp_nonce_ays() function – #53882
  • Fix failing i18ni18n Internationalization, or the act of writing and preparing code to be fully translatable into other languages. Also see localization. Often written with a lowercase i so it is not confused with a lowercase L or the numeral 1. Often an acquired skill. unit tests for 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. metadata – Follow up for #53238
  • Rename classes in phpunit/tests/formatting/ per the naming conventions – #53363
  • Use correct comparison in do_enclose() tests – #53635

Code Modernization

  • Check the return type of _get_cron_array() in wp_schedule_event()#53635
  • Check the return type of parse_url() in WP::parse_request()#53635
  • Correct handling of null in wp_parse_str()#53635
  • Rename the readonly() function to wp_readonly()#53858
  • Replace strftime() and gmstrftime() usage in unit tests – #53897
  • Silence the deprecation warning for missing return type in phpunit/tests/compat.php#53635

Documentation

  • Add a @see reference to the wp_mail_content_type filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. in wp_staticize_emoji_for_email()#53399
  • Add a @see reference to the xmlrpc_enabled filter in wp_xmlrpc_server::set_is_enabled()#53399
  • Correct @since version for the wp_parse_str filter – #53399
  • Fix typo in the get_block_editor_settings() description – #53922
  • Improve documentation for a few functions per the documentation standards – #53399
  • Synchronize documentation for wp_get_attachment_image_attributes filter callbacks in bundled themes – #53878

Editor

  • Preserve the original template keys when preparing a list of page templates – #53898
  • Add support for variations in block.json file – #53238

General

  • Restore (un-deprecate) the sanitize_url() function – #53876

Themes

  • Make sure the theme APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. response is not an error before operating on it in themes_api()#53913
  • Twenty Seventeen: Add support for wa.me links in Social Links menu – #51946
  • Twenty Twenty: Add support for wa.me links in Social menu – #50542

Upgrade/Install

  • Update sodium_compat to v1.17.0 – #53907
  • Use consistent capitalization for “web host” in setup messages – #53926

Props

Thanks to the 31 people who contributed to WordPress Core on Trac last week: @jrf (17), @SergeyBiryukov (7), @swissspidy (4), @hellofromTonya (4), @pbearne (3), @sabernhardt (3), @mukesh27 (3), @lucatume (2), @Ipstenu (1), @thomasplevy (1), @Toro_Unit (1), @aadilali (1), @Mamaduka (1), @jorgefilipecosta (1), @youknowriad (1), @ayeshrajans (1), @haosun (1), @jeherve (1), @desrosj (1), @schlessera (1), @gwwar (1), @pierlo (1), @ankitmaru (1), @bradparbs (1), @tmatsuur (1), @dkarfa (1), @carepsules (1), @macmanx (1), @pedromendonca (1), @iluy (1), and @knutsp (1).

Congrats and welcome to our 3 new contributors of the week! @aadilali, @carepsules, and @iluy ♥️

Core committers: @sergeybiryukov (31), and @gziolo (2).

#5-8-1, #5-9, #core, #week-in-core

Upgrade/Install component meeting agenda for August 17, 2021

The next meeting is scheduled on Tuesday, August 17, 2021, at 17:00 UTC and will take place on #core-auto-updates 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 aim of the chat is to check the status of the rollback for failed plugin/theme updates and decide if it is ready for a merge proposal.

Got something to propose for the agenda? Please leave a comment below.

#core-auto-updates, #updater, #upgrade-install

Preliminary Road to 5.9

This is a quick overview of the main areas and features currently underway for 5.9 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/. Some are in more advanced stages than others, but together they paint a picture of what we are looking forwards to.

To dive deeper into concrete tasks and areas of work, this tracking issue is the best place to follow.

Blocks + intrinsic web design

Collection of various patterns displayed at mobile resolutions.
  • One of the biggest points of friction for pattern and theme builders are the lack of responsive tools available at a 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. level. This needs to be solved in a way that doesn’t disproportionally increase interface complexity.
  • The block model is a good case to apply some intrinsic design principles, since a block can occupy a place in many different layouts and containers, for which prescriptive media queries that don’t take context into account are inflexible.
  • Each block area should be intrinsically responsive allowing blocks to compose together, wrap, stack, and organize themselves to fit the different spaces and screens. For this to work well, container blocks need to absorb more layout controls. (Container queries might help expand this further in the future.)
  • Typography tools need to become more fluid and internally support algorithmic clamping. Whenever possible, patterns should just work and accommodate themselves.

Patterns

Mosaic galleries showing different design patterns.
  • With the initial rollout of the new directory there’s a growing need to expand the inserter integration to accommodate broader categories of patterns and the experience of browsing them.
  • There’s more work to be done within the setup flow of single and multi-block selections. This also includes improving the mechanisms for transforming to and from patterns, which are still nascent.
  • Creation flows with patterns also need expanding from template parts and blocks to pages and templates.

Navigation Menus

  • The navigation block and navigation screen projects have been underway for quite some time and are a main target for 5.9. With the principal tracking issue about to be completed, a large part of the remaining work is to improve the user experience, reduce complexity, and test as much as possible on themes.

An interface 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..

Global Styles panel showing the main area and the background color section.
  • 5.8 introduced the scaffolding necessary for themes to take the reins over how various aspects of blocks render and how the interface is controlled. The natural next step ahead is to develop the user interface that will allow users to interact with these style properties. This goes by the project name “global styles” and an updated design is currently in prototype stage.
  • It should be appreciated how important it is to leverage the global reach of CSSCSS Cascading Style Sheets. rules as we combine it with the power of blocks. The current structure deals with two large groups of design targets: blocks and elements. Elements represent things that can be styled globally and across blocks (such as “text”, “links”, “captions”, etc).

Design Tools: Colors, Typography, Spacing, Layout

Series of panels showing different configurations of the typography tools.
  • The effort to bring better and more consistent design tools continues to progress. These tools need to integrate smoothly with both the block APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. (through the “supports” mechanism) and theme.json. One of the main goals is consistent access to similar tools across blocks, including third-party ones.
  • Running parallel to this effort comes the work on the WordPress components system, refinements to color tools, interactivity, 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), etc.

Formalize editing flows for block themes

Displays templates as small cards in a mosaic, connecting diagrams with the different flows.
  • A large percentage of the infrastructure and features needed to build block themes are established. The UXUX User experience and design needs the most attention, though, starting by mapping into a clearer information architecture all the possible flows that are to be supported (editing templates, parts, styles, pages, etc).
  • Continue to process and take into the design process all the feedback gathered from users and theme builders.
  • Begin defining transition flows from existing widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. areas to block areas when appropriate, and explore the various aspects of theme switching.
  • Finalize and commit all remaining blocks under the “theme” categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging..

#5-9, #gutenberg