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.
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.7 has been released! This release includes a number of nice enhancements and as usual many 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.
Navigation 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 Navigation Editor Advances
The Navigation Block underwent a series of changes intended to provide a more intuitive navigation management experience. New links are now added instantly after clicking the “+” icon without an additional block selection step. There is also an additional new way of adding links: using a slash inserter. It is worth noting that a slash inserter can be enabled for any block using a new, experimental flag called __experimentalSlashInserter. In addition, navigation links may now be transformed into other allowed block types, such as Site Logo, Home Link, or Social Icons. Finally, it’s easier for users to notice linking mistakes thanks to the squiggly line highlighting empty links similarly to grammar errors.
The site editing experience got polished in this recent release. The template part editor gained a convenient back button to ease returning to the site editor. Switching between editing different template parts was made more accessible by listing the available areas in template details. Also, the custom gradient picker was refreshed.
While we’re talking about Duotone, Gutenberg 11.7 enables theme authors to customize the default Duotone 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. using theme.json styles:
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)
Adjust wording for post format suggestions. (14124)
Add a visually hidden label for the Search block. (35034)
Add an accessible label to the Back button in preferences. (35340)
Global Styles: Add accessible label to Back button. (35325)
Template title: Include a button and label text when there is no post/page title. (35148)
Block Editor
Allow other blocks to use the slash inserter. (35196)
Enable ability to create Pages from the inline Link UIUIUser interface. (35083)
Columns block: Enable blockGap and vertical margin support. (34630)
File Block: Only display PDF preview height RangeControl when embed is enabled. (35207)
Navigation: Add transformations from a link to other allowed nav blocks. (34978)
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.: Include a Query Pagination option on the block variations. (35347)
Show “none” as an alignment option and use contextual text to clarify settings. (34710)
Transform Nav Links with children into Submenus. (34831)
Add an option for displaying the label inside the Navigation Link block. (34952)
Add typography settings for the Navigation Link block. (35324)
Add option to remove/clear logo from the Site Logo block. (34820)
CoreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. data
Add ‘context’ to the query parts type definition. (35069)
Components
Add new Navigator components and use them in the global styles 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.. (34904)
Use _builtin property of classes in navigation link PHPPHPThe web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher. (35166)
Item: Remove isAction and use onClick to decide if it should render as button. (35152)
Make tooltip delay configurable with a property. (35246)
Design Tools
Block gap: Only render CSSCSSCascading Style Sheets. variable if corresponding theme setting is enabled. (35209)
Add Padding to the root level of global styles. (35241)
Add duotone 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. styles support. (34667)
Extract the color palette to its own global styles screen. (35109)
Update the rules to hide/show blocks in the global styles sidebar. (35178)
Synchronize user custom post typeCustom Post TypeWordPress can hold and display many different types of content. A single item of such a content is generally called a post, although post is also a specific post type. Custom Post Types gives your site the ability to have templated posts, to simplify the concept. registration and UI visibility. (35427)
Enqueue preset styles for all themes in the editor. (35424)
Fix toggle off for Duotone control and Post Date block’s date picking control. (35024)
useMultiSelection: Avoid crashing editor when block refs aren’t available. (35177)
Rich text: fix internal paste across multiline and single line instances. (35416)
Block Library
Embed: Remove meetupMeetupAll local/regional gatherings that are officially a part of the WordPress world but are not WordCamps are organized through https://www.meetup.com/. A meetup is typically a chance for local WordPress users to get together and share new ideas and seek help from one another. Searching for ‘WordPress’ on meetup.com will help you find options in your area.-com from variations. (35146)
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.: Remove descendent space. (35273)
Fix: Broken disabled select style in the editor area. (35135)
Keyboard shortcut: Prevent post saving through keyboard if post saving locked. (35361)
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/.
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. Fetch: Improve isMediaUploadRequest check. (34417)
Fix slashing when creating or updating a menu item. (35147)
Server Side Render
Prevent empty renders in ServerSideRender component caused by changing props while already fetching markup (35433)
Remove 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. of help link in navigation editor. (35313)
Add a tooltip to Navigation items in a setup state. (35139)
Fix gap 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. in navigation screen. (35234)
Replace tinycolor2 with colord on getMostReadableColor util. Add unit testunit testCode written to test a small piece of code or functionality within a larger application. Everything from themes to WordPress core have a series of unit tests. Also see regression.. (34625)
Fix not archiving failure artifacts for flaky tests. (35379)
Plugins
Add oandregal and tellthemachines to codeowners file. (35233)
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
Time To Render The First Block
KeyPress Event (typing)
Gutenberg 11.7
3.7 s
24.68 ms
Gutenberg 11.6
3.5 s
25.88 ms
WordPress 5.8
4.0 s
34.06 ms
Kudos to all the contributors that helped with the release. 👏
Goal: Discuss Navigation Editor and 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. goals for 5.9 and beyond.
Details: There are some recent proposed changes to the Navigation Editor and Block that would change some aspects of the project. See the post in slack for more information (https://wordpress.slack.com/archives/C01KDAZJMQ9/p1633512526250600). This hallway hangout will be assembled to discuss how the project should proceed.
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.6 has been released! This release includes a number of nice enhancements and as usual many 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.
Site Logo cropping and rotating within the editor
Before Gutenberg 11.6, the image used as the site logo had to be edited before being uploaded to your site. With the goal of providing a wide array of tools to adapt your logo without leaving the editor, it is now possible to crop, zoom, and rotate the image you choose for the site logo directly in the Site Logo 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.’s toolbar!
Locking control at block level
Alongside template level locking, now you can lock individual blocks to prevent moving or removing them; you can do this by adding a lock attribute on the block settings. Block-level lock takes priority over the templateLock feature and currently, you can lock moving and removing blocks.
The toolbar of locked blocks will have the movers hidden, and the Remove block option won’t be available either.
Query Pagination uses Flex Layout
Following previous releases bringing Flex Layouts to blocks, Gutenberg 11.6 improves the Query Pagination block to support the flex layout along with a justification option, for automatic best-fit.
Other Notable Highlights
Regarding Full Site Editing and Global Styles, basic support for child themes has been added. This means the 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. Site Editor is available when the child themeChild themeA Child Theme is a customized theme based upon a Parent Theme. It’s considered best practice to create a child theme if you want to modify the CSS of your theme. https://developer.wordpress.org/themes/advanced-topics/child-themes/. of a block theme is active, and its templates, template parts, 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. are inherited.
The writing flow has also received some enhancements in this release: the Richtext format toolbar now shows a visual clue for hidden active items and, when using the quick inserter and clicking the Browse all button, your current filter value is now passed to the main inserter without the need to type it again, making this switch between inserters seamless.
Template Part Focus Mode refers to the view that lets you focus and work on a single template part, like a headerHeaderThe 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., and is available for any template part. This isolated template part editing is now accessible from the ellipsis menu in the Template Part toolbar. More Template Part Focus Mode improvements are coming soon, so make sure to check its tracking issue here.
11.6
Enhancements
Block Library
Post Title block: Add typography formatting options. (31623)
Cover: Move cover min-height into dimensions panel via SlotFill. (34065)
Group Block: Add information about selected element types for Group Block. (33976)
Image Block: Create two-way data binding for ImageSizeControl. (34649)
Columns Block: Update block description of columns block. (34705)
Gallery block: Add toolbar button to convert old galleries to new format. (34606)
Block Editor
Format toolbar: Visual clue for hidden active items. (21892)
Increase Link UIUIUser interface search results to 10 on the Navigation Editor screen. (34808)
Inserter: Pass 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. value when clicking Browse All. (34912)
Components
ColorPicker: Enhance the new color picker design. (34598)
ColorPicker: Add reset timeout to ColorPicker’s copy functionality. (34601)
Resize Handles: Fix stroke width of resize handles. (34949)
ServerSideRender: Improve ServerSideRender Component to retain preview of the component while it is loading new state. (28289)
ServerSideRender: Delayed loading state of ServerSideRender component. (35033)
Global Styles
Add a simple Global Styles preview to the 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.. (34991)
Update the Global Styles Icon and use it in the site editor’s panel. (34871)
Update the global styles sidebar to use a navigation component. (34885)
Widgets Editor
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: Make title directly editable. (34799)
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.
Introduce lock control at the block-type level. (32457)
Design Tools
InspectorControls: Wrap block support slots in ToolsPanel. (34157)
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)
Improve file block accessibility by adding aria-describedby to download button. (28062)
Button Block: Add prefix to the description ID. (34900)
MediaReplaceFlow: Avoid ReactReactReact is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. warning when selecting media. (34618)
Remove .has-link-color class upon clearing the link color. (34700)
Rich Text: Fix arrow navigation with consecutive formats. (35014)
Rich Text: Also strip object replacement character when removing padding. (34851)
Writing flow: Fix focus trap on non-text input types. (32714)
Fix bug in the receiveBlocks action resulting in a broken block list. (35076)
Block Library
HTMLHTMLHyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. block: Prevent external styling of editing UI. (34727)
Page List Block: Fix gap in vertical page list. (35026)
MediaPlaceholder: Fix media library button opening the file upload modal. (34894)
Clean theme data when switching themes in the 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.. (34540)
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/.
Add missing field _invalid in menu item REST API. (34670)
Fix navigation editor missing appender not showing appender when no blocks selected. (34678)
Fix navigation editor undo button being active when editor loads. (34839)
Open link control if submenu parent is link. (34798)
Stop submitting Create Menu form in busy state. (34983)
Fix saving locations using the “Manage Locations” popup. (34714)
Site Editor
Site Editor – add basic 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 support. (34460)
Update documentation for ClipboardButton component. (34711)
Create Block: Remove wp-cliWP-CLIWP-CLI is the Command Line Interface for WordPress, used to do administrative and development tasks in a programmatic way. The project page is http://wp-cli.org/https://make.wordpress.org/cli/ callout since not recommended and outdated. (34821)
Update the 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. section in documentation. (35035)
Scripts: Add CHANGELOG entry for jest-dev-server upgrade. (34657)
Rich text: Only merge neighbouring equal formats when applying a format. (35016)
Writing Flow: Merge place caret at edge functions. (30481)
Site editor: fix PHPPHPThe web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher notice: Undefined index: __unstableType. (34735)
Use rest_is_field_included function in menu endpoints. (34673)
Remove duplicate Theme JSON block gap key. (34774)
Block Editor
Global shortcuts: Use React events (portal bubbles & contextual). (34539)
Rename experimental prop used in BlockControls. (34644)
Update callers to handle when getBlockType returns undefined. (34891)
Block Library
Latest Comments: Add missing parameter to widget_comments_args. (29403)
Navigation submenu block: Replace global shortcut event handlers with local ones. (34812)
Components
ColorPicker: Replace global shortcut event handlers with local ones. (34508)
Delete the createComponent utility function. (34929)
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 a “translators:” comment in the core class used to implement a Block widget. (34840)
Try to fix flaky 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. test. (34776)
Test that add_theme_supports are loaded for themes without theme.json. (34998)
Storybook: Remove G2 prefix from the Components section. (34734)
Block Editor: Update react-spring to 9.2.4. (30979)
Move react-native-url-polyfill to dev dependencies. (34687)
Use Jest related rules only when the package is installed. (33120)
Ensure that all *.asset.php files are included in plugin.zip. (34875)
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.6
7.6 s
38.38 ms
Gutenberg 11.5
7.2 s
38.54 ms
WordPress 5.8
7.9 s
45.97 ms
Kudos to all the contributors that helped with the release. 👏
What’s next 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/? (Mid-September 2021)
@jorgefilipecosta said the post with the goals for the Gutenberg project in September is published and referred that the priorities are the template Editor, Patterns, Global Styles 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., the design tools., and the Navigation 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./navigation editor work.
As a follow-up @ntsekouras brought attention to an experiment to trigger some discussions – a Patterns explorer, asking people to share their thoughts.
Fix image block height and border 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.
Fix back icon color in dark mode
In Progress
Additional Embed block improvements
GSS Font size, line height, colors
Components package
Shipping
Completed a migrationMigrationMoving the code, database and media files for a website site from one server to another. Most typically done when changing hosting companies. away from the createComponent function. This simplifies the process of adding new components to the library, using the more straightforward View component.
Following up on the recently expanded contributor guidelines, we simplified the structure of the guidelines and added a table of contents.
In Progress
@youknowriad merged a PR that introduces a navigation component to the Global Styles 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., which moves us closer to the updated designs. We’re experimenting now with a revised Navigator component that may provide greater flexibility for the design.
Navigation Editor
Lots of work happening on priority items. Thanks to everyone who is contributing so much work.
• 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/. interactions have been improved and more issues identified. • Started looking at ways to add links in Bulk. • Using Theme JSON to control the block in the editor has been ruled out. • Another Hallway Hangout is on the cards – dates/times to be confirmed.
For the next week, the plan is to continue iterating on the design and address the remaining follow-ups we have thinks like changing the border of the input field from a gray to slightly different gray changing the dimension of inputs from 30px to 40px, changing the focus look on the range control.
Will keep supporting @jorgefilipecosta and other folks working on the @wordpress/components package, including most of the work that is being done on the new Global Styles sidebar.
Open floor
Responsiveness
Roman Axelrod asked the following:
It was mentioned earlier, but… At time moment, core editor doesn’t provide options of setting different styling rules for each device / breakpoint (Preview modes: Desktop, Tablet, Mobile).
Right now, the rules are global. For example if I set padding: 60px to Group block from the right sidebar of the editor, this rule is going to appear on Desktop and Mobile.I curious if we are going to have the same functionality that all popular page builders have? Usually they provide a list of breakpoints and ability to “overwrite” styling rules of previous breakpoint. It gives ability of adapting the design by requirements.Is this something that we can expect soon? Are we going to have something like this in 2021?
@jorgefilipecosta said he thinks that is not something on the roadmap for 5.9, but allowing to control how things look depending on the dimensions of the place where they are rendered is something that will end up existing.
Custom Fields
Roman Axelrod asked the following:
Are there any plans or ideas of using Custom Fields in core blocks? For example, imagine the situation where I have 20 pages. All pages have a “Hero” section that contains title, text, button on the left and image on the right. The design is the same but the content is different and unique for each page (kind of a template).Now let’s say, after I built these 20 pages, we realized that the Heading block should be 5px bigger. How should I fix that? It might be annoying to go page by page and update the font-size of each heading.As a reference, Elementor page builder provides this kind of option – they call it “Dynamic Content”. I thought that the block-template-parts of FSE will solve this case. But this is still not there. Are there any thoughts/discussions about similar cases?
Hi Roman, maybe the solution to your issue is to define a CSSCSSCascading Style Sheets. variable that represents the size. Theme.json provides a mechanism for declaring the css variables, and then instead of using 5px as value you use the css variable as the value. Changing the variable will then change the size in every place.
Roman followed up asking about how non-developers would be able to change those values. @jorgefilipecosta said that If one wants to allow a user to change a CSS variable, one could do it by registering a custom sidebar to change the variable. Maybe one day core offers something that automatically renders a UI where users could change variables registered using theme.json, but it is not part of the road map for now.
Developer Hours online
@bph made a big announcement during the core editor chat:
There will be a make core post with more info, this is just a heads-up, about a trial initiative to hold “Developer Hours online” every other week, with a group of Gutenberg developers, a short topic and then answering attendee’s Block and Theme building questions, with screen sharing of code and follow-up post. Depending how the trial goes, we might expand it. If you want to be part of that initiative let me know or comment on the post.
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.
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!
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!
@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.
Two weeks have already passed since 11.1, so this week 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 was released. This release seems to have had more of a focus on 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 tooling, but nevertheless there are still some great features to highlight. Color support has been expanded on two blocks, a new layout option is being tested for parent blocks, and there’s now an option for creating a new post after publishing.
Search 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. – button and border colors
Add a new page/post button on publish panel. (33276)
Widgets Editor
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. inserter: Clarify that the button toggles the inserter. (33561)
Update widget editor help links to point to the new support article. (33482)
Components: Promote VisuallyHidden from ui into full components (#31244). (31902)
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)
Inserter: In text label mode, use “Close” label when inserter is open. (33534)
Data
CoreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. Data: Pass query argument to data selector shortcuts. (33689)
Bug Fixes
Block Library
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.: Allow authors to select images uploaded by other users. (33567)
Remove instagram reference from embed block’s description. (33519)
Block Editor
Fixed that the block is selected instead of the title when using the select all shortcut. (33621)
Post Editor
Most Used Terms: Avoid 403 error for non-administrators. (33569)
Editor: Set ‘hide_empty’ for the most used terms query. (33457)
HierarchicalTermSelector: Use TextControl component. (33545)
PWA manifest: icon: Fix error when adminadmin(and super admin) bar is gone. (33702)
Widgets Editor
Fix 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/theme incompatibility, call onChangeSectionExpanded conditionally. (33618)
Components
Fix: Native UnitControl to handle single unit configuration. (33641)
BoxControl: Prevent 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. style values. (33444)
UnitControl: Set correct unit when units has one option. (33634)
components: Use useCx to fix 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. support. (33301)
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.: Fix broken 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. in WP_Theme_JSON_Resolver. (33624)
Update button block corner radius test to px. (33562)
Add unsupported block title translationtranslationThe process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. test. (33340)
Release docs: Add process for creating a point releaseMinor ReleaseA 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. of the Plugin. (33546)
Docs: Run Prettier after updating 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. in documentation. (33498)
Publish android artifacts with publish to s3 gradle plugin. (33441)
Build: Split configuration into two parts – blocks and packages. (33293)
Automate grouping of release Changelog PRs by feature. (33229)
Packages: Ensure changelog entries are attributed to the correct release. (33590)
Add i18n filters to documentation table of contents. (33556)
Update the create a block theme how-to guide. (33382)
Block API: Improve how blocks assets are versioned. (33075)
Update the tested up to version in the readme file. (33760)
Correct {% end%} 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.) – missing a space. (33189)
Use tabs instead of spaces in block transform doc example. (33549)
Fix flaky widgets end-to-end tests by waiting for the snackbar correctly. (33317)
Scripts: Add changlog entry for module update. (33473)
Create block: Update “Tested up to” in readme.txt. (33493)
Code Quality
Block Library
Fix optional params in page list rendering. (33639)
Block Editor
Block editor: Use ReactReactReact is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. events for shortcuts (portal bubbles & contextual). (32323)
Block editor: Remove focus stopPropagation from appender. (32003)
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.2
8.48s
37.89ms
Gutenberg 11.1
8.54s
38.17ms
WordPress 5.8
8.43s
39.71ms
Kudos to all the contributors that helped with the release! 👏
You must be logged in to post a comment.