The WordPress coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. development team builds WordPress! Follow this site for general updates, status reports, and the occasional code debate. There’s lots of ways to contribute:
Found a bugbugA 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.?Create a ticket in our bug tracker.
Preliminary Roadmap, a quick overview of the main areas and features currently underway for 5.9 in GutenbergGutenbergThe 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/.
Gutenberg 11.5.0
Gutenberg 11.5.0 was released on 16th September, this update includes BlockBlockBlock 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. Gap support, improved support for Flex Layouts, performance improvements, and additional design tools. Check out the release post for a complete list of features and enhancements:
Monthly Plan
The monthly update containing the high-level items that Gutenberg contributors are focusing on for June are:
Template Editor
Patterns
Global Styles and theme.jsonJSONJSON, 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.UIUIUser interface
Work is still progressing on migrating the navigation editor fully over to the REST APIREST APIThe 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/.. The REST API changes have been merged, and now the front end code is being updated.
Lots of UI changes this week with the editor top bar being updated, the main block inserter added, and fixes to the block’s styles.
Also in general, we’re always looking for contributors to help work on the Nav Editor and bloc, if you’re interested please head over to the #feature-navigation-block-editor Slack channel. Look forward to seeing you there.
As a nice side-effect, we might get a simple APIAPIAn 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. for saving changes in any editor that acts on entities through blocks (e.g. the widgets editor).
Inline preview support for Instagram, Vimeo. Now supporting all 5 most-used providers (YouTube, Twitter, WordPress, Instagram, Vimeo).
Fixes
Refresh embed preview when switching light/dark mode
Use device’s localeLocaleA locale is a combination of language and regional dialect. Usually locales correspond to countries, as is the case with Portuguese (Portugal) and Portuguese (Brazil). Other examples of locales include Canadian English and U.S. English. in embed previews
Ensure inserter button is in view when RTL
Translate column block’s control labels
In Progress
Embed block.
GSS Font size, line height, colors.
Task Coordination
Note: Anyone reading this summary outside of the meeting, please drop a comment in the post summary, if you can/want to help with something.
Simple PR’s to get the ball rolling as long as one is approved I guess we can merge multiple similar ones.
Worked on implement the new custom gradient picker design.
Currently working on the new color palette editor.
For the next week I will continue with improving the global styles related components.
Will see how can I best help the effort of implementing the new sidebarSidebarA 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. with its navigation system.
Will try to dedicate attention to old PR’s I have that are mostly ready.
Mosaic view and block awareness of global styles I hope to merge them so my head becomes free for other challenges and we can submit follow ups on them.
Some further planning for the Typography Panel features in Global Styles, which will use the same ToolsPanel component recently introduced alongside the new Dimensions Panel.
Mainly have been doing some light triagetriageThe act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors., amplifying the current block theme switching exploration.
Working on updating the Gutenberg pluginPluginA 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 description (PR coming).
Hoping to ship an additional coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. editor improvement post too in the next week.
Adding Global Inserter to Navigation Editor screen.
Experimenting with Theme JSON as means to control many aspect of Navigation block.
Fixes from the High priority section of Nav Editor tracking issue.
Various Link UI issues.
Added “help” descriptions for the various HTMLHTMLHyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. element options on the Group block.
Working on how to make the Nav Editor more resilient to changes in the Navigation block. Currently it’s very difficult and not at all resilient.
One route I’m exploring is using Theme JSON to control the features of the Nav block. My proposal does two things that I’d like some input on:1. opens up `theme.json` for extensibility by developers via hooksHooksIn 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./filters.
Allows `theme.json` to control features that are unique to particular blocks (as opposed to things that are common across all blocks such as spacing).
I’d really like to understand whether this is within the intended scope for Theme JSON.
This has large utility outside Nav Editor because I imagine Themers wanting to be able to control multiple facets of blocks (and not just common things such as padding/margin…etc) without having to use complex hooks/filters
It’s been two weeks since 11.4, so it’s time for another GutenbergGutenbergThe 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.5!
This update includes BlockBlockBlock 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. Gap support, improved support for Flex Layouts, performance improvements, and additional design tools.
Theme / Block Gap Support
Block Gap support adds the ability for blocks to opt-in to a control that allows users to choose the distance between items within a block.
With Block Gap support in place, it has also been added to the Columns, Title, and Navigation blocks.
Buttons in the the Buttons Block move closer together or farther apart as the Block Gap is changed.
Flex Layout Highlights
Following the introduction of Flex Layout in 11.2.0, now Flex Layouts are supported within the Social Links and Group blocks! The Social Links block now has a ‘flex’ justification option, for automatic best-fit.
There is also a new variation of the Group block that allows for flex layout. You can try it out by choosing “Row” from the block inserter.
Social Icons change flow when flex justification is selected.
Site Title and Logo Inside Navigation Block
It’s now possible to build your site logo or title directly into menus, enabling new design possibilities! Insert, and modify the title or logo that you prefer, using design tools, then re-order for your ideal look.
A Site Logo is added to a Navigation Block, then resized and placed.
Global Styles
Global styles are now available to themes by default, allowing block, theme, and patterns to have a reliable set of styles provided by coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress..
Themes are now able to selectively disable text and background colors. This allows theme authors to provide exactly the experience they’d like to provide users, whether allowing custom colors, gradients, or only their curated selections.
Other Notable Highlights
The Heading Levels menu has been redesigned, and is now vertical, making it easier to visualize the hierarchy.
New vertical Heading Levels menu, with H2 selected.
11.5.0
Features
Design Tools
Block Support: Add gap block support feature. (33991)
Enhancements
AccessibilityAccessibilityAccessibility (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)
Media Placeholder: Change media URLURLA specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org input type to allow a local URL path. (29138)
Block Library
Columns Block: Use blockGap between Columns blocks. (34456)
Query Pagination Next/Previous: Add an arrow attribute and sync next/previous block’s arrow. (33656)
Site Logo Block: Update block description to be concise. (34471)
Site Title Block: Update block description to be concise. (34475)
Social Links Block: Use the new flex layout. (34493)
Video Block: Use existing video poster image on insert. (34415)
Components
MenuItem: Add right padding for unchecked radio and checkbox items. (34406)
ToggleGroupControl: Update stories to use knobs. (34497)
Core Data
Add isRawAttribute to entity configuration. (34388)
Design Tools
Add wide alignment control only if theme provides layout.wideSize. (34586)
Update justification control in flex layout. (34651)
ToolsPanel: Change icon from horizontal to vertical ellipsis. (34369)
Full Site Editing
Limit FSE adminadmin(and super admin) notices to the Themes screen. (34353)
Global Styles
Allow disabling text and background color via theme.json. (34420)
Make global styles available to all themes. (34334)
i18ni18nInternationalization, 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.
Add context to ‘none’ strings for better translations. (34341)
Make permalinks documentation URL translatable. (34282)
Add default editor styles applied to themes without theme.json and without editor styles. (34439)
Widgets Editor
Add ‘WidgetWidgetA 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. Group’ block to widgets screens. (34484)
Allow themes with theme.json to opt-out of block gap styles. (34491)
Bug Fixes
Accessibility
Fix button block focus trap after a URL has been added. (34314)
Block Editor
Fix menu item padding regressionregressionA software bug that breaks or degrades something that previously worked. Regressions are often treated as critical bugs or blockers. Recent regressions may be given higher priorities. A "3.6 regression" would be a bug in 3.6 that worked as intended in 3.5.. (34435)
Heading Block, Paragraph Block: Fix long strings of text without spaces overflow the block. (34222)
Gallery Block: Fix bugbugA 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. with stalled upload when image size too large. (34371)
Gallery Block: Fix media placeholder height in site editor. (34629)
Gallery Block: Fix problem with overflowing captions on new gallery block format. (34402)
Latest Posts: Fix various ReactReactReact is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. warnings in development log. (34428)
Border Controls: Display color indicator and check selected color. (34467)
Border Support: Fix check for displaying border support panel. (34516)
Gap block support: Force gap change to cause the block to re-render (fix Safari issue). (34567)
Letter Spacing: Group letter spacing correctly under typography supports. (34515)
Global Styles
Fix block-level global styles color panels. (34293)
Font Appearance Control: Fix error in global styles for Site Title in TT1-Blocks. (34520)
MetaMetaMeta 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
Change default value of enableCustomFields to undefined. (33931)
Fix metaboxMetaboxA post metabox is a draggable box shown on the post editing screen. Its purpose is to allow the user to select or enter information in addition to the main post content. This information should be related to the post in some way. reordering. (30617)
Packages
Blocks: Register block when invalidinvalidA 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. value provided for the icon. (34350)
Core Data: Add ‘include’ to the query key. (34583)
Core Data: Use resolveSelect instead of select in saveEntityRecord. (34584)
Interface: Block Toolbar & Popover component – Prevent sticky position from causing permanently obscured areas of the selected block. (33981)
Scripts: Only use svgr/webpack in js files. (34394)
Scripts: Convert legacy entry point arguments for compatibility with webpack 5. (34264)
REST APIREST APIThe 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/.
Default batch processor: Respect the batch endpoint’s maxItems. (34280)
Widgets Editor
Fix Block Settings sidebarSidebarA 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. unexpectedly collapsing. (34543)
Legacy widget’s preview functionality is broken when the page is moved. (34384)
Prevent focus trap in Legacy Widget block’s preview iframeiframeiFrame 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.. (33614)
Performance
Block Editor
Improve the getBlock and getBlocks performance. (34241)
Rich Text: Replace global event handlers with local ones. (34492)
Rich text (core): OnFocus method can be replaced with HTMLElement.focus. (32054)
Use Setting: Consolidate the PATHS_WITH_MERGE constant to one instance. (34407)
Block Library
Gallery Block: Add docblockdocblock(phpdoc, xref, inline docs) comments to the new gallery hooksHooksIn 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.. (34562)
Gallery Block: Remove IE specific CSSCSSCascading Style Sheets. hacks. (34372)
Button Block: Replace global shortcut event handlers with local ones. (34498)
Navigation Block: Refactor to use generic classnames. (34171)
Navigation Link Block: Replace global shortcut event handlers with local ones. (34500)
Fix linting error in trunktrunkA directory in Subversion containing the latest development code in preparation for the next major release cycle. If you are running "trunk", then you are on the latest revision.. (34464)
Linting: Remove global event listener warning. (34528)
More work on the stability of the performance metrics. (34229)
PluginPluginA 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
Added janw-me to the Codeowners for the PHPPHPThe web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher FSE folder. (32990)
Jest Preset: Restore the default setting for the verbose option. (34327)
Make Test_Widget compatible with WP_Widget. (34355)
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.
Version
Loading Time
KeyPress Event (typing)
Gutenberg 11.5
6.71s
40.42ms
Gutenberg 11.4
6.80s
44.79ms
WordPress 5.8
7.53s
50.72ms
Kudos to all the contributors that helped with the release! 👏
Thanks to @beafialho and @joen for the release post assets, @priethor for coordination and review, @youknowriad for release and tools wrangling, @mamaduka for answers and help throughout, and @talldanwp for inviting me to shadow a release in preparation.
This status update contains the high-level items that GutenbergGutenbergThe 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/ contributors are focusing onin preparation for the WordPress 5.9 Go/No Go that builds on the focus areas for 5.9 and the current Site Editing Scope. Please join us in our efforts and let us know in the comments if anything is blocking you from doing so.
The Template Editor is the editing mode that allows you to create, assign, and edit blockBlockBlock 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. templates to posts and pages. There are different editors that leverage this editing mode, such as the Template Editor inside the Post Editor or the Site Editor available in the Gutenberg pluginPluginA 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. Current focuses include:
With the initial rollout of the new directory in WordPress 5.8, there’s a growing need to expand the inserter integration to accommodate broader categories of patterns and the experience of browsing them:
Global Styles and theme.jsonJSONJSON, 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.UIUIUser interface
WordPress 5.8 introduced the scaffolding necessary for themes to control 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 themers to build with these style properties directly in the editor and when allowed, users to interact with these style properties.
Design tools encompass all tools related to the appearance of blocks and it ranges from colors, typography, alignments, and positioning, to filters like duotone, cropping, and background media creation of shared tools and its consistent application across blocks:
With the help of the Navigation block, editing a site’s navigation menuNavigation MenuA theme feature introduced with Version 3.0. WordPress includes an easy to use mechanism for giving various control options to get users to click from one place to another on a site. will be possible with a block interface and within a stand-alone block editor. This will allow users to edit not only the menu’s structure but also its design directly in context and without the need for previewing. The main current focuses in this project are:
#feature-navigation-block-editor in WordPress.orgWordPress.orgThe 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/SlackSlackSlack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/.
Navigation Editor
The Navigation Editor aims to help expand what’s possible with menus while bringing block functionality to yet another part of WordPress while offering a more modern experience. Current efforts include:
Allow theme.json to control the Navigation block within the Navigation Editor, allowing the ability to filterFilterFilters 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. the Navigation block’s settings when it is being used inside the Navigation Editor.
WordCampWordCampWordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. US 2021:
WordCamp US 2021 is scheduled for October 1st, 2021 as an online event. Tickets are free and available here!
If you would like to see a design exploration on the Inspector SidebarSidebarA 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., take a look at this post exploring ways to improve the Document Status and Visibility sections.
Ways to Get Involved
While the above items are our focuses, don’t forget that you can always help with triage, testing issues, good first issues, and reviewing PRs. In particular, if you’re interested in helping with triagetriageThe act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. but don’t know where to start, there’s a course on Learn WordPress for how to do triage in GitHub! Check it out and join us.
If there’s anything we can do to make contributing easier, let us know in the comments or in #core-editor chats. While we can’t promise to fix everything, we’d appreciate being aware of any blockers.
CoreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. Editor weekly Wednesdays @ 14:00 UTC in #core-editor focused on all things Gutenberg.
Block Themes meeting twice monthly on Wednesday @ 16:00 UTC in #themereview focused on preparing for Full Site Editing.
Depending on where you live, it’s the first day of Spring. Or Autumn. Or, if you live on Venus, just another season of sulphuric acid showers.
No matter where you are, GutenbergGutenbergThe 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/ 11.4 has been released with new features to brighten your mood including the refactored Gallery BlockBlockBlock 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., duotone filters for featured images, and more block design tools!
Gallery Block now uses Image Blocks
The Gallery Block now acts as a wrapper for coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. Image Blocks.
Individual gallery images will therefore feature all existing and future functionality of not only Image Blocks – for example, the ability to add custom links, filters, and styles – but also standard block behavior such as move, drag and drop, copy, and keyboard navigation.
For now, the new Gallery Block can be enabled on the Gutenberg Experiment page, but the plan is for the Gallery Block to ship with WordPress 5.9.
Theme and pluginPluginA 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 authors can get wise about backward compatibility recommendations over in the Gallery Block Refactor Dev Note.
Duotone filters for featured images
Duotone filters were introduced to image and cover blocks in 10.6. By extending duotone filters to Post Featured ImageFeatured imageA 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, 11.4 enables us to set consistent effects across post and page templates, recent posts lists, and Query Block content.
Padding support for Button Blocks
As of 11.4, we can define padding for Button Blocks with the further option of linking padding values to vertical and horizontal axial sides.
The aim is to provide greater control as well as uniformity in the way we display button elements. We can still set a single padding value for all sides – adding extra vertical or horizontal padding just gives us that extra flexibility to create variations on our design patterns.
Support for block gap spacing
Having a consistent way to tweak the margin/gap between blocks has been a long-standing feature requestfeature requestA feature request should generally begin the process in the ideas forum, on a mailing list, as a plugin, or brought to the attention of the core team, such as through scope meetings held for each major release. Unsolicited tickets of this variety are typically, therefore, discouraged.. 11.4 introduces the groundwork for adding gap spacing control to blocks such as Buttons, Images, and Columns, opening up the possibility of more powerful and precise layout tools.
There’s work in progress to bring this to the editor so stay tuned for updates in upcoming releases!
Other notable highlights
Font weight support is now available for the Post Date and Post Terms Blocks.
An “early betaBetaA pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process.” feature has also made it into 11.4: the ability to expose a parent block’s toolbar controls to its child blocks. A use case would be changing the alignment of Buttons when editing a single Button. Keep an eye out for a request for feedback on this developing feature soon.
11.4.0
Enhancements
AccessibilityAccessibilityAccessibility (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)
Cover Block: Allow alt text in Cover blocks. (33226)
Add aria-describedby to custom select control component to describe currently-selected font size. (33941)
Block Editor
Block Lists: improve iframeiframeiFrame 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. block, pattern and template previews. (28165)
Block Library
Query LoopLoopThe 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.: update Post Template sub-block icon. (34204)
Convert Gallery block to use Image blocks. (25940)
Post Featured Image: add duotone block supports. (34113)
Post Featured Image: add contextual help text to the scaleproperty. (34158)
File block: update transform from image to use image filename if caption is empty. (34256)
Post date Block: add font weight support to the block. (34070)
Post terms: add font weight support to the block. (34142)
Button: update spacing support to use axial padding. (33859)
Components
Add deprecated props adapter for ColorPicker. (34014)
Wrap SegmentedControl in a BaseControl with an added help property. (34017)
Combobox: update the current selection if the list of suggestions is filtered. (33928)
Post Title: use rich text hook and updating tagtagA directory in Subversion. WordPress uses tags to store a single snapshot of a version (3.6, 3.6.1, etc.), the common convention of tags in version control systems. (Not to be confused with post tags.) to h1 (31569)
Design Tools
Add layout default value support for blocks. (34194)
Dimensions Panel: add padding tool as default for blocks where this is a common setting. (34026)
Updates the “settings” icon, which toggles the display of additional controls in an interface. (34165)
Post Editor
Migrate post editor feature preferences to the interface package. (34154)
Widgets Editor
Migrate customize widgets feature preferences to interface package. (34135)
Refactor editor ‘feature’ preferences to interface package. (33774)
Bug Fixes
Block APIAPIAn 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.
Spacing/Dimensions Supports: separate spacing from dimensions for compatibility purposes. (34059)
Block Editor
Font-size adjustment for tablet and mobile device previews. (33342)
Fix single block selection by holding shift key. (34137)
Fix unwanted additional spaces added around pasted text on Windows. (33607)
Inserter: prevent non-deterministic order of inserter items. (34078)
Try: Fix multiselect toolbar indent and reformat BlockContextualToolbar(). (34038) (34173)
Block Library
Latest Comments: use site localeLocaleA locale is a combination of language and regional dialect. Usually locales correspond to countries, as is the case with Portuguese (Portugal) and Portuguese (Brazil). Other examples of locales include Canadian English and U.S. English. in the editor. (33944)
Navigation: fix vertical layout on the frontend. (34226)
Navigation: add z-index value to responsive menu overlay. (34228)
Navigation: enable flex on container to fix space between. (34258)
Post ExcerptExcerptAn excerpt is the description of the blog post or page that will by default show on the blog archive page, in search results (SERPs), and on social media. With an SEO plugin, the excerpt may also be in that plugin’s metabox.: remove interactive formatting. (34083)
RichText: fix space key for button and summary elements. (30244)
Search Block: add space between generated border class names. (34025)
Build Tooling
Webpack: Fix watch on .json and .php files. (34024)
Pin TypeScript dependency to a specific version to avoid pulling in breaking changes. (34422)
Block Editor: use groups for InspectorControls. (34069)
Block Library
Add generic classnames to children of Navigation. (33918)
Global Styles
Add slashes back to the Theme JSONJSONJSON, 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.. (33919)
Add block spacing gap configuration to theme.json and add support for this CSS variable to the “flow/default” layout. (33812)
Unit Control: add unit tests for getValidParsedUnit utility method. (34029)
Rename SegmentedControl to ToggleGroupControl. (34111)
Dropdown Menu: remove min-width from the dropdown component and add whitespace rule to avoid wrapping (33995)
Core Data
Allow passing store definitions to controls. (34170)
Site Editor
Remove extra DOM element used for template part overlay. (34012)
Tools
Build Tooling
Automated Changelog: force group all documentation tasks under Documentation. (34042)
Automated Changelog: rename “Editor” grouping to “Post Editor” to avoid ambiguity with other editors. (34093)
Automated Changelog: sort feature groups by issue name. (34071)
Automated Changelog: use nested headings for feature groups instead of indenting lists. (34040)
Automated Changelog: remove UncategorizedheaderHeaderThe 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. in output and place items at top. (34037)
Add Typescript extensions to watched files. (34094)
Remove obsolete step that pushes tags in NPM publishing flow. (34114)
Release workflow: only commit modified changelogs. (34211)
ESLint
Eslint plugin: use @typescript-eslint/no-duplicate-imports in TS projects. (34055)
GitHubGitHubGitHub 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
Issue Forms: simplify the bugbugA 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. report form template. (34007)
Logs
Hide deprecation logs under a console group. (34163)
Testing
Emulate reduced-motion in end-to-end tests. (34132)
Remove extra props from Cover deprecations. (34066)
Remove the ENVIRONMENT_DIRECTORY env variable that was added to the performance jobs. (34086)
Add snapshot test for changelog formatting. (34049)
Experiment with using REST APIREST APIThe 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/. in end-to-end tests to build up states. (33414)
Performance benchmark
Version
Loading Time
KeyPress Event (typing)
Gutenberg 11.4
6.35s
36.87ms
Gutenberg 11.3
6.29s
36.97ms
WordPress 5.8
6.91s
35.48ms
Thanks to @critterverse for our release preview assets, @priethor for guiding the release, @noisysocks, @talldanwp, and @andrewserong for their help with the release build and deployDeployLaunching code from a local development environment to the production web server, so that it's available to visitors., and to all who contributed to this release. Thank you for your splendid work!
GutenbergGutenbergThe 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/pluginPluginA 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 releases
BlockBlockBlock 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. inserter performance improvements
Dimension controls for Featured ImageFeatured imageA 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
A proposal of an API to make blocks aware of their global styles. This APIAPIAn 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. will allow the UIUIUser interface of a block to show their true styles by default.
Navigation Block & Navigation Editor
The team have been focused on reforming the project around the goal of removing the “experimental” status of the feature within the Gutenberg Plugin (only).
Responding to Full Site Editing (FSE) feedback, testing FSE items, and helping amplify various efforts.
Working on a coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. editor improvement post about featured image block improvements.
Friendly reminder from Dave to add the most appropriate labels to PRs in GitHubGitHubGitHub 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/, whether you’re submitting PRs or helping with triagetriageThe act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors.. All efforts there make work easier for the release leadRelease LeadThe community member ultimately responsible for the Release..
It would be very helpful for us who run the Core Editor Meetings to have tracking issues that are updated once a week, so we can share the project updates during the meeting. As it will also give a nice overview and it would make it easier for anyone to follow along to see the progress over time.
If you have ever added a custom link to an image blockBlockBlock 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. and then tried to do the same on a Gallery image, you will understand the frustration and confusion of not having consistency between different types of image blocks. This inconsistency is because the coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. Gallery block stores the details of the included images as nested <img> elements within the block content. Therefore, the images within a gallery look and behave different from images within an individual image block. There are some long-standing open issues related to this:
The only way to fix this with the Gallery block in its current state is to try and replicate the additional functionality that the Image block has in the Gallery block, and vice versa. While this would be possible, it would lead to an additional maintenance overhead to keep the UIUIUser interface and underlying code in sync between the two blocks.
Changes made
To make the behavior of images consistent between the Image Block and Gallery, while avoiding code duplication, the core Gallery block has been refactored to save the individual images as nested core Image blocks using the standard core innerBlocks APIs. To make this work with the innerBlocksAPIAPIAn 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., the gallery structure also had to change from an ordered list to a collection of figure elements within a figure. This structure change also brings the core Gallery block into line with the W3C WAI guidelines on the grouping of images.
The structure change means that Gallery images now have the ability to add custom links, or custom styles, for each image. An example of the flexible Gallery layouts this opens up can be seen below.
Gallery images will also automatically inherit new functionality that is added to the Image block, including those added by plugins. Below is an example of a Gallery block making us of the Image wave style and vintage filterFilterFilters 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. option added by the CoBlocks pluginPluginA 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.
Other benefits include being able to use the standard move, drag and drop, copy, duplicate, and remove block functionalities. Keyboard navigation also benefits from the adoption of the standard block model by the Gallery block.
What theme and plugin authors need to do before 5.9
To support the new Gallery block format, plugin and theme authors should aim to do the following before the December release of this change in WordPress 5.9.
Any gallery related CSSCSSCascading Style Sheets. should have additional selectors added to target images in the following structure in both the editor and front end (existing selectors must remain to support the existing gallery block content). The new structure can be seen below. See this issue for an example of the type of additional selectors that may need to be added.
For custom blocks with options to transform->from and transform->to the core Gallery block the plugin should be tested with the GutenbergGutenbergThe 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/ plugin to ensure that these transformations work correctly with both existing gallery content and the new gallery block format
In the future, when the new Gallery format is stable in a core release, the transformation filters will be deprecated, and plugin authors will need to update their transformations to handle both Gallery formats. Notice will be given ahead of this change being made.
It is also expected that existing gallery content will be automatically migrated to the new format. This will allow the old gallery version’s code to be removed from the codebase. There is currently no time frame set for this to occur.
Additional context and considerations
Other existing solutions
Third-party block developers are currently solving some of the problems caused by the limitations of the core Gallery block by implementing their custom Gallery blocks. These include some of the missing functionality, like the ability to add custom links to individual images. This can be problematic for site owners and content editors due to a large number of Gallery blocks that offer very similar functionality, but none of which appear to provide a close match to the functionality available with individual core Image blocks.
There do not appear to be any examples of plugins that already solve this problem in a way that utilizes Image blocks as inner blocks.
Backwards compatibility considerations
This is a breaking change due to the fundamental change in the underlying Gallery structure. Due to the large number of Gallery blocks already in use, along with themes and plugins that may rely on the existing structure, the following steps have been taken to mitigate the impact of this change on theme and plugin developers as much as possible:
Initially, there will be no automatic migrationMigrationMoving the code, database and media files for a website site from one server to another. Most typically done when changing hosting companies. of existing gallery content. This means that all existing gallery content will behave the same in the editor and front end as it does now, so will be compatible with existing plugins and themes. Only new gallery blocks added after this change will have the new structure in the editor and the front-end.
The refactored Gallery format has been tested against the following sample block libraries that have existing transforms to and from the core Gallery block:
While the refactored gallery works effectively with these plugins and themes, there may be edge cases in other plugins and themes that have not been accounted for. Themes that heavily modify the gallery CSS based on the existing <ul><li></li></ul> will definitely need to be updated if the same style changes need to be applied to the new gallery format. Therefore, it is recommended that theme and plugin authors test the changed gallery block well in advance of the 5.9 release.
Topic: comparing and contrasting the classic menu screen with the experimental blockBlockBlock 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 navigation screen.
Goal: derive a list of tasks that are required in order for the two screens to have feature parity (from both UXUXUser experience and UIUIUser interface perspectives).
Intended Audience: past and future contributors to the navigation editor and block. Contributors to other related parts of WordPress.
Note Taker: any volunteers to be the official note keeper?
Preparation:
Please could participants test drive the old and new screens. Try creating the same menus on both screens.
Then come prepared with features they feel are missing from the block-based Navigation screen that are present in the classic Menu screen, or any bugs encountered.
Agenda
Introduction
Facilitator introductions.
Welcome to attendees.
Recap hangout topic and goal.
Terminology – block-based vs classic Navigation screens.
Format
Explain the format.
Facilitator will share screen to demonstrate which parts of the experience are being discussed.
Questions to consider about the new screen:
Where is it lacking polish?
What bugs are in evidence?
What steps are harder to achieve?
What steps are not possible to achieve?
What steps are easier to achieve?
What features are entirely missing?
Summary
Brief summary of key discussion points from notetaker.
Summary of action points including Issues to be created or further explorations required.
Two weeks have passed since 11.2, so here we are again for a new GutenbergGutenbergThe 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 BlockBlockBlock 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 imageA 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 LoopLoopThe 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.
Post Featured Image: Add basic dimension controls. (31634)
Template Part: Try new icons for reusable blocks and template parts. (34002)
Block Patterns
Add translationtranslationThe process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. context on titles. (33734)
Update snackbar to use framer motion instead of reactReactReact is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. spring. (33717)
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 APIThe 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 URLURLA 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)
Template Mode: Add busy state to template creation modal. (33076)
Widgets Editor
Add error boundaries to widgetWidgetA 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
AccessibilityAccessibilityAccessibility (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)
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 APIAPIAn 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 UIUIUser 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 PHPPHPThe 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)
MetaMetaMeta 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)
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 filterFilterFilters 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 invalidinvalidA 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.htmlHTMLHyperText 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: Broken link in documentation to block support mechanism. (33780)
Update documentation to reflect new automated process for feature grouping. (33573)
link fix: Block editor SidebarSidebarA 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)
Use the __unsafe_useEmotionCache in the useCx hook. (33982)
CoreCoreCore 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 hooksHooksIn 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)
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 customizerCustomizerTool 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 JSJSJavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. assets PluginPluginA 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: Add missing fallback for target in webpack 5 configuration. (34112)
ESLint
Include .jsx extenstion when linting import statements. (33746)
GitHubGitHubGitHub 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 bugbugA 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)
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.
Version
Loading Time
KeyPress Event (typing)
Gutenberg 11.3
7.23s
38.57ms
Gutenberg 11.2
7.82s
37.89ms
WordPress 5.8
7.99s
41.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!
This is a quick overview of the main areas and features currently underway for 5.9 in GutenbergGutenbergThe 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
One of the biggest points of friction for pattern and theme builders are the lack of responsive tools available at a blockBlockBlock 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
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.jsonJSONJSON, 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..
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 CSSCSSCascading 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
The effort to bring better and more consistent design tools continues to progress. These tools need to integrate smoothly with both the block APIAPIAn 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, accessibilityAccessibilityAccessibility (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
A large percentage of the infrastructure and features needed to build block themes are established. The UXUXUser 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 widgetWidgetA 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” categoryCategoryThe 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging..
@jorgefilipecosta congratulated all the people that contribute to the WordPress 5.8 release. Adding that it was a big release that changed multiple things in the coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress., added part of the FSE engine, implemented blockBlockBlock 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. widgets between other big additions.
One thing I didn’t share on my comment there is that we’ve been on a feature release work for a long time. I’d love if we can focus more on quality related work (polish/performance…). For instance if you worked on a feature on previous releases, what can you do today to make it better in terms of code, performance and maintenability.
What’s new in GutenbergGutenbergThe 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/ 11.2.0
@jorgefilipecosta announced that Gutenberg 11.2 was released before the chat, and asked people to report any regressionregressionA software bug that breaks or degrades something that previously worked. Regressions are often treated as critical bugs or blockers. Recent regressions may be given higher priorities. A "3.6 regression" would be a bug in 3.6 that worked as intended in 3.5. found in their tests or if the update did not work as expected.
Project updates
Site Editor
@jorgefilipecosta submitted a PR that proposes a mosaic view one of the goals for July & August. The PE contains most of the functionality proposed in the mockups but not all of it because the PR was already huge. The PR also implemented the logic for an editor modes functionality that will be used to add the code editor in edit site very useful for example to full site editing theme developers.
Navigation block
@mkaz shared that, the Navigation Block is in a good state, still iterating but the next big step is a call for testing in the next week. And asked people to keep an eye out at #fse-outreach-experiment or the make.wordpress.org/test site. The team will collect feedback from that call to define what areas need focus, improving, and further iteration.
Navigation
some exploration is happening around configuring the navigation block in the editor via theme.json , feedback is great at this early stage
“New block” block picker badge for 50% of users to measure performance.
Setting the featured imageFeatured imageA 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. via the Image block directly.
Fixed a crash in the column block, and an issue with the “More” menu in the UBE.
In progress
Updated the Mobile Gallery Block Refactor (PR) with the changes from Web and merged it.
Block Picker Search, Embed block, editor onboarding help section, GSS Font size, line height, colors.
Is working on performance work. Has a PR improving inserter search performance. Is also iterating on some layout-related additions. Like the block gap support. Reviewing the PRs that he can help with.
Looks forward to getting back to polishing and improving the navigation block, list view, and a ton of other cool things, perhaps even a little framer animation! Is also going to land github.com/WordPress/gutenberg/pull/32659 one of these days, and follow up with what that will mean for the Gallery block.
Finished working on adding support for variations in block.json file to WordPress core: As part of the efforts the same patchpatchA special text file that describes changes to code, by identifying the files and lines which are added, removed, and altered. It may also be referred to as a diff. A patch can be applied to a codebase for testing. proposes a unified way to apply translations to block.jsonJSONJSON, 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. and theme.json.
Propose a follow up PR with the remaining mosaic functionality.
Propose a PR with the code editor view on the site editor.
Investigate and improve the performance of the site editor.
Submit some site editor bugbugA 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. fixes and code quality/APIAPIAn 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. improvements.
Review the locking improvement proposal.
Open floor
Alignments in the shortcodeShortcodeA shortcode is a placeholder used within a WordPress post, page, or widget to insert a form or function generated by a plugin in a specific location on your site. block
Adding that he is hoping that we can improve the shortcode block, as it is very limited in functionality.
@jorgefilipecosta said that for this use case the shortcode should be nested inside a group block.
@paaljoachim added that the shortcode is not working well inside the group block and as a follow up is going to open an issue so the team can investigate this further. The issue was created after the chat.
Wassim Boussebha new contributor presentation
Wassim Boussebha introduced himself to the participants of the chat:
I am Wassim Boussebha 18 years old, computer science student in first year , I am interested to contribute to gutenberg project and be one of the maintainers in the future, currently I am learning computer science basics and foundations including algorithms, computer operating systems,databases….
Adding that he would like to know what is the specific tech stack that would allow him to contribute and work on this project and if it would be possible to provide some orientation.
@jorgefilipecosta thanked Wassim Boussebha for the interest in contributing. And together with @paaljoachim shared links to some tutorials, explained the tech stack, and referred what could be the first issues Wassim can work on. @jorgefilipecosta added that the team is available on slack to help with any blocking points while trying to contribute.
You must be logged in to post a comment.