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.
“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/…” posts (labeled with the #gutenberg-new tag) are posted following every Gutenberg release on a biweekly basis, showcasing new features included in each release. As a reminder, here’s an overview of different ways to keep up with Gutenberg and the Site Editor project (formerly called Full Site Editing).
The latest release of the 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 is lighter on user-facing features than normal and focuses heavily 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, testing, and other much-needed improvements. But, there are some welcome additions, such as turning paragraphs into columns, an improved Cover 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 new template descriptions in the site editor.
The Cover block now supports the text color design tool. The enhancementenhancementEnhancements are simple improvements to WordPress, such as the addition of a hook, a new feature, or an improvement to an existing feature. makes it easier for users and theme authors to customize the color for all inner blocks with a single setting. Along with this benefit, the change made it easier to handle transforms from the Media & Text block.
The Cover block also now works the same as the Group block with its layout handling. Currently, the block only supports the flow layout and is set to a constrained width by default. It does not yet support flex layout variations.
The update brings consistency to layout handling, building atop a standardized system that will make for fewer edge cases and necessary customizations for theme authors.
Theme authors should test their themes against this update. In the past, some have had to work around the layout limitations of the Cover block, and the block’s support of the standard layout system may override custom implementations.
Updated template descriptions
Template descriptions have received a major overhaul in the latest update. Nearly all of them have been updated to better explain what each template does. This should make it easier for users to understand each template’s purpose when customizing it in the Site Editor.
Other Notable Highlights
A new textColumns property has been added as a “block supports” feature and is now in the style engine. It will allow users to split text-based blocks into columns. Developers can opt into this for their custom blocks, but no coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. blocks support the feature yet. There are open tickets for adding it to the Paragraph and Post Excerpt blocks in future updates.
Theme authors can now target the :link and :any-link pseudo-elements in theme.json, giving them more control over styling hyperlinks.
The FontSizePicker component allows for an array of custom units to be defined. This is the first step toward allowing theme authors to eventually control the available units if their themes support custom font sizes. However, the editor’s Typography panel does not yet support this feature.
Change Log
Enhancements
Site Editor
Adjust whileHover effect to be a bit subtler and less pronounced. (48928)
Go direct to edit from manage all templates list. (48764)
Move “Add Template”‘s descriptions to tooltips. (48710)
Add descriptions to all panels in the Site Editor’s dark side. (48739)
Add hover animation to site editor canvas. (48575)
Fix non-us spelling in 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.. (48976)
Prevent the saving button from showing when renaming templates. (48399)
Navigation Sidebar: Change the logic about which navigation gets selected for the sidebar. (48689)
Add “Added by” description to template part navigation sidebar. (48732)
Add border radius to off canvas 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. items. (48798)
Add page details when viewing a specific page. (48650)
Duotone: Limit SVG 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. output to used filters. (48995)
Open convert to links modal on select of a page item. (48723)
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.: Remove 16:10. (48969)
FormTokenField: Hide suggestions list on blur event if input value is 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.. (48785)
Design Tools
Block Supports: Add text columns (column count) to typography block supports. (33587)
Global Styles
Move the global styles provider to the app level component. (49011)
Add support for :link and :Any-link in 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.. (48634)
Add compound class to layout wrapper for global spacing styles. (47952)
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.
Block Deprecations: Provide extra data for isEligible check. (48815)
Post Editor
Provide static native editor help article slugs. (48802)
Try getting Post Content layout on server before editor loads. (45299)
Packages
Introduce prependHTTPS URLURLA specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org util. (47648)
Bug Fixes
Block Library
Embed Block: Fix Aspect Ratio Classes #29641. (41141)
Ensure aspect ratio is applied when Post Featured Image block is linked. (48495)
Fix PostContent initial render by waiting for the canEdit request. (48642)
Fix navigation block off-canvas appender for empty menus. (48907)
Fixes extra UIUIUser interface in navigation block inspector. (48679)
Import Classic Menu using the menu name as the block menu title. (48771)
Navigation Link: Remove color generation code. (48927)
Navigation: Fix missing state for MenuControls. (48921)
Update missing translationtranslationThe process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. from label. (48760)
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. Importer: Fix Widget Group block imports. (48669)
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.: Show variant patterns even if there are no patterns for the Query Loop block. (48793)
Comments: Fix ‘sprintf requires more than 1 params’ error. (49054)
Adjust Post Featured Image PanelBody label to “Settings”. (49076)
Add help text to Gallery Image Size control. (49074)
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 created Navigation menu title. (48773)
Make sure the directly inserted block in the Nav block is a Page link. (48740)
Tweak label for Latest Posts 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. control. (49077)
Page List Block: Show untitled pages on page list on the editor. (48772)
Site Editor
Don’t offer Classic block as a recovery action when not registered. (49051)
Fix browser history when synchronising state with urls. (48731)
Fix lingering insertion point within template parts. (48913)
Remove actions from SidebarNavigationScreenWrapper. (48935)
Update template descriptions with more detail. (48934)
Global Styles
Fix typo: Use WP_Theme_JSON_Gutenberg instead of WP_Theme_JSON class name. (48648)
Fix: Crashes on getNodesWithSettings and getNodesWithStyles. (49023)
Fix: Global Styles crash in updateConfigWithSeparator when not block styles are passed. (49045)
Fix: Global Styles getNodesWithStyles expects an object with elements. (49044)
Fix: Global Styles getPresetsClasses crashes if no selector is passed. (49024)
Fix: Global styles forces a white background. (49042)
Style Book: Move 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. to root of content area to support styles that overflow block previews. (48664)
WP_Theme_JSON: Sync indirect properties changes from core. (48646)
ResizeTooltip: Use default.fontFamily on tooltip. (48805)
ResponsiveWrapper: Use aspect-ratio CSSCSSCascading Style Sheets. prop and support SVG elements. (48573)
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)
Make sure useFocusOnMount runs when all the children tabbable elements have mounted. (42187)
Distraction Free Mode: Don’t show the metaboxes. (48947)
Don’t add Post Content layout styles to title in the post editor. (48663)
Fix animation and browser console error when returning from template edit mode. (48930)
Block Editor
LinkControl: Remove HTMLHTMLHyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. from suggestion title before passing it to TextHighlight component. (48685)
Order initial block items in Navigation with PrivateInserter. (48752)
BlockInvalidWarning: Prefer canInsertBlockType and refactor to 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.. (49052)
Fix: Incorrect selector generated by append_to_selector method. (48759)
Block Library
Lodash: Remove _.get() from various blocks. (48491)
Data Layer
Lodash: Refactor away from _.set() in core-data. (48784)
GitHubGitHubGitHub is a website that offers online implementation of git repositories that 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/ Actions
Prefer committercommitterA developer with commit access. WordPress has five lead developers and four permanent core developers with commit access. Additionally, the project usually has a few guest or component committers - a developer receiving commit access, generally for a single release cycle (sometimes renewed) and/or for a specific component. over author date for perf results timestamp. (48673)
Documentation
Add links to hook documentation in curation doc. (48653)
Add missing playwright end-to-end documentation to toc.json. (48447)
Adding examples of how to programmatically remove the panels in Document sidebar. (48895)
Adds link to post on the developer blogblog(versus network, site) to the deprecation page. (49069)
Add position: Sticky to the Opt-in into UI controls appearanceTools section. (48763)
Duotone: Style Engine: 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. and associated refactoring. (49033)
Query Block: Add tests for getValueFromObjectPath() util. (48956)
First time contributors
The following PRs were merged by first time contributors:
@abhi3315: Link Control – Add support for text only labels. (47930)
@hbhalodia: Change higher order with-constraint-tabbing from .js to .tsx. (48162)
@sboerrigter: Fix incorrect css property in editor-color-palette documentation. (48333)
@shreyasikhar: Site Editor Sidebar: Add line-height for template/parts name and update width for edit button. (48160)
@suvrodattamitu: Style Engine: Fix wrong property name letterSpacing to lineHeight. (48091)
@tomdevisser: Remove copy for managing a block’s style variations. (48367)
Contributors
The following contributors merged PRs in this release:
“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/” is published following every Gutenberg biweekly release, showcasing new features included in the release. As a reminder, here’s an overview of different ways to keep up with Gutenberg and the Site Editor (formerly called Full Site Editing) projects. Previous release posts can be found via the #gutenberg-newtagtagA 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.).
The latest version of Gutenberg, 15.3, tightens up the site editing experience, adds a new “Time to Read” 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. for adding estimated read time to posts, and a number of Duotone enhancements. Combined with a multitude of improvements across the board, this release is a solid step forward for Gutenberg.
The Site Editor has received a number of enhancements, culminating in a tightened-up, design-forward experience that brings site editing center stage.
With another round of polish, the Site Editor experience is feeling more refined than ever.
New “Time to Read” block
The new “Time to Read” block allows you to display the estimated time the average reader takes to read the current page, or post. Letting readers know right off what their estimated reading time helps them to decide if they should continue reading, or save the post for later. (43403)
The block is relatively simple as-is, with follow-ups to enhance styling capabilities.
Leveling-up Duotone
This release includes a number of enhancements around leveling-up the popular Duotone design tool. You can now set a 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. globally within the Site Editor’s Styles panel, whereas in previous releases you could only do this manually within 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. file. (48255)
Duotone presets are now stored as slug values, instead of hard-coded color values (i.e. #FFFFFF). Using the preset itself means that Duotones are no longer locked to a specific theme, or theme variation.
If you apply a Duotone, then change a theme to another that uses the same slug value, the new theme’s Duotone will now take effect. (48318)
And last, Duotone styles are now generated using the WordPress Style Engine, meaning that CSSCSSCascading Style Sheets. is generated as part of the block supports CSS — rather than inline. (48281)
Changelog
Enhancements
Site Editor
Refactor the site editor URLs for better backward compatibility. (48063)
Remove TemplateAreas from template details. (48490)
Site 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.: Add line-height for template/parts name and update width for edit button. (48160)
Extract a DimensionsPanel component as a reusable component between Global Styles and Block Inspector. (48070)
Remove copy for managing a block’s style variations. (48367)
Block Editor
Apply keyboard shortcut conversions between paragraphs and headings to all editor instances. (47972)
Create automatic change higher order reducer. (48312)
[Inserter]: Preload media categories empty check – client side. (47503)
Post Editor
Revert iframed editor for WP coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. only. (48076)
PageAttributesCheck: Return boolean value directly from the selector. (48336)
Apply busy status to the publish button in progress and unify button width. (48444)
Add all allowed innerblocks to the inspector animation experiment. (47834)
Make the Site Logo block placeholder state smaller. (48218)
ToggleControl: Remove margin overrides and add opt-in prop. (47866)
Post Terms block: Add transforms for variations. (48328)
Navigation List View: Add block movers to the more menu. (48099)
Navigation: Always create a fallback menu. (47684)
Navigation: Don’t create a fallback 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. if there are inner blocks. (48585)
Navigation: Update the dependencies for the useEffect that handles notifications. (48066)
Navigation: Wrap the dependent functions in useCallback. (48195)
Page List: Move the modal to its own file. (47922)
Classic Block: Replace the deprecated isPrimary prop with variant. (48230)
Refactor core blocks to use HTMLHTMLHyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. Tag Processor. (43178)
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.
HTML Tag Processor: Add WP 6.3 compat layer. (47933)
Tag Processor: Add bookmark invalidation logic. (47559)
Design Tools
Duotone: Use the style engine to generate CSS for Duotone. (48281)
Duotone: Add Global Styles controls for blocks that support duotone. (48255)
Use Duotone presets in block duotone attributes. (48318)
Duotone: Use CSS variables instead of slugs in block attributes. (48426)
Border Panel: Add missing dep for onBorderChange callback. (48010)
Disable layout toolbar controls for content locked blocks. (47939)
SpacingSizesControl: Fix white dot on thumb. (48574)
List View
Scroll selected block into view when single block selection changes. (46895)
Components
Change higher order with-constraint-tabbing from .js to .tsx. (48162)
CircularOptionPicker: Refactor to TypeScript. (47937)
Extract delete handler to hook for RichText. (48273)
ToolsPanel: Remove unnecessary dep from resetAll callback. (48011)
Link Control – Add support for text only labels. (47930)
Pin floating-ui/reactReactReact is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/.-dom version. (48402)
Use React 18 rendering for import dropdown. (48244)
Only add layout classes to inner wrapper if block is a container. (48611)
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. Editor: Fix a problem with ‘Move to Widget Area’ button not working. (48233)
Block Library
Add support for orientation-based block movers to core/social-links. (48452)
Fix 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.: Read more link is always on new line in the editor. (47772)
Fix: OffCanvasEditor does not inserts submenu on collapsed items. (48214)
List Item: Avoid an error when the ‘onReplace’ prop is undefined. (48639)
Add missing code on the fix page list loading PR. (48621)
Prevent text decoration from showing up in all blocks. (48117)
Widget Importer: Don’t render controls when there’s nothing to import. (48396)
[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.] Fix top border in pattern selection modal. (48303)
[Query Loop] Sync gutenberg_build_query_vars_from_query_block with core. (48640)
AvatarAvatarAn avatar is an image or illustration that specifically refers to a character that represents an online user. It’s usually a square box that appears next to the user’s name.: Clean up border application in editor. (48024)
Global Styles
Fix for WP_Theme_JSON_Resolver_Gutenberg::Get_merged_data. (48644)
Playwright: Fix request utils for non Docker envs. (48206)
[Private APIs] Only prevent module re-registration if IS_WORDPRESS_CORE. (48352)
Add a manual performance job that we can trigger from GithubGitHubGitHub is a website that offers online implementation of git repositories that 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/UIUIUser interface. (48302)
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)
Autocomplete: Duplicate list within 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. for non visual users. (47907)
Fix the Publish region position and focus style. (48102)
Focus 1st parent block on block remove, if no previous block is available. (48204)
List view: Allow selected block to override roving tabindex. (48339)
Style Book: Allow button text labels for style book icon. (48088)
Style Book: Focus the Style Book when opened, and enable ESCAPE key to close. (48151)
Try to fix a11yAccessibilityAccessibility (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) test flakiness. (48236)
Make the template customized info accessible. (48159)
Fix perf 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 duotone 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.. (48401)
Writing flow: Avoid recalc style on every selection change. (48409)
useAsyncList: Flush state updates when processing queue. (48238)
Components
Autocomplete: Reduce work before finding trigger. (48327)
Disable lazy term 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. loading render_block_core_template_part. (48000)
Rich text: Only selectively handle keyup/pointerup. (48385)
Lodash: Remove _.merge() from getMappedColumnWidths(). (48032)
Lodash: Remove some _.get() from Gallery block. (48488)
Lodash: Remove some _.get() from Image block. (48489)
Documentation
Clarify backportbackportA port is when code from one branch (or trunk) is merged into another branch or trunk. Some changes in WordPress point releases are the result of backporting code from trunk to the release branch. status of appearance-tools theme support. (48622)
Docs: Clarify release process for major WP 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. 1. (48248)
Docs: Markdown fix for wp_enqueue_script usage. (48212)
Fix e2e-test-utils-playwright’s jsdoc and types. (48266)
Fix incorrect css property in editor-color-palette documentation. (48333)
Proactively update versions in WordPress ahead of 6.2. (48145)
Update curation document to include theme.json filters. (48576)
Updates to the curating the editor experience to include 6.1 & 6.2 items. (48294)
First time contributors
The following PRs were merged by first time contributors:
@abhi3315: Link Control – Add support for text only labels. (47930)
@hbhalodia: Change higher order with-constraint-tabbing from .js to .tsx. (48162)
@sboerrigter: Fix incorrect css property in editor-color-palette documentation. (48333)
@shreyasikhar: Site Editor Sidebar: Add line-height for template/parts name and update width for edit button. (48160)
@suvrodattamitu: Style Engine: Fix wrong property name letterSpacing to lineHeight. (48091)
@tomdevisser: Remove copy for managing a block’s style variations. (48367)
Contributors
The following contributors merged PRs in this release:
“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/…” posts (labeled with the #gutenberg-newtagtagA 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.)) are posted following every Gutenberg release on a biweekly basis, showcasing new features included in the release. As a reminder, here’s an overview of different ways to keep up with Gutenberg and the Site Editor project (formerly called Full Site Editing).
This release sees the integration of Openverse through the Media tab, the addition of custom CSSCSSCascading Style Sheets. per 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. via the 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. 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., navigation menus in the browse mode sidebar, and the facility to add shadow presets in global styles.
Openverse is now integrated into the Inserter in the Editor. It is now possible to get access to an extensive library of free stock photos that are available for free use, directly from the Media tab. (46251)
Global Styles now supports shadow presets
Access to shadow presets from the UIUIUser interface of Global Styles has been added to Gutenberg 15.1. There are now four shadow presets (Natural, Crisp, Sharp and Soft) defined by default, but new and custom ones can be defined for the theme via ‘theme.json’. (46502)
Add custom CSS on a per-block basis
It is now possible to add custom CSS styles on a per-block basis. Custom CSS can be added via the Global Styles UI, which will be applied to all the block occurrences. Default CSS styles can also be defined for each block via theme.json. (46571)
Navigation added to the Site Editor sidebar
Gutenberg 15.1 introduces Navigation to the browse mode sidebar in the Site Editor. This enables the user to manage their site’s navigation menus from within, thereby providing a more integrated site editing experience. (46436). This 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. also includes the items of each menú so we can navigate through them directly from the Site Editor sidebar. (47387)
Other notable highlights
New menu options for copying and pasting styles between blocks
Applying the styling from one block to another can now be done more readily with the addition of a new group in the Options menu of the block’s toolbar. The new group contains the options to “Copy styles” and “Paste styles”. Previously only the “Copy styles” option was available, leaving it unclear how to paste them into the receiving block. The process is now clearer and more easily discoverable. (47430)
Featured images in templates can be sized
The release of Gutenberg 15.1 brings the ability to adjust the size of 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. placeholder in the single post and single page templates from within the Site Editor UI. As well as allowing the size of the featured image to be defined it also adds scaling options, namely ‘Cover’, ‘Contain’, or ‘Fill’, that determine how the image will appear within the container. (46868)
Changelog
Enhancements
Block Library
Add Crowdsignal Embed Variation for a new oEmbed endpoint. (47382)
Add box shadow support to blocks (using code editor for now). (46896)
Cover block: Add HTMLHTMLHyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. element selection. (46969)
Enable image size for featured images in templates. (46848)
Gallery Block: Add toolbar button to add a caption. (47325)
Make the off-canvas navigation editor the default experience. (46995)
Move copy and pasting styles menu items to a separate menu group. (47430)
Navigation: Add a manage menus button to the menu selector dropdown. (47005)
Navigation: Allow multiple navigations with the same ref. (47453)
Navigation: Remove filters disabling tabs for link and submenu. (47593)
Navigation: Remove the manage menus button from the selector. (47441)
Page List: Swap the positions of the parent page selector and customize button. (47547)
Page List: Update the edit/customize copy. (47549)
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.: Add text alignment to the placeholder. (45003)
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: Use BlockPatternsList component for Query block patterns modal. (47366)
Remove endless spinned for removed navigations. (47578)
Remove the list view button from the navigation block. (47032)
Table Block: Support rowspan attribute in table HTML, including when pasting. (46629)
Migrate from TextControl to InputControl to remove margin overrides. (47161)
Multiple blocks: Add missing has-link-color class to the front. (47357)
[Navigation]: Update example with no mobile view. (47508)
Navigation Block List View: Improve the accessible Name of the Tree Grid inside the component. (47031)
Global Styles
Add “Learn more about CSS” help text to Custom CSS control. (47091)
Add padding when no tabs in the background panel. (44044)
Add validation message to custom CSS input. (47132)
Change “Custom” CSS navigation label to “Additional CSS”. (47093)
Make css input fill remainder of screen by default. (47437)
Move custom CSS to ellipsis menu if no custom CSS present yet. (47371)
Move custom css to its own inline style generation method and combine with 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. CSS. (47396)
Update the site editor for better initialization. (47182)
Updates some spacing + dimensions in the Site Hub. (47120)
Add: Navigation menus to the browse mode sidebar. (46436)
Shadow: Add shadow presets and UI tools in global styles. (46502)
TextControl: Remove margin overrides and add new opt-in prop (pt 1/2). (47157)
[Webfonts] Rename to Fonts 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.. (46749)
Add layout child sizing to Navigation block. (47584)
Site Hub: Remove the aria-label from the Edit button. (47343)
Add ability to open the editor on the selected post on navigation. (47387)
Allow clicking the site editor frame to enter edit mode. (47676)
Pattern Explorer Modal: Select the first categoryCategoryThe 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. as the initial category. (47661)
[Patterns]: Support the blockTypes prop for patterns fetched from Pattern Directory. (47677)
Sticky Position: Fix top position while logged in on mobile. (47665)
Testing
Clean up sidebar tab end-to-end test utils. (47097)
Components: Refactor more tests to use real timers. (47318)
Components: Use real timers where possible. (47056)
Migrate Classic block tests to Playwright. (46689)
Block Editor
Add custom label to nav block list view appender. (47033)
Move Link Control action buttons into lower settings area. (47309)
Pattern Inserter: Show insertion indicator when hovering on patterns. (47316)
Add clear Apply and Cancel buttons to Link Control. (46933)
TextControl: Remove margin overrides and add new opt-in prop (pt 2/2). (47158)
[Block editor]: Add setting to disable Openverse integration. (47404)
Block Inspector: Make Settings tab the default. (47592)
Sticky Position: Hide controls if the block is non-root (has parents). (47334)
Block Inspector: Avoid advanced panel only settings tab. (47474)
Stabilize the experimental control groups. (47105)
Table: Display fixed width table cells option by default. (47536)
Components
AligmentMatrixControl: Update center cell label to ‘Center’. (46852)
Button: Try improving padding for icon + text buttons. (46764)
Fix HStack documentation to show code sample. (47162)
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)
Announce when block inserted in Navigation list view. (47034)
Navigation block: Fix some off canvas appender accessibility issues. (47047)
[Block Editor]: Update text align toolbar control label. (47119)
Themes
Make child themes inherit parent’s style variations. (46554)
Template parts and Reusable block: Fix multiple selection overlay styles. (47342)
Use tertiary variant on Link Control cancel button. (47313)
Add back block editor settings 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.. (47558)
BackportbackportA port is when code from one branch (or trunk) is merged into another branch or trunk. Some changes in WordPress point releases are the result of backporting code from trunk to the release branch. WP_REST_Pattern_Directory_Controller changes from coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress.. (47409)
Block Editor: Move component styles needed for iframes to content styles. (47103)
Block Inserter: Correctly apply style to the default inserter. (47166)
Block editor: 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.: Fix placeholder colors. (47416)
Fix reactReactReact is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. key error with position controls. (47367)
Revert “Navigation List View: Remove empty cell when there is no edit button”. (47061)
[Block Editor]: Fix onHover errors at BlockPattern. (47466)
[Block Editor]: Register the store through registerStore. (47488)
Avoid erroring when getQueryArgs processes a malformed URLURLA specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org. (45561)
MediaUtils: Move window access to function bodies. (46970)
Fix and simplify the Modal dialog close button label. (47540)
Sharing private APIs with lock() and unlock(). (46131)
Use experiment locking/unlocking system for block interface selector and actions. (47375)
WP_HTML_Tag_Processor: Rename attribute_updates to lexical_updates. (47053)
Fully remove Navigation Editor screen and associated edit-navigation package. (47055)
Tag Processor: Only define classes if they don’t already exist. (47434)
Documentation
Improve gutenberg release documentation to explain the 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 backporting process. (47372)
Quick update to the Gutenberg plugin description. (47432)
Fix typo in InspectorControls documentation. (47154)
QueryControls: Improve onCategoryChange prop documentation in README. (47452)
Export off canvas editor via experiments package. (47465)
Image Editor: Merge context provider into editor component. (47171)
Mark “post author name” as stable / no longer experimental. (45008)
Navigation: Remove the Gutenberg plugin check. (47579)
Global Styles
Change ‘get_legacy_theme_supports_for_theme_json’ compat dir. (47456)
GlobalStyles 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.: Do not smart merge presets in useGlobalSetting. (47415)
Move Global Styles APIs to wordpress/block-editor. (47098)
Update Global Styles Controller PHPUnit tests. (47502)
Update eslint-plugin-jsdoc to support Node 18 and 19. (47490)
Fix: Avoid using index as JSX key on offsite navigation editor LinkControlTransforms. (47083)
Refactores __ExperimentalOffCanvasEditor to OffCanvasEditor. (47553)
Rename __unstableInserterMediaCategories to inserterMediaCategories. (47492)
Stabilize the clearBlockSelection editor setting. (47627)
[Block Editor]: Stabilize __experimentalGetAllowedBlocks. (47210)
[Block Editor]: Stabilize __experimentalGetPatternsByBlockTypes. (47183)
URLInput test: Use valid URL value to pass through validation. (47444)
Testing
Multi-block selection and rich text test: Wait for expected UI to appear. (47173)
ESLint: Enable jest/recommended for tests. (47065)
Remove old test now migrated to Playwright. (47247)
RichText tests: Don’t use JSDOM explicitly, it’s set up by environment. (47445)
Position Block Support: Add PHPPHPThe web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher tests. (47626)
Tools
Testing
Run PHPUnit jobs across multiple PHP versions. (46510)
Add end-to-end tests for ‘Import 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. area’ button. (47131)
ESLint: Disable jest rules for storybook playwright. (47141)
Reset default_comment_status to previous value after post comments form end-to-end test. (47481)
Tests: Use real timers where fake timers are unnecessary. (47144)
WP_HTML_Tag_Processor: Make get_attribute reflect attribute set via set_attribute, even without updating. (46680)
core-data: Refactor tests to use real timers. (47218)
test: Add separate mobile experiments file. (47513)
Migrate a11yAccessibilityAccessibility (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) end-to-end tests to Playwright. (46038)
Copy failing WP_HTML_Tag_Processor_Bookmark_Test tests from Core. (47720)
Build Tooling
Add test for experimental/block-editor-settings-mobile endpoint. (46816)
Fix GH action warning by upgrading actions/checkout. (47494)
Performance suite: Track Time To First Byte in the front-end. (47037)
React Native: Remove duplicate metro packages. (47377)
Simplify editor.canvas by removing hasIframe. (46986)
“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/…” posts (labeled with the #gutenberg-newtagtagA 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.)) are posted following every Gutenberg release on a biweekly basis, showcasing new features included in the release. As a reminder, here’s an overview of different ways to keep up with Gutenberg and the Site Editor project (formerly called Full Site Editing).
This release sees the 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. inspector tabs experiment stabilized, prevents images from being resized larger than their containing element, and adds the ability to paste styles from one block to another. In addition, there’s now a “sticky” option for blocks enabling them to stay in view while the rest of the content scrolls.
Block inspector tabs experiment has been stabilized
The block inspector tabs experiment has been stabilized with the release of Gutenberg 15.0. Some blocks now split controls between separate tabs in the inspector panel. If you’ve enabled the “Off canvas navigation editor” experiment then you will additionally see the list view tab whenever a Navigation block is selected in the editor. This in turn will contain a list of the links that you can edit. This enables a new way of editing menus that supplements, and doesn’t replace, the on-canvas functionality. (47045)
“Paste styles” option added to the block settings
Gutenberg 15.0 introduces “Paste styles” making it easier to create multiple blocks with identical styling. This enables the user to copy a block and then paste just the styling of that block into another block The “Paste styles” option is available in the drop-down menu from the block’s settings panel, as demonstrated in the video above. (45477)
Edit block style variations from global styles
In a block that has variations, e.g., Button, Image, or Site Logo, it is now possible to change their styles via the Global styles panel, and those changes should only affect that specific variation. See a demo in the video above. (46343)
Images constrained to their containers
Prior to this release if you resized an image block using the handles it could easily be set to a size larger than the container. Now when you drag the handles the image remains constrained to the container and is prevented from being resized larger than its container. (45775)
New “Sticky” Position block support
A block can now be decoupled from the page layout. A new Position block support adds a “Sticky” option so that a block remains within the viewport and is stuck to the top of the page when the content is scrolled instead of scrolling with the rest of the content. This is useful if you need to ensure that an element, such as a status message or a promotion, remains on screen regardless of the page’s scroll position. It works in the block editor as well as in the front-end so the editor provides a true WYSIWYGWhat You See Is What You GetWhat You See Is What You Get. Most commonly used in relation to editors, where changes made in edit mode reflect exactly as they will translate to the published page. experience for this feature. You can learn about some follow up tasks to this initial implementation in this issue. (46142)
Other notable highlights
Allow 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. and frame resizing
This release enables the ability to resize the sidebar in the site editor allowing you to change the proportion of sidebar to frame. See it in action in this video. (46903)
Synchronize the canvas mode with the site editor URLURLA specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org
Gutenberg 15.0 updates the site editor to persist the “edit mode” in the URL. So for example if you’re in edit mode and then refresh the page, you get back to the same state thereby avoiding the need to click “edit” every time you reload the page. (47002)
Enable copy/cut shortcut
Keep your hands on the keyboard – the copy/cut/paste shortcuts (Ctrl/Cmd + C, Ctrl/Cmd + X, Ctrl/Cmd + V) now work in the Site Editor. (45752)
Changelog
Enhancements
Site Editor
Allow resizing the sidebar and frame of the site editor. (46903)
Remove the editor notices from the site editor frame. (46931)
Synchronize the canvas mode with the site editor URL. (47002)
Prevent the image from being resized larger than its container. (45775)
Replace block settings menu with a custom menu in off canvas editor. (46675)
Add help text on the HTMLHTMLHyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. element for the Comments and 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. blocks. (46989)
Navigation: Add an icon to the add submenu item option. (46884)
Navigation: Show the loading indicator when users add a new 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.. (46855)
Page List Block: Fix warning error when the parent page has no child pages. (46829)
Block editor: Move content styles to avoid triggering 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. compat mode. (46728)
Iframe: Preload style assets to avoid flash of unstyled content. (46706)
Inspector Controls
Sidebar Tabs: Add text only mode for block inspector tabs. (46968)
Sidebar Tabs: Stabilize the block inspector tabs experiment. (47045)
[Social Icon]: Fix 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 adding link label. (46905)
Components
ComboboxControl: Fix unexpected behavior in IME Composition. (46827)
Fix TreeGrid keyboard nav skipping Edit Block button in off canvas editor. (46998)
[Placeholder]: Set fixed right margin for label’s icon. (46918)
Tabs in preferences: Fix 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. from horizontal tabs. (46796)
Global Styles
Fix the ‘test_remove_invalid_element_pseudo_selectors’ test case. (47049)
Fixed Global Styles variables for colors, font family, gradient, fontSize. (46944)
Inspector Controls
Block Inspector: Fix browser warning error when block is not selected. (46875)
Performance
Post Editor
Lodash: Remove _.pickBy() from editor 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.. (46982)
Lodash: Remove _.pickBy() from template deletion. (46975)
Lodash: Remove _.pickBy() from block editor and deprecate. (46999)
Design Tools: Add a Position block support (including sticky), decoupled from layout. (46142)
Documentation
Adds “fluid” field inside settings.typography. (45705)
Docs: Add recommendation for developers to use GH CLICLICommand Line Interface. Terminal (Bash) in Mac, Command Prompt in Windows, or WP-CLI for WordPress.. (46847)
Quick update to versions in WordPress doc for 6.1.1. (46850)
ReactDOM.render deprecated, update Element README. (46925)
Remove stack exchange from new issue templates. (36158)
Update legacy-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.-block.md. (44343)
useSelect: Implement with useSyncExternalStore. (46538)
Block Library
Navigation Link: Fix PHPPHPThe web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher notices in unit tests. (47070)
Video Block: Fix browser warning error when settings are toggled. (46835)
Adds an identifier prop to the RichText component for captions, allowing annotation. (46917)
Fix: Use of array index instead of post id on latest posts. (46911)
Block Editor
Simplify the way we create a link UI control in the offcanvas editor. (46744)
Fix number of arguments passed to hasBlockMetadataSupport. (46842)
Tools
Testing
Block inserter search end-to-end test: Scope list item lookup to the inserter panel. (47066)
Migrate Manage Reusable Block to Playwright. (45621)
Migrate Post Visibility Test to Playwright. (44488)
Navigation block end-to-end tests: Default to a list of pages if there are no menus. (45070)
Only use a single comment for the flakiness report on PRs. (46785)
Mobile – Move the gutenberg-editor-block-insertion-2 end-to-end tests to integration tests. (46882)
Chore: Fix incorrect usage of map instead of forEach. (46853)
Chore: Remove unreachable line from phpunit/fixtures/mock-provider.php. (46843)
Build Tooling
package.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.: Add script to profile unit tests. (46909)
First time contributors
The following PRs were merged by first time contributors:
@BogdanUngureanu: Fixed Global Styles variables for colors, font family, gradient, fontSize. (46944)
“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/…” posts (labeled with the #gutenberg-newtagtagA 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.)) are posted following every Gutenberg release on a biweekly basis, showcasing new features included in each release. As a reminder, here’s an overview of different ways to keep up with Gutenberg and the Site Editor project (formerly called Full Site Editing).
Push 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. changes to Global Styles
Gutenberg 14.9 introduces a new button titled Push changes to Global Styles under the Advanced panel for individual blocks. This allows users to make changes while editing a template in the Site Editor but apply those changes on the global level. The new feature makes it much easier to keep a consistent design without needing to edit individual templates. (46446)
Typography support for Page List block
The Page List block now supports all typography options, including setting the font size, family, and more. This change is part of a larger effort to bring a consistent set of design tools across all coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. blocks. (43316)
Import 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. widgets to template parts
When inserting a new template part into a template in the Site Editor, users can now import widgets from a previously-registered dynamic sidebar. This is a transitioning tool to help users move from classic theme setups to blocks without losing work that they’ve put into their sites. (45509)
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. support: shadow presets and minimum fluid font size
WordPress theme authors can now opt into the new box-shadow feature, creating a set of custom presets to use in their designs. This system works similarly to colors, gradients, and other opt-in design tools. (46813)
Currently, the UIUIUser interface that would allow user overrides for this feature is still under development. However, the following screenshot is a preview of what it might look like:
Theme authors who use the built-in fluid typography system in theme.json can now set a minimum font size via settings.typography.fluid.minFontSize. By default, the minimum is set to 14px, but this may not be ideal for all designs. This new setting gives developers more control over how fluid typography is handled. (42489)
Other Notable Highlights
The previous Gutenberg release (version 14.8) introduced a new Site Editor sidebar, a hub for navigating the sections of a site. Version 14.9 continues iterating on this feature. The sidebar now displays the template title and type with a contextual edit button that sits beside them. The sidebar’s width has also increased, giving its content a bit more breathing room. (46736), (46769), (46700)
Developers can also now register patterns for specific template types, limiting where the patterns appear. For example, an Error 404 pattern would only make sense when used with the 404 template. (45814)
Change log
Features
Global Styles
Site Editor: Add new ‘Push changes to Global Styles’ button. (46446)
Patterns
Add: Template types to the patterns 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.. (45814)
Enhancements
Post editor: 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. for block-based themes. (46212)
Move word count to the top of the outline. (46648)
Update: Remove need for template prefix in gutenberg_get_template_hierarchy. (46257)
Update: Use offsite navigation editor on the navigation inspector sidebar. (46440)
Site Editor
Add the template title and type to the site hub. (46736)
Increase the width of the site editor sidebar. (46769)
Move the edit button in the site editor sidebar to a contextual 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.. (46700)
Block Library
Navigation: Adds page list as child of submenu. (46414)
Navigation: Bring back the heading and the menu selector in the ellipsis menu. (46622)
Template Parts: Add an option to import widgets from the sidebars. (45509)
Iframe: Restore typewriter effect in post editor. (46745)
Parse the attributes in a case-insensitive way to comply with the HTMLHTMLHyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. parsing spec. (46748)
Update: Guard against null block in off canvas editor. (46594)
docgen: Add function to handle list of types for theme.json schema. (46375)
Fix Off Canvas Editor add submenu item option. (46562)
Make table of contents label in placeholder translatable. (46788)
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.: Fetch terms suggestions dynamically. (46649)
Components
FocalPointPicker: Fix layout misalignment when placed in the BlockInspector. (46631)
Storybook: Fix crash when parameters is undefined. (46670)
Toolbar: Fix duplicate focus style on anchor link button. (46759)
Widgets Editor
Revert “[customize-widgets/utils/widgetToBlock] Initialize a widget’s raw_content.content to an empty string if it’s undefined“. (46600)
[customize-widgets/utils/widgetToBlock] Initialize a widget’s raw_content.content to an empty string if it’s undefined. (46487)
Inserter: Try fix media tab when upload of media types has been disabled. (46676)
Build Tooling
Restore gutenberg_ prefix to function calls in PHPUnit tests. (46662)
Patterns
Pattern Setup: Fix full heights during transition. (46615)
Design Tools
Verse: Prevent default styles overriding theme.json font family. (46560)
Block Variations
Block Variation Picker: Adds support to declared icon with source. (46373)
Themes
theme.json schema: Allow object type on style properties. (45897)
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)
Block editor: iframe/writing flow: Change tab index to 0. (46323)
Lodash: Refactor components away from _.find(). (46537)
Experiments
Add rough animation to navigation and links. (46342)
Tag Processor: Fix a problem backing up too far after updating HTML. (46598)
Block Library
Improve empty menu state in nav off-canvas editor. (46602)
Nav offcanvas – handle non-direct insert block inserter. (46503)
Navigation list view: Use smaller lock icon. (46578)
Documentation
Add missing prefix in PHPDocPHPDoc(docblock, inline docs) comment. (46808)
Clarifying the npm package release process for the RCrelease candidateOne of the final stages in the version release cycle, this version signals the potential to be a final release to the public. Also see alpha (beta). release. (46555)
Doc: Fix missing link to Block Styles page. (46695)
Element: Export new ReactReactReact is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. 18 APIs. (46610)
Block Library
Comments Block: Remove unnecessary editorStyle prop in legacy metadata. (46514)
Extract hook for offcanvas inserted block. (46618)
BlockListAppender: With custom appender, don’t react to nested list settings changes. (46461)
Paste: Reuse file transforms for file pasting. (45891)
Site Editor: Don’t show block inserter when the canvas is view mode. (46763)
Data Layer
Data: Recreate listeningStores set for every markListeningStores call. (46607)
useSelect: Add unit tests for static select mode. (46606)
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. Sidebar
Navigation Sidebar: Hide behind the experiment flag. (46710)
Change SpacingSizesControl ARIA from region to group. (46530)
Global Styles
Inline block preview: Add preview block in nested global style panels. (46401)
Typography
Typography block supports: Sync with 6.1 backportbackportA port is when code from one branch (or trunk) is merged into another branch or trunk. Some changes in WordPress point releases are the result of backporting code from trunk to the release branch.. (43928)
Web Fonts
Change architecture to use Core’s Dependencies API. (43492)
First time contributors
The following PRs were merged by first time contributors:
@gigitux: Block Variation Picker: Adds support to declared icon with src. (46373)
“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/…” posts (labeled with the #gutenberg-newtagtagA 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.)) are posted following every Gutenberg released on a biweekly basis, discovering new features included in each release. As a reminder, here’s an overview of different ways to keep up with Gutenberg and the Site Editor project (Formerly known as Full Site Editing).
Gutenberg 14.8 has been released and is available for download!
With Gutenberg 14.8, the Site Editor interface gets a major overhaul and introduces Browse Mode. It is now easier than ever to navigate through templates and template parts. It’s even possible to add new ones through 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.. The work on this feature is ongoing and will continue to improve as new Gutenberg versions are released. (44770), (45100), (46458)
Introducing the Style Book
Users and designers can view and edit all blocks via the new Style Book feature, which is an extension of the Styles panel in the Site Editor. The interface exposes both coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. and third-party blocks from plugins and are broken down by categoryCategoryThe 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging.. The Style Book provides an overview of all 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. styles in a centralized location while also making it easier to quickly make changes at the global level. (45960).
The Styles panel also offers a preview when customizing individual blocks. (45719)
Add custom CSSCSSCascading Style Sheets. rules for your site
Bringing feature parity with the WordPress 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., you can now add custom CSS via the Styles > Custom panel in the Site Editor. This will allow users and designers to quickly make changes that won’t be overwritten by a theme update. (46141), (46561), (46663) Currently, this is an experimental feature that can be enabled by visiting Gutenberg > Experiments and ticking the Global styles custom CSS checkbox.
Other Notable Highlights
List/quote: Unwrap inner block when pressing Backspace at start
Gutenberg 14.8 will now unwrap inner blocks of the List and Quote blocks when backspacing at the start. This results in the first inner block becoming a Paragraph that is separate from its previous parent List or Quote container. (45075)
Pattern title tooltip
The inserter now shows pattern titles when focused on or hovering an individual pattern preview. These were previously hidden from view and only shown to screen readers. (46419)
Navigation Block Improvements
This release continues to improve on the Navigation block with several changes that are building blocks for future releases. These include adding a location fallback for classic menus and an “open list view” button. The Page List block also has a convert panel when used within a Navigation block. (46426), (45976), (46286), (46335), (46070), (46352)
Changelog
Enhancements
Block Library
Add a current-menu-ancestor class to navigation items. (40778)
Page List Block: Adds a longdash tree to the parent selector. (46336)
Page List Block: Hide page list edit button if no pages are available. (46331)
Page List: Add convert panel to Inspector Controls when within Nav block. (46352)
Page List: Prevent users from adding inner blocks to Page List. (46269)
Reusable block: Pluralize the message “Convert to regular blocks” depending on the number of blocks contained. (45819)
Heading Block: Don’t rely on the experimental selector anymore. (46284)
Media & Text Block: Create undo history when media width is changed. (46084)
Navigation block: Add page list to Link UIUIUser interface transforms in Nav block. (46426)
Navigation block: Add location->primary to fallback nav creation for classic menus. (45976)
Navigation block: Update fallback nav creation to the most recently created menu. (46286)
Navigation block: Add a ‘open list view’ button. (46335)
Navigation block: Removes the 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. from the navigation list view in the experiment. (46070)
Add a CSS style to 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. to allow the setting of custom CSS strings. (46255)
Expose before 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. hook in useSettings for injecting block settings in the editor. (45089)
Global styles: Add a custom CSS panel to the site editor (currently behind an experimental flag). (46141)
Site Editor
Allow adding new templates and template parts directly from the sidebar. (46458)
Synchronize the sidebar state in the URLURLA specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org. (46433)
Try template drill down on the shell sidebar (browse mode). (45100)
Reorganize the site editor to introduce Browse Mode. (44770)
Block Editor
Update the synced block hover styles in Inserter. (46442)
Add new selector getLastInsertedBlockClientId. (46531)
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
Update the Gutenberg plugin to require at least the WP 6.0 version. (46102)
PHPPHPThe web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher: BackportbackportA port is when code from one branch (or trunk) is merged into another branch or trunk. Some changes in WordPress point releases are the result of backporting code from trunk to the release branch. changes from core theme resolver. (46250)
Update: Move gutenberg_register_core_block_patterns from 6.1 to 6.2. (46249)
Upgrade ReactReactReact is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. packages to v18. (45235)
Themes
Empty Theme: Add the $schema property in theme.json and rename template directories. (46300)
Mobile: Updates packages to not use GitGitGit is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. Git is easy to learn and has a tiny footprint with lightning fast performance. Most modern plugin and theme development is being done with this version control system. https://git-scm.com/.HTTPSHTTPSHTTPS is an acronym for Hyper Text Transfer Protocol Secure. HTTPS is the secure version of HTTP, the protocol over which data is sent between your browser and the website that you are connected to. The 'S' at the end of HTTPS stands for 'Secure'. It means all communications between your browser and the website are encrypted. This is especially helpful for protecting sensitive data like banking information. URLs. (46422)
Bug Fixes
Block Library
Fix Nav Submenu block Link UI text control. (46243)
Fix auto Nav menu creation due to page list inner blocks. (46223)
Handle innerContent too when removing innerBlocks. (46377)
Image Block: Ensure drag handle matches cursor position when resizing a center aligned image. (46497)
Navigation Block: Add social link singular to list of blocks to be allowed. (46374)
Page List Block: Fix error loading page list parent options. (46327)
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: Add migrationMigrationMoving the code, database and media files for a website site from one server to another. Most typically done when changing hosting companies. of colors to v2 deprecation. (46522)
Site Logo: Correctly set the image’s natural height and width. (46214)
Strip markup from link label data in inspector. (46171)
Style Book: Clear Global Styles navigation history when selecting a block. (46391)
Global Styles 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/. endpoint: Check custom CSS is included before attempting to validate. (46561)
Reverts the custom CSS to an experiment while we resolve the handling of unfiltered HTMLHTMLHyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. capabilities. (46663)
Block Editor: Add initial view mode in BlockPatternSetup. (46399)
Site Editor
Do not remount 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.. (46431)
Modal: Fix unexpected modal closing in IME Composition. (46453)
MaybeCategoryPanel: Avoid 403 requests for users with low permissions. (46349)
Rich text: Add button to clear unknown format. (44086)
Document Settings
Fix template title in summary panel and requests for low privileged users. (46304)
Permalink: Hide edit field for users without publishing capabilities. (46361)
Patterns
Content lock: Make filter hook namespace unique. (46344)
Layout
Child Layout controls: Fix help text for height. (46319)
Widgets Editor
Shortcuts: Add Ctrl+Y for redo to all editor instances on Windows. (43392)
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.
Block Editor: Fix no-node-access violations in BlockPreview. (46409)
Block Editor: Fix no-node-access violations in BlockSelectionClearer. (46408)
Columns mobile edit: Remove unused updateBlockSettings action bind. (46455)
ESLint: Fix warning in getBlockAttribute documentation. (46500)
List View: Use default parameters instead of defaultProps. (46266)
Removed: Remove small APIs marked to be removed in WP 6.2. (46106)
Site Editor: Remove 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. CSS. (46288)
Block Library
Group Block: Remove placeholder leftovers. (46423)
Inserter: Update mobile tab navigation styles. (46186)
Layout
Clarify inline comment about switching to safecss_filter_attr. (46061)
Tools
Build Tooling
Adds GithubGitHubGitHub is a website that offers online implementation of git repositories that 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/ Action to validate Gradle Wrapper. (46247)
Prevent api-fetch and core-data from being imported in the block editor package. (46302)
Serialize the map objects properly in the Redux dev tools. (46282)
end-to-end tests: Add width and color test to button block. (46452)
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.
Post Editor
Version
Loading Time
KeyPress Event (typing)
Gutenberg 14.8
7.8s
48.14ms
Gutenberg 14.7
6.25s
46.4ms
WordPress 6.1
5.9s
48.04ms
Site Editor
Version
Loading Time
KeyPress Event (typing)
Gutenberg 14.8
3.36s
31.7ms
Gutenberg 14.7
5.47s
34.78ms
WordPress 6.1
5.72s
36.1ms
Kudos to all the contributors that helped with the release! 👏
First time contributors
The following PRs were merged by first time contributors:
