Whatโ€™s new in Gutenberg 22.6? (25 February)

โ€œWhatโ€™s new in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses โ€˜blocksโ€™ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/โ€ฆโ€ 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 Editor.

Whatโ€™s New In
Gutenberg 22.6?

Gutenberg 22.6 has been released and is available for download!

This release brings visual change tracking to in-editor revisionsRevisions The WordPress revisions system stores a record of each saved draft or published update. The revision system allows you to see what changes were made in each revision by dragging a slider (or using the Next/Previous buttons). The display indicates what has changed in each revision. and introduces a brand-new Icon blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience.. The navigation overlay and client-side media processing both graduate from experimental status. Real-time collaboration adds cursor awareness and can now be enabled through a global settings toggle, and the Gallery block now supports lightbox navigation between images.

A total of 388 PRs were merged in Gutenberg 22.6, with 8 first-time contributors!

Table of contents

In-Editor Revisions: Visual Change Tracking

Browsing post revisions in the editor now shows a color-coded visual diff between the selected revision and its predecessor. Added text appears in green with an underline, removed text in red with a strikethrough, and formatting or attribute changes are highlighted with a yellow outline. Entire blocks, added or removed, are outlined in green or red, respectively. Visual change tracking can be toggled off to view clean content. Colors blend with currentColor so they look appropriate across all themes. (75049)

Icon Block

A brand-new Icon block lets you insert SVG icons from a curated library directly into your content. The block is powered by a new server-side SVG Icon Registration APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways., so updates to the icon registry propagate to all uses without block validation errors. A REST endpoint at /wp/v2/icons supports searching and filtering. The initial set draws from the wordpress/icons package, and the architecture is designed for future extensibility including third-party icon registration. (71227, 72215, 75576)

Navigation blocks now have customizable overlays and give user full control over mobile hamburger menus. A prominent โ€œCreate overlayโ€ button guides you through the setup, providing a selection of patterns to achieve a variety of designs for your overlay. The Navigation Overlay feature is no longer experimental, and is available to all users of the pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party.. (74968, 74971, 75564, 75276)

Client-Side Media Processing

Client-side media processing is a feature that leverages the browserโ€™s capabilitiescapability Aย capabilityย is permission to perform one or more types of task. Checking if a user has a capability is performed by the current_user_can function. Each user of a WordPress site might have some permissions but not others, depending on theirย role. For example, users who have the Author role usually have permission to edit their own posts (the โ€œedit_postsโ€ capability), but not permission to edit other usersโ€™ posts (the โ€œedit_others_postsโ€ capability). to process images. This enables the use of more advanced image formats (including AVIF, WebP, and MozJPEG output encoding) and compression techniques (resulting in ~10โ€“15% smaller file sizes with no quality loss for generated JPEG sub-sizes). It also reduces demand on the web server, thus providing smoother media workflows. As of Gutenberg 22.6, client-side media processing has graduated from experimental state to stable feature. (75081, 74910)

Real-Time Collaboration

Real-time collaboration sees a major round of development in this release. A new toggle under Settings > Writing lets you enable the feature, and once active, collaborators editing the same post see each otherโ€™s cursor positions and block selections in real time. A presence indicator in the editor headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitorโ€™s opinion about your content and you/ your organizationโ€™s brand. It may also look different on different screen sizes. shows whoโ€™s currently editing. Under the hood, title, content, and excerptExcerpt An 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. now sync via Y.text for more granular conflictconflict A conflict occurs when a patch changes code that was modified after the patch was created. These patches are considered stale, and will require a refresh of the changes before it can be applied, or the conflicts will need to be resolved. resolution, and numerous reliability fixes address disconnection handling, revision restores, and performance metrics. (75286, 75398, 75065, 75448, 75595)

The Gallery blockโ€™s โ€œEnlarge on clickโ€ lightbox now supports navigation between images. When you click an image in a gallery, back and next buttons let you browse through the rest of the gallery without closing the lightbox. Keyboard navigation with arrow keys and screen reader announcements (โ€œEnlarged image X of Yโ€) are fully supported. Images that donโ€™t have lightbox enabled (e.g., those linked to a file URLURL A specific web address of a website or web page on the Internet, such as a websiteโ€™s URL www.wordpress.org) are skipped during navigation. (62906)

Other Notable Highlights

  • Block visibility enhancements: List View now shows viewport-aware icons with tooltips indicating which viewports a block is hidden on, and hidden blocks get a simplified toolbar. The keyboard shortcut (Cmd+Shift+H / Ctrl+Shift+H) to toggle block visibility options is featured in the block context menu. (75404, 75335, 75334)
  • Notes keyboard shortcut: You can now create a block note with Cmd+Option+M (Mac) or Ctrl+Alt+M (Windows/Linux), and press Escape to cancel. (75287, 75288)
  • Verse block renamed to Poetry: The Verse block is now called Poetry. (74121)
  • QuickEdit stabilized: QuickEdit is now stable and opens as a modal in the Site Editor pages view. (75565, 75173)
  • Text-align block support migrations: Eight blocks (Author Biography, Post Author Name, Post Comments Count, Post Comments Form, Post Comments Link, Post Terms, Post Time to Read, and Term Description) have been migrated to the standardized text-align block support.
  • Enforced iframeiframe iFrame is an acronym for an inline frame. An iFrame is used inside a webpage to load another HTML document and render it. This HTML document may also contain JavaScript and/or CSS which is loaded at the time when iframe tag is parsed by the userโ€™s browser. for the post editor: Please check here for more information. (75475)

Many of these new features will also be included in the upcoming WordPress version 7.0, so you can find more details and testing instructions over at the 7.0 Call for Testing.

Changelog

Features

  • wp-env: Add โ€“config option for custom configuration files. (75087)

Client Side Media

  • Add AVIF, WebP and MozJPEG output encoding support. (75081)
  • Add device/browser capabilitycapability Aย capabilityย is permission to perform one or more types of task. Checking if a user has a capability is performed by the current_user_can function. Each user of a WordPress site might have some permissions but not others, depending on theirย role. For example, users who have the Author role usually have permission to edit their own posts (the โ€œedit_postsโ€ capability), but not permission to edit other usersโ€™ posts (the โ€œedit_others_postsโ€ capability). detection. (75863)
  • Add EXIF metadata tests for Client Side Media. (74909)
  • Fix client-side media file naming. (75817)
  • Media: Graduate client-side media processing from experimental. (75112)
  • Pass unsupported formats directly to the server. (74910)

Block Library

  • New Block: Icon Block. (71227)
  • Remove the Icon Block and Icon SVG API from experiments. (75576)

Interactivity API

  • Export watch from @preact/signalsโ€˜s effect. (75563)

Enhancements

  • wordpress/ui: Add Dialog component. (75183)
  • wordpress/ui: Use semantic dimension tokens. (74557)
  • Abilities: Allow nested namespace ability names (2-4 segments). (75393)
  • Add testsEnvironment option and split Gutenberg wp-env configs. (75341)
  • Adminadmin (and super admin) UIUI User interface: Apply โ€˜text-wrap: Prettyโ€™ to Page. (74907)
  • Commands: Display categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. labels and enforce category icons. (75669)
  • Gutenberg plugin: Always enforce the iframe in the post editor. (75475)
  • Layout: Update Gutenberg to match coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. after #75360 sync. (75594)
  • Media Utils: Auto-select uploaded files in media modal experiment. (75597)
  • MediaEdit: Support ordered values and reordering of items. (75207)
  • Replace install-path command with status command in wp-env. (75020)
  • Theme: Update dimension tokens. (75054)
  • Theme: Update elevation tokens to use abbreviated size names. (75103)
  • UI: Add Textarea primitive. (74707)
  • @wordpress/ui: Add IconButton. (74697)
  • @wordpress/ui: Add Tabs. (74652)
  • iAPI router: Move internal properties to a private store. (70882)
  • ui/IconButton: Make icon always 24px regardless of size prop. (75677)
  • ui/Button: Add min width. (75133)
  • wp-env: Add cleanup command and force flag. (75045)

Block Library

  • Accordion block: Add list view support. (75271)
  • Accordion: Move Accordion icons to Icon library. (75380)
  • Author block: When recreating, migrate the textAlign attribute of the Author block to the block style attribute. (75153)
  • Block Supports: Add Line Indent support using enum setting. (74889)
  • Blocks: Try prepending โ€˜httpsHTTPS HTTPS 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.โ€™ to URLs without protocol. (75005)
  • Breadcrumbs: Improve loading state rendering. (75383)
  • Custom CSSCSS Cascading Style Sheets. support: Add attributes for dynamic blocks. (75052)
  • Default all initial suggested results to 20 for navigation link ui. (75186)
  • Gallery: Add lightbox support. (62906)
  • Gallery: Add list view block support. (75407)
  • Icon block: Skip serialization and increase default size. (75553)
  • Image Block: Handle image URLs without protocol. (75135)
  • Informational Parity between Inspector Link Preview and on Canvas Link Preview. (75399)
  • List View Support: Only render list view on top level block with support. (75166)
  • Migrate multiple blocks to text-align block support:
    • Author Biography. (74997)
    • Post Author Name. (75109)
    • Post Comments Count. (75321)
    • Post Comments Form. (75322)
    • Post Comments Link. (75332)
    • Post Terms. (75545)
    • Post Time to Read. (75541)
    • Term Description. (75542)
  • Navigation Link: Clarify Link To invalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid. and draft states. (74054)
  • Navigation Link: Go to page link and edit page for inspector sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme.. (75262)
  • Navigation Overlay: Add Create Overlay button. (74971)
  • Navigation Overlay: Remove experiment. (74968)
  • Navigation: Improved help on create page flow. (75349)
  • Navigation: Update overlay template part naming to โ€˜Navigation Overlayโ€™. (75564)
  • Pattern Editing and Navigation block: Show navigation controls in popover. (75194)
  • Pattern Editing: Allow click through to List View. (75246)
  • Pattern Editing: Revise โ€˜Edit sectionโ€™ button naming. (75663)
  • Playlist block: Remove border. (75202)
  • Post Excerpt: Add text columns support. (75587)
  • Pre-populate Navigation Page Creator with Search Text. (75154)
  • Rename Verse block to Poetry. (74121)
  • Tabs:
    • Add text and background color support. (75482)
    • Inherit text color for tabs-menu-item blocks. (75621)
    • Polish. (75128)
    • Simplify Tabs Menu Item editing. (75416)
    • Tidy up UI for controls. (75309)
    • Update Tabs block icons. (75376)
  • theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.: Enable width setting for Icon block by default. (75665)

Post Editor

  • Add dedicated navigation-overlay icon (#75249). (75426)
  • Auto-switch viewport based on Overlay Visibility setting when entering overlay editor. (75386)
  • Block Editor: Allow disabling content-only editing for unsynced patterns. (75457)
  • Commands: Add category property to command registration. (75612)
  • Create sub-sized images. (74566)
  • Editor: Introduce new selectedNote editor state. (75177)
  • FilterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. navigation category patterns to only show in navigation-overlay template part context. (75276)
  • In-editor Revisions: Update success notice message. (75411)
  • In-editor revisions: Add visual diffing. (75049)
  • Migrate EditorSnackbar and EditorNotices components to the @wordpress/notices package. (74384)
  • Navigation: Select list view tab on contentOnly. Alternative with explicit solution. (75578)
  • Notes: Add a keyboard shortcut for creating a new note. (75287)
  • Notes: Pressing Escape should cancel adding a note. (75288)
  • Notes: Update shortcut category. (75461)
  • Post Content Block: Improve removal confirmation modal. (75001)
  • Real-time collaboration:
    • Add collaborators cursor awareness. (75398)
    • Add global setting to enable real-time collaboration. (75286)
    • Move PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 7.4 or higher code to compat / backports directory. (75366)
    • Remove block client IDs from Awareness, fix โ€œShow Templateโ€ view. (75590)
  • Set snackbar position to center. (75294)
  • Site Editor Pages: QuickEdit as a modal. (75173)
  • Use contextual snackbar text when activating a theme from preview. (75385)

Block Editor

  • Add URL validation in LinkControl using ValidatedInputControl. (73486)
  • Add block rename keyboard shortcut. (74454)
  • Add getDimensionsClassesAndStyles function and related tests. (74524)
  • Add storybook for ColorPaletteControl. (74425)
  • Block Lock: Disable Apply button on non-dirty state. (75495)
  • Block Support: Allow serialization skipping for ariaLabel. (75192)
  • Block Visibility:
    • Centralize modal state in block-editor store. (75367)
    • Disable Apply button on non-dirty state. (75494)
    • Disable visibility toggle for children of sections. (75447)
    • Show keyboard shortcut in context menu. (75334)
    • Show viewport icons and tooltip in list view for hidden blocks. (75404)
    • Simplify toolbar for hidden blocks. (75335)
  • Cover: Add new โ€œfullheightโ€ icon, and use for Cover. (75240)
  • Enable paragraphs to be added to contentOnly patterns. (73222)
  • Enhance block appender labels to reflect default block type. (71502)
  • Hide parent grid cells when child grid is selected. (75078)
  • Implement WebAssembly support detection and fallbacks. (74827)
  • Improve Background panel UI in Global Styles. (75230)
  • Pattern Editing: Add โ€œEdit sectionโ€ button to unsynced pattern toolbar. (75602)
  • Pattern Editing: Hide List View child blocks in Content panel. (75007)
  • Stabilize PHP-Only Block Registration. (75543)

Site Editor

  • DataForm: Update panel trigger. (75290)
  • DataViews: Add onReset prop for view persistence reset. (75093)
  • Make QuickEdit stable + change template to select. (75565)
  • Prevent welcome guide from appearing during loading. (75102)
  • Quick edit: Make footer sticky. (75297)
  • Unified view persistence: Share one persisted view across all tabs. (74970)

DataViews

  • Add new adaptiveSelect DataForm control. (74937)
  • Consistent rendering of selection checkbox and actions in grid layout. (75056)
  • DataForm: Add edit variant. (75462)
  • DataForm: Mark fields as required or optional automatically. (74430)
  • Dataform: Adds validation support to the DataForm details layout. (74996)

Components

  • DataViews: Use public ColorPicker instead of internal Picker export. (75394)
  • DateCalendar, DateRangeCalendar: Use lighter gray for disabled dates. (75683)
  • ToggleGroupControl: Add visual emphasis to selected item. (75138)
  • [Real-time collaboration] Refine collaborator overlay with AvatarAvatar An 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. component integration. (75595)

Icons

  • Icons Registry: Donโ€™t expose โ€œinternalโ€ icons. (75526)
  • Trim list of public icons further. (75630)
  • Update icon manifest acronyms. (75418)

Media

  • Media Fields: Filter author field to only show authors. (75328)
  • Media Fields: Fix filename field truncation. (75091)
  • Media Modal Experiment: Update preview size to be a little smaller. (75191)

New APIs

  • Real-time collaboration: Remove wordpress/sync from bundled packages and add private APIs. (74671)

Bug Fixes

  • Boot: Fix mobile admin bar covering single-page headers. (75339)
  • DataForm: Fix color picker styles. (75427)
  • Env: Remove non-functional WP_ENV_MULTISITE configuration. (72567)
  • Fields: Fix authorField query. (75298)
  • Fix missed dimension token migrationMigration Moving the code, database and media files for a website site from one server to another. Most typically done when changing hosting companies. in UI package. (75446)
  • Fix undo end-to-end test. (75740)
  • Language Format: Add missing attribute definition. (75422)
  • Media Modal Experiment: Remove default value for allowedTypes so that the file block can accept all types. (75159)
  • Prevent fatal error when the inline CSS duotone variable is an array. (75283)
  • Routing Boot Package: Remove left border from stage and inspector surfaces. (75036)
  • Run generate-worker-placeholders script in dev. (75104)
  • Support zip theme sources in Playground runtime. (75155)
  • Upload Media: Fix upload handling. (75646)
  • WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. Area: Disable renaming and visibility support. (75279)
  • Writing flow: Fix Cmd+A from empty RichText. (75175)
  • iAPI Router: Update cached styles for re-fetched pages. (75097)
  • ui/Button: Fix disabled styles and variable composition. (75568)
  • wp-env Playground: Improve mapping and core source handling. (75527)
  • wp-env:
    • Fix MySQLMySQL MySQL is a relational database management system. A database is a structured collection of data where content, configuration and other options are stored. https://www.mysql.com/. startup race condition causing database connection errors. (75046)
    • Fix mixed runtime detection issues. (75057)
    • Fix status command. (75325)

Block Library

  • Add initialSearchState to avoid console warnings from LinkControl inputValue change. (75643)
  • Border Support: Fix editor split border style fallback. (75546)
  • Comments Link: Fix transforms textAlign. (75676)
  • Cover block: Force LTR direction for the background URL input field. (75169)
  • Featured ImageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts.: Added a fallback to the default value when clearing the aspect ratio control for the Featured Image. (75358)
  • Fix duplicate content when navigation overlay is open and nav has non-link inner blocks. (75180)
  • Fix: Make all Navigation Overlay Close buttons work. (75384)
  • Fix: Show and hook up submenu visibility for Page Lists within Navigation Blocks. (75531)
  • Gallery: Fix PHP warning in random order image reordering. (75678)
  • Gallery: Skip interactivity directives when no images have lightbox enabled. (75680)
  • Group Block: Fix preview display. (75200)
  • Heading Block: Fix preview display. (75675)
  • Hide grid visualiser if the grid block is hidden. (74963)
  • Hide navigation-overlay template parts from inserter. (75478)
  • Icon Block:
    • Corrects style selectors when global styles are set. (75724)
    • Include Icons assets in Plugin ZIP. (75866)
    • Move default width rule to theme.json instead of block.json. (75653)
    • Remove experimental property. (75742)
  • Image block: Add missing space between sentences. (75142)
  • Improve link preview badges. (75318)
  • Media & Text: Respect image_default_link_type option. (74295)
  • Navigation Submenu: Restore openSubmenusOnClick to usesContext for backward compatibility. (75435)
  • Navigation block: Remove horizontal scroll from list view. (75086)
  • Navigation link: Fix resetting link from the tools panel. (75228)
  • Navigation overlay: Fix default pattern contrast issue on dark themes. (74979)
  • Post Excerpt: Disable HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. element insertion. (74928)
  • Pullquote: Fix deprecated block validation when anchor/id attribute is present. (75132)
  • Query: Remove content role from block. (75760)
  • Remove useEffect guard rail to enforce minimum width. (75624)
  • Respect deprecated openSubmenusOnClick value on frontend rendering. (75439)
  • Tab Block: Ensure label formatting works correctly. (75548)
  • Tab: Fixed the color reset to ensure correctness. (75606)
  • Tabs:
    • Fix incorrect fixtures. (75523)
    • Fix saved HTML. (75580)
    • Improve Tab Panel accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both โ€œdirect accessโ€ (i.e. unassisted) and โ€œindirect accessโ€ meaning compatibility with a personโ€™s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility). (75484)
    • Improve tab keyboard nav. (75471)
    • Make Example preview translatable. (75555)
    • Remove name editing UI. (75554)
    • Sanitize tab_id. (75615)

Block Editor

  • Allow grid to use style variation blockGap values for columns calculation. (75360)
  • Allow stable block IDs in block editor store. (74687)
  • Block Bindings: Have block fields panel reflects bound attribute value. (72096)
  • Block editor cross origin isolation: Attempt to gracefully deal with race conditions. (75600)
  • Block transform command: Pass the block icon src rather than a BlockIcon component. (75365)
  • ContrastChecker: Fix check for button block colors. (71959)
  • DOM: Make focus.focusable spec-compliant by excluding inert elements. (75172)
  • Fix Columns block horizontal spacing when setting vertical gap. (75355)
  • Fix LinkControl URL Normalization. (75488)
  • Fix emdashes in HTML anchor description. (75043)
  • Fix error when undoing newly added pattern. (75850)
  • Fix: Changing URL in link after changing text outside the popover resets it. (75342)
  • Link Control: Validate on submit. (75267, 75310)
  • List View tab: Ensure itโ€™s populated when first selecting a container block. (75558)
  • Only show dot divider for parent selector in top toolbar. (75710)
  • Pattern editing: Fix block editing modes when switching back and forth from isolated editing. (75821)
  • Pattern Editing: Fix nested patterns/sections. (75772)
  • Post editor: iframe: Check inserted rather than registered block versions. (75187)
  • Preserve existing URLInput defaults by only using validation component when validity settings are used. (75392)
  • Remove formatting controls restriction private API. (75382)
  • RichText:
    • Remove min-width inline style causing flex layout issues. (75370)
    • Avoid stale active formats when deleting the text. (75227)
    • Fix white space collapsing around formatting. (74820)
  • Synced patterns: Fix block editing mode of synced pattern content when nested in an unsynced pattern. (75818)
  • Writing Flow:
    • Fix block selection from partially selected RichText. (75449)
    • Fix select all with full formatting. (64934)
    • Skip non-empty blocks on arrow key nav. (75141)

Post Editor

  • Add paste logging to writing flow. (73885)
  • Fix Overlay core patterns not showing on design tab. (75618)
  • Fix selection restoration after entity navigation. (75371)
  • In-editor revisions: Preserve client IDs. (75028)
  • Lock save button during Client Side Media processing and uploading. (74951)
  • Notes:
    • Remove block highlight when deleting parent note. (75453)
    • Fix block toolbar click action. (75614)
    • Fix new note creation from the List View. (75566)
    • Fix sidebar display logic for small screens. (75454)
  • Real-time Collaboration: Fix revision restore bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority.. (75233)
  • Restore deprecated Pullquote Block. (75122)
  • [Real-time collaboration] Fix layout issue. (75599)

Components

  • Button: Prevent outline flicker when focused and active at the same time. (75346)
  • ExternalLink: Prevent Twemoji from replacing arrow. (75538)
  • Fix: ISO 8601 compliant year formatting in TimePicker. (75343)
  • Remove โ€œtext-wrap: Balanceโ€ fallback from Text. (75089)
  • Slot: Fix ref forwarding. (75274)
  • Snackbar: Fix scaling issue with snackbars that update their content via a common id. (75709)
  • Tabs: Set explicit font-family on tab buttons. (75537)
  • ToggleControl: Pass full props to the input element. (74956)
  • ToggleControl: Prevent console warning for __nextHasNoMarginBottom. (75296)

Collaboration

  • Add cap check for single taxonomyTaxonomy A taxonomy is a way to group things together. In WordPress, some common taxonomies are category, link, tag, or post format. https://codex.wordpress.org/Taxonomies#Default_Taxonomies. term entities. (75708)
  • Add minimum cap check to sync endpoint. (75681)
  • Always target autosave revision. (75105)
  • Bugfix for CRDT user selection and add tests. (75075)
  • Bugfix: Set the removed users to empty for awareness. (75337)
  • Fix comment syncing on site editor. (75746)
  • Fix entity save call / initial persistence. (75841)
  • Pick user fields instead of spreading the entire object. (75528)
  • Remove disconnected users from Awareness. (75253)
  • Remove IS_GUTENBERG_PLUGIN checks for collaborative editing. (75699)
  • Update diff package. (75644)

DataViews

  • Add title attribute in grid item title field. (75085)
  • DataForm Regular layout: Label always uppercase. (75292)
  • DataViews Filters: Fix styling of long values in filter dropdown. (75369)
  • Fix fields async validation. (74948)
  • Fix title truncation in list layout. (75063)

Icons

  • Fix incorrect attributes for SVG. (75273)
  • Make full height icon label title case. (75524)

Site Editor

  • Prevent QuickEdit modal from being triggered in list layout via URL param. (75300)
  • Refactor activeFilters to activeViewOverrides with date sort for User tab. (75094)

npm Packages

  • Update wordpress/vips in root package.json to use a relative path. (75758)
  • Vips and worker-threads packages: Remove private flag so that packages can be published to npm. (75752)

Accessibility

  • RangeControl: Support forced-colors mode. (75165)
  • Resize metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. box pane without ResizableBox. (66735)

Performance

  • Improve sync performance metrics. (75029)
  • Notes: Donโ€™t trigger reflow for pinned sidebar. (75010)

Block Editor

  • Editor iframe: Memoize src blob URL to prevent unwanted revokes. (75619)
  • Optimize controlled inner blocks state churn. (75458)
  • useBlockSync: Stop reconstructing controlled inner blocks. (75562)

Block Library

  • Media & Text: Fix RTLCSS control directives appearing in production CSS. (73205)
  • Post Terms: Avoid unbound queries when the post context isnโ€™t available. (75536)
  • Core Data: Create icons entity. (75773)

Experiments

  • Add useBlocker to private APIs for enhanced routing control. (75687)
  • Playlist block. (50664)
  • Real-time Collaboration: Fix broken unit tests for awareness. (75362)
  • SVG Icon registration API. (72215)

Collaboration

  • Add collaborators presence UI. (75065)
  • Add hook for accessing awareness data. (75009)
  • Add sync connection status handling. (75066)
  • Add tests for the awareness code in core-data. (75074)
  • Add tests for the awareness code in sync. (75077)
  • Compact on request with encodeStateAsUpdate. (75682)
  • Fix auto draft bug for Y.text titles. (75560)
  • Import Yjs correctly in core-data. (75500)
  • Sync post content and undefined blocks value. (75437)
  • Update the y-protocols version and remove the unnecessary diff types. (75657)
  • Use Y.text for title, content and excerpt. (75448)

Documentation

  • Clarifies cherry-picking permissions and improves minor releaseMinor Release A set of releases or versions having the same minor version number may be collectively referred to as .x , for example version 5.2.x to refer to versions 5.2, 5.2.1, 5.2.3, and all other versions in the 5.2 (five dot two) branch of that software. Minor Releases often make improvements to existing features and functionality. workflow documentation. (75034)
  • wordpress/theme: Add missing CHANGELOG entries. (75281)
  • Components: Add usage guidance for agents and Storybook. (74815)
  • Core Block Reference: Fix object empty inner key processing. (75391)
  • Design System: Add guidelines for save and submit UXUX User experience. (74811)
  • Docs: Add missing global documentation in block library. (75004)
  • Docs: Remove private GitHubGitHub GitHub 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 by the repository owner. https://github.com/ team links in repository management. (75255)
  • Docs: Rename Interactivity APIโ€™s โ€˜API Referenceโ€™ to โ€˜Directives and Storeโ€™. (74974)
  • Docs: Simplifying Gutenberg versions table. (75209)
  • Fix awareness timeout documentation unit. (75284)
  • Fix: Navigation Overlay Close Block: Add missing since tagtag A 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.) #75247. (75250)
  • Real-time collaboration: Update โ€˜sync.providersโ€™ filter inline comments. (75248)
  • Removed Unused Global Documentation. (75631)
  • Scripts: Fix contributor guide link in README. (75161)
  • Storybook: Add Stories for LetterSpacingControl component. (73480)
  • Storybook: Fix missing props on certain components. (75316)
  • Storybook: Preserve export order for stories. (75295)
  • Tabs: Add @since 7.0.0 annotations. (75521)
  • Theme: Fix gap token migration guide in changelog. (75492)
  • Theme: Render default density selector last in design tokens CSS. (75474)
  • Updated Typo in template-activate file. (75333)

Code Quality

  • Cleanup: Remove unnecessary array check in WP_Theme_JSON_Gutenberg. (75515)
  • Code Modernization: Replace isset() checks with null coalescing operator. (75425, 75419, 75487)
  • Core Data: Improve blocks cache in useEntityBlockEditor. (75400)
  • Docs: Add missing global documentation in rtl.php and meta-box.php. (75082)
  • Generate manifest PHP file based on JSON file. (75684)
  • Move experimental PR out of backportbackport A 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. log. (75465)
  • Navigation overlay: Added basic end-to-end tests. (75581)
  • Private APIs: Remove duplicate @wordpress/ui entry. (75051)
  • Remove backport changelog committed by mistake. (75441)
  • Remove the ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. Native test status badges. (74674)
  • Restrict base-ui imports outside of UI component packages. (75143)
  • Select: Remove unnecessary jest.setTimeout from test. (75444)
  • Types: Consistently use the React namespace. (75499)

Block Library

  • Deprecate โ€˜Post authorโ€™ block. (55352)
  • Navigation: Consolidate SVG rendering functions to a shared helper. (74853)
  • Optimize tabsList computation with useRef for comparison. (75219)
  • Playlist block: Inherit more CSS. (75256)
  • Remove temp nav files. (75061)
  • Remove unnecessary block deprecation from experimental tabs. (75208)
  • Storybook: Always load design tokens in Design System section. (74899)

Block Editor

  • Add l10nL10n Localization, or the act of translating code into one's own language. Also see internationalization. Often written with an uppercase L so it is not confused with the capital letter i or the numeral 1. WordPress has a capable and dynamic group of polyglots who take WordPress to more than 70 different locales. context to โ€˜Manage allowed blocksโ€™ string. (75239)
  • PHP-Only Block Registration: Remove client-side schema validation. (75623)
  • Pattern Editing: Add comments for expandRevision functionality. (75573)
  • Pattern Editing: Move List View selectors to private-selectors. (75414)
  • The insertBlock(s) actions should receive the same arguments. (75197)
  • useBlockVisibility: Consolidate and remove unnecessary useMemo calls. (75120, 75125)

Components

  • Prefix usages of JSX namespaces with React.JSX. (75508)
  • Story types: Fix StoryFns used as React components. (75472)
  • UI: Remove Box component abstraction. (74986)
  • Update Ariakit packages. (75620)
  • Update dependencies and types for React 19 compatibility. (75324, 75340, 75567)
  • useRef: Always supply initial value. (75513)

Post Editor

  • Notes: Use preferences store when applicable. (75008)
  • Real-time Collaboration: Change users to collaborators. (75237)
  • Real-time collaboration: Fix type imports. (75232)
  • Real-time collaboration: Make the collaborators presence button translatable. (75252)
  • Remove deprecated __nextHasNoMarginBottom prop. (75139)
  • RichText: Move useFormatTypes to rich-text package. (75387)
  • useMergeRefs: Migrate to TypeScript. (75569)

DataViews

  • DataForm: Style SummaryButton in panel layout with is-disabled classname. (75470)
  • Externalize theme stylesheet. (75182)

Collaboration

  • Move AwarenessState to wordpress/core-data. (75216)
  • Real-time collaboration: Update and unpin sync package dependencies. (75059)

Tools

  • AGENTS.md: Add CLAUDE.md symlinks, architecture decisions, and common pitfalls. (75507)
  • Duotone: Add sgomes as owner. (75519)
  • Real-Time Collaboration: Add end-to-end tests for RTC. (75598)

Testing

  • Add end-to-end test for loading settings in site editor preload spec. (75661)
  • Add end-to-end test for selection restoration after pattern navigation. (75575)
  • Add unit testunit test Code 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. for gap in block style variations fix. (75038)
  • Navigation: Add โ€˜expectedDeprecatedโ€™ annotations. (75659)
  • Update Navigation block tests to use non-deprecated API. (75660)
  • Update navigation block tests to use gutenberg version of block_core_navigation_block_tree_has_block_type. (75673)
  • Upgrade Playwright to v1.58. (75632)
  • Workflows: Ignore icons manifest for manual backports. (75245)

Build Tooling

  • Add timestamp when publishing next versions. (75293)
  • Build: Add vendorScripts configuration to build packages from node_modules. (74343)
  • Fix dev build for fresh checkouts (or with build/scripts/block-library missing). (75108)
  • GitHub actions: Exclude lib/theme.json from backport changelog check. (75666)
  • Infrastructure: Add storybook to tsconfig project references. (74887)
  • Publishing packages: Fix next timestamp. (75301)

First-time contributors

The following PRs were merged by first-time contributors:

  • @Abmarne: Fix: Navigation Overlay Close Block: Add missing since tag #75247. (75250)
  • @anandrajaram21: Storybook: Add Stories for LetterSpacingControl component. (73480)
  • @czarflix: DataForm: Mark fields as required or optional automatically. (74430)
  • @davidabowman: [Real-time collaboration] Refine collaborator overlay with Avatar component integration. (75595)
  • @gmjuhasz: Media & Text: Fix RTLCSS control directives appearing in production CSS. (73205)
  • @lsarsfield: wp-env: Fix MySQL startup race condition causing database connection errors. (75046)
  • @Marianne380: Navigation Submenu: Restore openSubmenusOnClick to usesContext for backward compatibility. (75435)
  • @Swoyamjeetcodes: Add getDimensionsClassesAndStyles function and related tests. (74524)

Contributors

The following contributors merged PRs in this release:

@aaronrobertshaw @Abmarne @adamsilverstein @aduth @alecgeatches @amitraj2203 @anandrajaram21 @andrewserong @annezazu @bernhard-reiter @czarate @czarflix @DAreRodz @davidabowman @ellatrix @fabiankaegy @fcoveram @getdave @gigitux @gmjuhasz @ingeniumed @isabel_brison @jameskoster @jeryj @joen @johnbillion @jorgefilipecosta @jsnajdr @juanfra @juanmaguitar @lsarsfield @luisherranz @madhudollu @Mamaduka @manhphuc @manzoorwanijk @Marianne380 @maxschmeling @mciampini @mcsf @mikachan @mirka @Mustafabharmal @noruzzaman @ntsekouras @oandregal @onemaggie @pkevan @poena @ramonopoly @saranshsinhaa @scruffian @senadir @sethrubenstein @sgomes @shailu25 @shekharnwagh @shimotomoki @simison @SirLouen @Soean @stokesman @Swoyamjeetcodes @talldan @timse201 @tyxla @welcher @westonruter @wildworks @xavilc @yashjawale @youknowriad


Props to @joen for the visuals, and to @bph for reviewing the post.

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

Whatโ€™s new in Gutenberg 22.5? (04 February)

โ€œWhatโ€™s new in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses โ€˜blocksโ€™ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/โ€ฆโ€ 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 Editor.

Whatโ€™s New In
Gutenberg 22.5?

Gutenberg 22.5 has been released and is available for download!

It brings practical refinements for your editing workflow. You can now add custom CSSCSS Cascading Style Sheets. to individual blocks, and the Image blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. shows aspect ratio controls for wide and full alignments. List View gets more useful with full block titles and actual content displayed for list items. The release also stabilizes viewport-based block visibility and pattern editing, plus adds focal point controls for fixed Cover backgrounds and text column support for Paragraphs.

Table of contents

Custom CSS Support for Individual Blocks

Gutenberg 22.5 brings custom CSS support for individual block instances, letting you write styles that target specific blocks without affecting others of the same type. A has-custom-css class is automatically added in both the editor and frontend for dynamic blocks, making your custom styles easier to manage. If youโ€™ve been working around this limitation with extra wrapper blocks or global CSS, your workflow just got simpler. (73959, 74969)

Screenshot showing block-level custom css box

Image Block: Aspect Ratio Control for Wide and Full Alignment

The Image block now shows aspect ratio controls when you choose wide or full alignment. Previously, aspect ratio options only appeared for default-aligned images, a limitation when designing hero sections or full-width layouts. Now you can lock in your preferred proportions regardless of alignment, giving you more consistent control over how images display across different screen sizes (74519)

Illustration of controling image aspect ratio for wide and full widths

List View Improvements

Two enhancements make List View considerably more useful in this release. Youโ€™ll now see full block titles instead of truncated labels, and List Items display their actual content rather than generic โ€œList Itemโ€ text. When youโ€™re navigating complex documents with nested lists, these small changes make a real differenceโ€”you can finally tell your list items apart at a glance (74798, 74794)

Other Notable Highlights

  • Cover Block: Focal point picker for fixed backgrounds: You can now set a focal point even when using fixed/parallax backgrounds (74600).
  • Paragraph Block: Text column support: Paragraphs can now flow into multiple columns directly via block supports (74656).
  • Navigation: Submenus always open option: A new toggle lets you keep submenus permanently expanded rather than requiring hover/click (74653).
  • In-editor revisionsRevisions The WordPress revisions system stores a record of each saved draft or published update. The revision system allows you to see what changes were made in each revision by dragging a slider (or using the Next/Previous buttons). The display indicates what has changed in each revision. (initial implementation: Early groundwork for viewing revisions directly in the editor, though without โ€œdiffingโ€ yet (74771).

Changelog

Enhancements

Block Library

  • Add custom CSS support for individual block instances. (73959)
  • Add theย has-custom-cssย class name to the editor and dynamic blocks. (74969)
  • Allow for themes to define the overlay attribute without using a theme slug. (74119)
  • Breadcrumbs Block:
    • Show custom block name. (73690)
    • Add example block previews. (74808)
  • Comment Date: Add textAlign Support. (74599)
  • Comment Edit Link: Migrate to text-align block support. (74720)
  • Comment Reply Link: Migrate to text-align block support. (74760)
  • Comments Title: Migrate to text-align block support. (74945)
  • Cover Block: Enable focal point picker for fixed background. (74600)
  • Enhance Term List block: Pre-select current term on term archive pages. (74603)
  • Handle deleted navigation overlays. (74766)
  • Image block: Show aspect ratio control for wide and full alignment. (74519)
  • List Item: Show content instead of block name in List View. (74794)
  • Navigation Overlay:
    • Add sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. preview. (74780)
    • Insert default pattern on creation. (74650)
    • Update overlay control labels. (74690)
    • Default new blocks to โ€œalwaysโ€ show overlays. (74890)
  • Navigation overlay patterns:
    • Centered navigation with info. (74862)
    • Centered navigation. (74861)
    • Overlay with accent background. (74849)
    • Overlay with black background. (74847)
  • Navigation:
    • Add a new option that toggles submenus always open. (74653)
    • Donโ€™t use a nav tagtag A 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.) for navigation blocks inside overlays. (74764)
  • Paragraph: Add text column support. (74656)
  • Verse Block: Add new textAlign support. (74724)
  • Feat/coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. tabs restructure. (74412)
  • Stabilise viewport based block visibility. (74839)

Block Editor

  • Block visibility:
    • Refactor metadata to use nested structure. (74602)
    • Create selectors for block visibility in current viewport (device setting or responsive). (74517)
    • Render blocks when hidden at all viewports (and other changes). (74679)
  • Inserter Component: Improving Stories. (74922)
  • List View support: Show full block titles. (74798)
  • MediaReplaceFlow: Move Reset option to bottom of menu. (74882)
  • Try storing global styles in static var in layout render. (74828)
  • Pattern editing: Stabilize and remove the experiment flag. (74843)

DataViews

  • Add card form layout validation. (74547)
  • Include totals items count in DataView footer. (73491)
  • MediaEdit: Supportย customย validation. (74704)
  • Show validation errors when a panel closes. (74995)
  • Add content element guidelines for fields in DataForm. (74817)

Components

  • DataForm: Addย comboboxย control. (74891)
  • UIUI User interface: Addย Selectย primitive. (74661)
  • Addย Tooltipย component toย @wordpress/ui. (74625)
  • Consolidate border tokens. (74617)
  • Design System: Add guidelines for destructive actions UXUX User experience. (74778)

Post Editor

  • In-editor revisions (initial changes, without diffing). (74771)

Icons

  • Add missing chevron-up-small icon. (74607)

Collaboration

  • Real-time collaboration: Add default HTTPHTTP HTTP is an acronym for Hyper Text Transfer Protocol. HTTP is the underlying protocol used by the World Wide Web and this protocol defines how messages are formatted and transmitted, and what actions Web servers and browsers should take in response to various commands. polling sync provider. (74564)
  • Real-time collaboration: Sync collections. (74665)
  • Real-time collaboration: Use relative positions in undo stack. (74878)

Bug Fixes

  • Core backportbackport A 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. for gutenberg_filter_global_styles_post: Protect from KSES mangling. (74731)
  • DataForm: Sync ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/.-level validation to native inputs on date fields. (74994)
  • DataViews: Use regular casing for bulk selection count. (74573)
  • Fix typo in comment for value change check. (74730)
  • Fix wp-theme dependencies in the build. (74743)
  • Remove the apiFetch named export. (74761)
  • ShortcodeShortcode A 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.: Fix non-string attribute values being silently dropped. (74949)

Block Library

  • Breadcrumbs: Fix placeholder separator preview. (74842)
  • Cover Block: Show current embed URLURL A specific web address of a website or web page on the Internet, such as a websiteโ€™s URL www.wordpress.org in dialog. (74885)
  • Embed: Fix Flickr double-padding with responsive wrapper. (73902)
  • Fix : Image caption blur in Gallery block. (74063)
  • Fix: Add border-box sizing for verse block. (74722)
  • Inspector tabs: Reset tab selection if the selected tab is no longer present. (74682)
  • Make custom navigation overlay full width. (74559)
  • Media & Text: Revert โ€œFixed Media & Text Block โ€“ Image not rendered properly on frontend when inside stack (#68610)โ€. (74715)
  • Pattern Editing: Update template part to use tabs. (74793)
  • Post ExcerptExcerpt An 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. Block: Fix excerpt trimming logic to handle whitespace correctly. (74925)
  • Post Excerpt Block: Fix length limits for both Editor and Front and fix ellipsis consistency. (74140)
  • Show submenu colors but remove the word overlay. (74818)
  • fix: Video block: video URLs pasted without โ€œhttps://โ€ show broken media. (74964)

Block Editor

  • Allow grid layout to use theme blockGap values for columns calculation. (74725)
  • Block Editor Provider: Fix editor error for contributor role when client-side media experiment is active. (74680)
  • Direct drag: Fix glitching around scrolling. (74608)
  • Ensure grid column never exceeds parentโ€™s width. (74795)
  • Fix missing onClose prop for InserterMenu. (74920)
  • Fix: Fit Text not working on calculated line heights. (74860)
  • Fix: Safari โ€œEdit as HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers.โ€ for Fit Text deletes content. (74864)
  • Fix: Stretchy text issue when nested on flex containers. (73652)
  • List View: Ensure element exists in document before focusing. (74613)
  • Pattern Editing: Prevent double-click editing for template parts and synced patterns. (74755)
  • Calculate viewport based on iframeiframe iFrame is an acronym for an inline frame. An iFrame is used inside a webpage to load another HTML document and render it. This HTML document may also contain JavaScript and/or CSS which is loaded at the time when iframe tag is parsed by the userโ€™s browser. size in resizable editor. (75156)

Collaboration

  • Real-time collaboration: Do not wrap persisted doc applied update in transaction. (74753)
  • Real-time collaboration: Pass non-cleaned (but merged) edits toย SyncManager#update. (74912)
  • Sync: Refactor ProviderCreator signature to an object. (74871)

Interactivity APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways.

  • iAPI Router: Fix initial router regions withย attachToย being duplicated afterย navigate(). (74857)
  • iAPI Router: Prevent router regions withย data-wp-keyย from being recreated on navigation. (74750)
  • iAPI: Fix and refactor runtime initialization logic. (71123)

DataViews

  • Fix actions visibility on smaller viewpoints and for lone action with isPrimary as true. (74836)
  • Fix insert left and right handling in table layout for RTL languages. (74681)

Components

  • Addย @types/reactย to dependencies. (74692)
  • Fix: Escape less-than character in HTML attributes to prevent block recovery errors. (74732)

Patterns

  • Restore pattern categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. actions for user patterns. (74927)

Typography

  • Fix: Canโ€™t disable textColumns UI. (74767)

Block Style Variations

  • Fix blockGap styles not working in block style variations. (74529)

Global Styles

  • Core backport for Global Styles: Allow arbitrary CSS, protect from KSES mangling. (74371)
  • Remove comment about non-existing property. (75003)

Performance

  • Enable build-blocks-manifest by default. (74846)
  • Update performance results endpoint to codevitals.run. (74802)
  • Use fetch API for performance results logging. (74803)

Experiments

  • Route: Add notFound to public API and add route validation. (74867)

Media

  • Media Modal Experiment: Add a simple notices-based uploading state. (74965)

Collaboration

  • Real-time Collaboration: Add user and selection information to awareness. (74728)

Post Editor

  • Media Editor: Add a simple media editor package and integrate into the editor package. (74601)

Block Library

  • Donโ€™t show overlay settings for navigation blocks that are inside othโ€ฆ. (74408)

Documentation

  • Added Missing Global Documentation class-wp-rest-block-editor-settings-controller file. (74973)
  • Added Missing Global Documentation extensibleExtensible This is the ability to add additional functionality to the code. Plugins extend the WordPress core software.-site-editor file. (74868)
  • Badge: Use stories for โ€œChoosing intentโ€ doc. (74675)
  • DataViews: Update storybook to add more context. (74819)
  • Docs: Add missingย @returnย tags to experimental functions. (74960)
  • Docs: Standardize use ofย @linkย tag for URL references in lib directory. (74984)
  • Pattern Overrides: Remove obsolete documentation. (74749)
  • Replaceย @seeย withย @linkย for URL references in Inline Documentation. (74961)
  • Storybook: Automate sidebar sort order. (74672)
  • Update wp-build documentation to describe โ€˜wpPlugin.nameโ€™. (74741)
  • Updated Typo in Rest APIREST API The REST API is an acronym for the RESTful Application Program Interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data. It is how the front end of an application (think โ€œphone appโ€ or โ€œwebsiteโ€) can communicate with the data store (think โ€œdatabaseโ€ or โ€œfile systemโ€) https://developer.wordpress.org/rest-api/. File. (74718)
  • iAPI Docs: Add configuration to state/context guide. (71355)
  • iAPI: Donโ€™t use deprecatedย data-wp-on-asyncย in documentation. (72591)
  • iAPI: Update deprecation warning for unique ID format. (74580)
  • Move grid manual mode sync into 7.1 folder. (74792)
  • Update: Preserve additional metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. properties on client side abilities. (73918)

Code Quality

  • core-data: Fix missing dependencies. (74934)
  • core-data: Fix yjs import and missing dependency. (74950)
  • dataviews: Fix missing dependency โ€“ @storybook/addon-docs. (74935)

Block Library

  • Comments Title: Copy deprecate from block.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML. to deprecated.js to avoid legacy attribute usage. (74924)
  • Move selectLabelText to shared utility. (74805)
  • Move useIsDraggingWithin to a shared hook. (74804)

DataViews

  • Adjust table primary media field styles. (74813)
  • Move filtering logic in field types. (74733)

Components

  • Addย displayNameย to the anonymous components. (74716)
  • SlotFill: Unify registry and fill implementation. (68056)

Block Editor

  • Block Visibility: Fix failing unit testunit test Code 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.. (74840)

Post Editor

  • Blocks: Always trigger borwser console warnings for blocks with apiVersion below 2. (74057)

Tools

Testing

  • Block Visibility: Fix flaky end-to-end test. (74931)
  • Fix end-to-end tests: Update function names to include wp_ prefix. (74688)
  • Fix flaky โ€˜Revisionsโ€™ end-to-end test. (75002)
  • Real-time collaboration: Fix undo tests. (74955)
  • e2e: Fix flaky tests for settings sidebar. (74929)
  • end-to-end tests: Bump all test blocks to API v3. (74941)
  • end-to-end tests: Removeย switchToLegacyCanvasย from multi select and a11yAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both โ€œdirect accessโ€ (i.e. unassisted) and โ€œindirect accessโ€ meaning compatibility with a personโ€™s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) suite. (74845)
  • end-to-end tests: Remove switchToLegacyCanvas from inserter drag and drop tests. (74892)
  • eslint-pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party.: Add โ€œneverโ€ option for dependency-group rule. (74990)
  • selectBlock: Fall back to next block if no previous block is present. (74938)

Build Tooling

  • Build script: Increase memory limit for storybook build process. (74933)
  • Build: Deduplicate and minify embedded styles. (74651)
  • Icons: Add a manifest containing icons metadata. (74943)
  • Remove react-refresh bundling. (74721)
  • Storybook: Fix missing props from component stories. (74807)
  • wp-env: Add experimental WordPress Playground runtime support. (74609)
  • Create Block: Simplify blocks-manifest registration. (74647)
  • Remove legacy babel plugins. (74916)

First-time contributors

The following PRs were merged by first-time contributors:

  • @gmjuhasz: Components: Add @types/react to dependencies. (74692)
  • @ItsYash1421: Post Excerpt Block: Fix length limits for both Editor and Front and fix ellipsis consistency. (74140)
  • @Mustafabharmal: Fix: Escape less-than character in HTML attributes to prevent block recovery errors. (74732)
  • @noruzzamans: Added Missing Global Documentation class-wp-rest-block-editor-settings-controller file. (74973)
  • @Shekhar0109: Fix: Add border-box sizing for verse block. (74722)
  • @shekharnwagh: Sync: Refactor ProviderCreator signature to an object. (74871)
  • @Swanand01: fix: Video block: video URLs pasted without โ€œhttps://โ€ show broken media. (74964)
  • @Swoyamjeetcodes: Image block: Show aspect ratio control for wide and full alignment. (74519)

Contributors

The following contributors merged PRs in this release:@aduth @alecgeatches @andrewserong @annezazu @chriszarate @DAreRodz @dinhtungdu @ellatrix @fabiankaegy @gmjuhasz @hbhalodia @huzaifaalmesbah @ingeniumed @ItsYash1421 @jameskoster @jasmussen @jeryj @jonathanbossenger @jorgefilipecosta @joshualip-plaudit @JosVelasco @jsnajdr @luisherranz @MaggieCabrera @Mamaduka @manzoorwanijk @mcsf@mikachan @mirka @mtias @Mustafabharmal @noruzzamans @ntsekouras @oandregal @ockham @pkevan @prasadkarmalkar @ramonjd @retrofox @rilwis @scruffian @senadir @sethrubenstein @shail-mehta @Shekhar0109 @shekharnwagh @shimotmk @simison @SirLouen @sirreal @Swanand01 @Swoyamjeetcodes @t-hamano @talldan @tellthemachines @Vrishabhsk @youknowriad


Props for visuals to @joen, @sirlouen and @josvelasco for reviewing the post.

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

Planning for 7.0

With 6.9 out in the world, our collective attention has already turned to 7.0. Core contributorsCore Contributors Core contributors are those who have worked on a release of WordPress, by creating the functions or finding and patching bugs. These contributions are done through Trac. https://core.trac.wordpress.org., together with Matt and Mary, had a call to discuss ideas and projects. There was shared excitement about this release, even if itโ€™s just another number. This post acts as a gathering point for contributors to share what they are starting to work on and to find known areas they can contribute to. There will be another more tactical follow up with release schedule and responsibilities, this one is about the initial scope.

How to interact with this post

Please do not use this as a spot to request folks to work on features. GitHubGitHub GitHub 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 by the repository owner. https://github.com/ and TracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. are the best places to share feedback, talk about impact, and advocate for issues.ย 

Please use this post to share what you are working on, including areas youโ€™d like to help with that may be listed here, as well as areas that you are working on that are not. Items with TBD indicate areas where contributors are needed so please comment below if youโ€™re keen to work on those pieces.

If you were planning to work in an area listed below and donโ€™t see your name, please be sure to comment as well and itโ€™ll be updated. Itโ€™s intentional that this post is meant to be a place to shore up who is working on what out in the open at this early stage.

Also note this is neither comprehensive nor yet a commitment that all of these things will be part of 7.0, since many are in early stages and may not make this release. Items marked with โœ… mean the work is already merged in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses โ€˜blocksโ€™ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ or trunktrunk A 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..

Collaborationย 

The project is getting deeper into Phase 3: Collaboration. Notes was a highlight feature in WP6.9 and thereโ€™s several improvements already planned to make it even more powerful and resilient.

Real time collaboration

  • Link: GitHub issue
  • Key considerations:
    • Thereโ€™s been a lot of progress in defining the UIUI User interface and the diffing mechanics for reconciling changes. Itโ€™s in very good shape and needs to be reviewed and tested diligently, especially around compatibility with third-party blocks and plugins.
    • This feature has a stronger dependency on server support and infrastructure than usual WordPress features, so there needs to be a definition of whatโ€™s the baseline experience shipping in WordPress (for example, peer-to-peer with 1 or 2 connections) and how it can be augmented, either by WP.org, hosting providers, or plugins.
  • Contributors: @acicovic, @aduth, @alecgeatches, @czarate, @ingeniumed, @jsnajdr, @maxschmelingkc, @paulkevan, @shekharnwagh, @youknowriad

Notes i2

  • Link: GitHub issue
  • Key considerations:
    • Support partial selection inside blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. rich text fields.
    • A โ€œsuggestionsโ€ mode and interface that allows Notes to refer to specific content within a block and apply the suggestions.
    • Support for multi-block notes.
    • Add rich text support in the comments.
    • Develop a dashboard widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. for recent notes.
    • More notification options (responses, follow a note, mentions).
  • Contributors: @adamsilverstein, @jeffpaul, @mamadukaย 

Adminadmin (and super admin)

Improving screens across wp-admin

  • Link: TBD
  • Key considerations:
    • Explore CSS improvements that can modernize the look and feel. For example, consider making the โ€œmodernโ€ admin color scheme the default.
    • Admin bar and editor โ€œsite hubโ€ improvements. Make the W menu item filterable. Possibly start work as an experiment in Gutenberg.
    • Consider a โ€œThis time last yearโ€ widget for bloggers.
    • Bring grid layout customization to dashboard experience or other screens. (Possible widgets at the top of comments, etc).
  • Contributors: TBD, @fabiankaegy, @karmatosed, @mcsf

DataViews and DataForms iterations

  • Link: 7.0 iteration issue
  • Key considerations:
    • DataForms/QuickEdit/Document inspector design iterations.
    • Hierarchical post visualization.
    • Make DataViews screens extensibleExtensible This is the ability to add additional functionality to the code. Plugins extend the WordPress core software. in the site editor (templates, pages, etc).
  • Contributors: @oandregal

Design System

  • Link: GitHub issue
  • Key considerations:
    • Components are already being worked on in wordpress/ui.
    • โœ… Theming system with design tokens using wordpress/theme.
    • Start replacing key parts of the editor UI with improved components (tabs, flyout menus).
  • Contributors: @0mirka00, @aduth, @jsnajdr, @mciampini, @wildworks

Font library admin section

  • Link: Github issue
  • Key considerations:
    • โœ… Support for block themes.
    • Support for hybrid/classic themes.
  • Contributors: @youknowriad

RevisionsRevisions The WordPress revisions system stores a record of each saved draft or published update. The revision system allows you to see what changes were made in each revision by dragging a slider (or using the Next/Previous buttons). The display indicates what has changed in each revision.ย 

  • Link: GitHub issue
  • Key tasks:
    • Rethink the revisions interface to be more modern, intuitive, and work with blocks.
    • Show visual diffs.ย 
    • Bonus: potentially tie in with collaborative editing, suggestions, and undo management.
  • Contributors: @adamsilverstein

Customizable Keyboard Shortcuts

  • Link: Github issue
  • Key considerations:
    • Build with design system components.
  • Contributors: TBD

APIs

Abilities & Workflows APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways.

Upgrade to ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. 19

  • Link: Github issue
  • Key considerations:
    • Thereโ€™s a path for the block editor in the mobile apps that should remove this dependency blockerblocker A bug which is so severe that it blocks a release..
    • Ecosystem impact.
  • Contributors: @aduth @jsnajdr @mamaduka @ralucastnย @tyxla

Block API: Add validation levels

  • Links: Github issue with initial PRย 
  • Key considerations:
    • The scope of this issue is to drastically reduce the amount of times a user sees a โ€œthis block is brokenโ€ message.
    • Impact on block API.
  • Contributors: @matvebย @mcsf @youknowriad

Enforced iframed editor

  • Link: GitHub issue.
    • Backwards compatibility, extended testing.
    • โœ… MigrationMigration Moving the code, database and media files for a website site from one server to another. Most typically done when changing hosting companies. guide.
  • Contributors: @ellatrix, @wildworks

WP client AI API

  • Link: GitHub project
  • Key considerations:
    • An AI client and API for WordPress to communicate with any generative AI models of various capabilitiescapability Aย capabilityย is permission to perform one or more types of task. Checking if a user has a capability is performed by the current_user_can function. Each user of a WordPress site might have some permissions but not others, depending on theirย role. For example, users who have the Author role usually have permission to edit their own posts (the โ€œedit_postsโ€ capability), but not permission to edit other usersโ€™ posts (the โ€œedit_others_postsโ€ capability). using a uniform API.
    • Integration with Abilities API.
    • Strictly no providers included in coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress..
    • Decide nomenclature.
    • Ideally, the minimum PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 7.4 or higher version has to be bumped from PHP 7.2.
  • Contributors: @flixos90 @jason_the_adams

Creating blocks and patterns on the server

  • Link: GitHub issue
  • Key considerations:
    • Most of the tools for a pretty straightforward PHP-only representation of blocks and patterns, including bindings, are ready.
    • Declarative block attributes and form components.
    • Pattern creation and syntax that allows easy construction of blocks and bindings.
  • Contributors: @priethor, TBD

wordpress/build and routing (site editor)

  • Link: GitHub issue; Scripts issue
  • Key considerations.
    • Add extensibility to site editor routing.
    • Dependency on standalone font library.
    • Refactor the site editor to allow pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. authors to add their pages there.
    • โœ… Opinionated build tool for plugins.
    • Update Gutenberg โ€“ Core backportbackport A 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. flow.
  • Contributors: @youknowriadย 

Shortblocks

Block bindings iterations


A series of improvements were identified to simplify the navigation workflow and make the experience of managing menus more intuitive and straightforward.

Simpler navigation editing

Ability to customise โ€œmobileโ€ overlayย 

  • Link: GitHub issue
  • Key considerations:
    • Implemented as a template part.
    • Ability to customize when the overlay appears (breakpoint settings) just for navigation overlay.
  • Contributors: @get_dave, @jeryj

Customization

Over the past couple years weโ€™ve been iterating on a series of related systems with the hope of arriving at a more streamlined editing experience of composite blocks and design patterns. We have some solid directions sketched out that are looking promising.

Explore more intuitive page navigation in the site editor

  • Link: TBD
  • Key considerations:
    • Modify the title bar to display a pages dropdown instead of empty command palette. List the pages used in the primary menu with a link to โ€œbrowse all pagesโ€. Exploration.
    • Add next/previous page links in zoomed-out view, similar to a carousel. See a preview in a zoomed out state with arrows next to preview or title bar. Exploration.
  • Contributors: @ellatrix

Pattern Editing (aka ContentOnly)

Improve template management

Responsive editing mode

Block supports and design tools:ย ย 


Blocks

Keeping the momentum on adding new blocks and new block tools to expand the palette and expressiveness offered to theme builders and users. Thereโ€™s also some refinements to some fundamental aspects of blocks to make them more resilient and more consistent.

Group block attributes

  • Link: GitHub Issue
  • Key considerations:
    • Adding groups to InspectorControls (like BlockControls).
    • Add support for list representation to block API based on nav block work.
    • Implement content representation for media and rich text attributes. (Connected with contentOnly, bindings, and partially synced patterns work.)
  • Contributors: TBD

โœ… Cover block: video embeds

Modernize Code editor + Code block

Lazy load the Classic block

Leverage iAPI for instant search block & submit comments without full page refresh

Writing flow + drag and drop improvements

  • Link: GitHub issue
  • Key considerations:
    • Get to a place where the drag handle from the toolbar can be entirely removed due to improved drag and drop functionality.
    • Making multi selection work on touch devices.
    • Improvements to inline insertion and inline images.
  • Contributors: @ellatrix

โœ… Tabs blockย 

Release the Table of Contents blockย 

Playlist block

Slider block

Dialog block

โœ… Breadcrumb block

Add more dynamic URLs via block bindings to Buttons block and Image block

Icon block

  • Link: GitHub issue
  • Key considerations:
    • Ship with a default set made out of some wordpress/icons.
    • Allow extenders to register their own sets.
  • Contributors: @mcsf @welcher

Gallery block: add lightbox support with the ability to switch between images

Introduce heading levels as Heading block variations

  • Link: Github issue; https://github.com/WordPress/gutenberg/issues/42181
  • Key considerations:
    • Show up in search and slash inserter.
    • Easy toggling in sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. inspector and transforms.
  • Contributor: @matveb

Aim to stabilize grid block


Media

Client side media work

Media editor


Designers looking across all these projects: @fcoveram, @joen,ย @jameskoster, @mattmiklic.

#7-0, #phase-3

What’s new in Gutenberg 22.2 (03 December)?

โ€œWhatโ€™s new in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses โ€˜blocksโ€™ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/โ€ฆโ€ 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 Editor.

What's new in Gutenberg 22.2

Gutenberg 22.2 has been released and is available for download!

A total of 161 PRs were merged in Gutenberg 22.2, with 4 first-time contributors! With WordPress 6.9 released this week, many contributors were focused on bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. fixes, performance, blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. editor polish, and a series of accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both โ€œdirect accessโ€ (i.e. unassisted) and โ€œindirect accessโ€ meaning compatibility with a personโ€™s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) and developer experience improvements. There are still some great features and enhancements in this release, highlighted below.

Table of contents

Cover block video embeds

A big feature in this release is the ability to use embedded videos (like YouTube or Vimeo) as background videos in the Cover block, rather than being restricted to locally uploaded files. This is a major quality-of-life improvement for those who want to offload video hosting and bandwidth. (73023)

Thereโ€™s further development on the experimental Breadcrumbs block. It now includes better handling for homepages, last item attributes, 404/search/archive pages, archive links, post type archive links, as well as support for paginated content. All of these additions are aimed at making breadcrumb navigation more robust and context-aware. (72832)(73249) (73283)(73435) (72905)

Styling options for the Math block.

Gutenberg 22.2 adds style options to the Math block in Gutenberg, addressing the inconsistency where inline math inherits paragraph styling but display math blocks previously lacked their own styling controls (73544).

standard styling option added to the Math block

Other Notable Highlights

Button Block Pseudo-state Styling

Theme designers and developers can now style button states (hover, focus, active, and focus visible) directly within the theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML., making it much easier to keep all design controls centralized and consistent. This reduces the reliance on custom CSSCSS Cascading Style Sheets. for things like button hover states. (71418)

{
    "styles": {
        "blocks":{
                "core/button":{
                    "color":{
                        "background":"blue"
                    },
                    ":hover":{
                        "color":{
                        "background":"green"
                        }
                    },
                    ":focus":{
                        "color":{
                        "background":"purple"
                        }
                    }
                }
            }
    }
}

Data Views Upgrades

Data Views received several improvements, including:

  • A new โ€œactivity layoutโ€ brings a timeline-like view, perfect for things like revision history, logs, or any content that benefits from a chronological display. This layout handles interactionsโ€”like keyboard navigationโ€”in a way that fits the timeline format. (72780)
  • The table column headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitorโ€™s opinion about your content and you/ your organizationโ€™s brand. It may also look different on different screen sizes. now lets you add columns to the left or right for better customization (72929).

Changelog

List of all the changes

Block Library

  • Breadcrumbs: Add archive link if enabled in posts. (72832)
  • Breadcrumbs: Add attachment handling. (73249)
  • Breadcrumbs: Add filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. for preferred taxonomyTaxonomy A taxonomy is a way to group things together. In WordPress, some common taxonomies are category, link, tag, or post format. https://codex.wordpress.org/Taxonomies#Default_Taxonomies. and term per post type. (73283)
  • Breadcrumbs: Add post type archive link if itโ€™s not the same as home URLURL A specific web address of a website or web page on the Internet, such as a websiteโ€™s URL www.wordpress.org. (73435)
  • Breadcrumbs: Add support for paginated post content. (72905)
  • Cover: Add support for background videos as embeds. (73023)
  • Math: Enable styles options. (73544)
  • Tabs block: Improve store functionality. (73229)
  • Term Name, Term Count :Add example block previews. (73388)
  • [Button Block]: Add support for pseudo elements for the block and its variations on theme.json. (71418)

DataViews

  • Add insert left/right in table column header. (72929)
  • Apply background to DataViews wrapper. (73390)
  • DataForms: Add pattern validation. (73156)
  • DataForms: Update Email Control component to use envelope icon instead of a Symbol. (73184)
  • Field APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways.: Add format to date field type. (72999)
  • Introduce activity layout. (72780)
  • Only apply hover styles when there are bulk actions. (73248)
  • Sticky elements inherit bg from container. (73240)
  • Theme: Add density support for surface padding. (73215)

Patterns

  • Add edit section to the list view instead of Ungroup. (73199)
  • Change the icon and label for pattern section to use the pattern icon and name. (73203)
  • Remove ungroup option for section blocks. (73183)
  • Sections: Remove hover outlines in outline mode. (73263)
  • Update pattern editing button labels. (73195)
  • contentOnly patterns: Mark patterns as contentOnly by adding metadata.patternName to the root block (patterns endpoint). (73375)

Block Editor

  • FontFamilyControl: Hard deprecate bottom margin. (73340)
  • Block Editor: Filter file input accept attribute based on upload_mimes. (73562)
  • Add cart icon. (73509)
  • templateLock: ContentOnly โ€“ support content block insertion. (73425)
  • RichText: Begin to support hiding richtext controls while having keyboard shortcuts available. (73181)
  • Add width block supports under dimensions. (71905)
  • Add text justify. (73201)

Bug Fixes

Block Library

  • Accordion Block: Trigger panel opening from URL hash or anchor link. (73357)
  • Accordion Item: Donโ€™t use grid layout. (73501)
  • Accordion: add box-sizing:Border-box rule. (73507)
  • Fix block selection when navigation link ui is open. (73368)
  • Fix navigation tagtag A 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.) entity binding. (73255)
  • Fix: Custom font size taking over fit text. (73241)
  • Fix: Stretch Text overflows into the padding area. (73327)
  • HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. Block: Fix scrolling within the modal. (73506)
  • HTML Block: Remove editorStyles from HTMLEditModal. (73347)
  • Image block: Set img_srcset to avoid PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 7.4 or higher undefined var warning. (73453)
  • Math block: Fix accessibility. (73508)
  • Merge โ€œIcon Sizeโ€ and โ€œIcon sizeโ€ translationtranslation The process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. strings. (73325)
  • Simplify and improve navigation link creation flow. (73210)

DataViews

  • DataForm: Autofocus first input on panel view. (72322)
  • DataForm: Fix issue with array fields in layout panel. (73344)
  • Ensure primary actions are not wrapped in the list layout. (73333)
  • Field API format: Fix and use WordPress input. (73538)
  • Fields: Fix author field view when editing. (73482)
  • Fix alignment when viewing a DataView with table layout and non-default column alignment. (73398)
  • Open the filters from the column table consistently. (72998)
  • [DataForm]: The ModalContent component doesnโ€™t properly check for fields validity โ€“ [#73330]. (73339)
  • Theme: Fix color ramp generation to avoid unmet contrasts. (73331)

Block Editor

  • Border Radius Control: Empty Values triggers unintended px unit conversion. (73324)
  • Drag and drop: Remove grab cursor for multi-selection. (73521)
  • Drag: Hide block tools popovers. (73539)
  • Stretchy text: Hide variations in Block Inspector (hack). (73238)
  • Styles Tab: Fix bug where contentOnly experiment forced it to always be displayed. (73534)
  • Disable Term Query blocks in Widgets Editor. (73449)
  • Comments Count and Comments Link: Ensures that the preview is displayed correctly in the StyleBook. (73213)

Global Styles

  • Preview Styles: Prevent leaked shadow due to blur. (73545)
  • Update generateGlobalStyles function to include variationStyles option. (73535)
  • Variations global styles: Replace useSetting with useStyle for fetching block variations. (73533)
  • Global Styles: Fix media upload permission check. (73503)
  • WP_Theme_JSON_Gutenberg: Preserve valid non-preset settings when KSES filters are active. (73452)

Components

  • Fix: Keep Guide close button visible on hover. (73220)
  • Normalize displayed dates to UTC time for DateTimePicker. (73444)
  • Try fixing full-screen modal height so contents can scroll. (73150)

Block bindings

  • Error handling for external sources. (72585)
  • Fix coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress./term-data source bug, refactor, add unit testunit test Code 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. coverage. (73366)
  • Move computation of sources into dedicated useSelect. (72974)

Interactivity API

  • iAPI: Fix using getServerContext in derived state getters. (73518)
  • iAPI: Return a deep-clone object from getServerState and getServerContext functions. (73437)

Collaboration

  • Notes position alignment in HTML. (73046)
  • Notes: Collapse note on blur. (73158)
  • Notes: Fix warning in comment content check. (73198)

Patterns

  • Check for prevent default on event to enable media placeholder button. (73564)
  • contentOnly patterns: Fix lock icon appearing on toolbar when editing a section. (73457)

Block API

  • Block Support: Change block visibility support key. (73432)

Layout

  • Prevent empty contentSize and wideSize values โ€‹โ€‹from being saved. (73281)

Accessibility

  • Fix a11yAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both โ€œdirect accessโ€ (i.e. unassisted) and โ€œindirect accessโ€ meaning compatibility with a personโ€™s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) of descriptions and alerts for โ€œInvalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid.โ€ Nav Items. (73177)

DataViews

  • Add grid keyboard navigation. (72997)
  • Make DataViews table checkbox permanently visible. (73245)

Performance

  • Remove some modal subscriptions when inactive. (73014)
  • Theme: Simplify ramp object by flattening warnings to optional top-level property. (72942)

Experiments

  • Add experimental abilities and workflow palette and move abilities API. (72703)
  • Lazy Editor: Fix Media Library loading. (73176)
  • Lazy Editor: Fix script modules loading. (73237)
  • Navigation Route: Add initial list and edit routes. (73259)
  • Refactor: Make WordPress abilities a script module instead of a global. (73364)
  • Routing: Add init modules. (73284)
  • Routing: Add pattern routes. (73317)
  • Routing: Add styles page as a route. (73197)
  • Routing: Add template part route. (73303)
  • Routing: Extract route package. (73191)
  • Routing: Support canvas clicks. (73348)
  • Styles Route: Allow switching between stylebook and homepage. (73253)

Patterns

  • ContentOnly Patterns experiment: Add content only inspector fields. (71730)
  • ContentOnly mode: Exclude template parts for now. (73332)
  • Routes: Small fixes to the pattern list and template part list routes. (73520)

Templates API

  • Add template route to the new site editor infrastructure. (73525)
  • Template Route: Add the โ€˜add new templateโ€™ button. (73542)
  • Template Activation: Rename gutenberg_get_block_template. (73582)
  • Template Activation: Use string IDs when experiment is off. (73585)

Block Library

  • Disable TinyMCE: Polish refresh message. (73485)
  • contentOnly Patterns experiment: Add content only support again for template parts. (73419)

DataViews

  • Routing: Preload routes properly. (73384)
  • Add experiment flag for Customizable Navigation Overlays. (73356)

Media

  • Reuse mediaUpload filter for new media modal by wrapping it in a class component. (73225)

Documentation

  • DataViews: Combine duplicate โ€œenhancementsโ€ grouping in changelog. (73227)
  • DataViews: Update documentation for layout prop. (73470)
  • Docs: Use consistent content formatting for experimental packages. (73212)
  • Field API docs: Improve Edit. (73202)
  • Field API: Document missing props. (73515)
  • Field API: Update documentation for operators. (73523)
  • Field API: Update documentation to better communicate field types. (73349)
  • Update Gutenberg Version for WordPress 6.9. (72925)
  • Update dataviews readme with new pickerTable layout. (73372)
  • Update undestanding-global-state-local-context-and-derived-state.md. (73233)

Code Quality

  • Asset Loader: Load all scripts in body (footer). (73584)
  • Core Data: Update Attachment type to more accurately reflect fields in media API responses. (73223)

Patterns

  • Content only block experiment: Blocks provide the form. (73479)
  • ContentOnlyControls: Refactor to use DataForm. (73374)
  • Resolve_pattern_blocks sync with Core patchpatch A 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.. (73570)

DataViews

  • Field API: Simplify field normalization. (73387)
  • Field API: Simplify normalization. (73546)
  • Revert โ€œ[DataForm]: The ModalContent component doesnโ€™t properly check for fields validity โ€“ [#73330]โ€. (73367)

PluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party.

  • Command Palette: Backportbackport A 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 in core. (73567)

Components

  • Storybook: Replace implicit actions with explicit ones. (73502)

Block bindings

  • Make core/post-data source code more semantic. (73394)

Collaboration

  • Notes: Ignore flood and duplicate checks. (73232)

Block Library

  • Deprecate Pullquote Block. (73228)

Tools

  • Project: Add CODEOWNERS entries for ui and theme packages. (73369)
  • Update codeowners for packages/dataviews. (73204)

Build Tooling

  • Add missing package dependencies. (73258)
  • Build: Fix CSS rebuilds. (73380)
  • Build: Make pages building using the routing infrastructure independent of Gutenberg. (73379)
  • Build: Moment-timezone shouldnโ€™t be a mandatory dependency. (73352)
  • Exclude JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors./TS test files from build. (73495)
  • Framework: Sync lockfile changes under Node.js v24 build. (73314)
  • Scripts: Improve handling of check-licenses for optional dependencies. (73026)

Testing

  • Block Bindings: Add unit test coverage for core/post-data source. (73055)
  • Block Bindings: Remove end-to-end test theme. (73209)
  • Unit testing: Allow Composer to auto-detect PHP version. (73358)
  • end-to-end Tests: Remove movie CPTs after block bindings tests. (73235)
  • end-to-end Tests: Skip flaky list view test. (73234)

Various

  • UIUI User interface: Remove shorthand prop options from Box component. (73529)

Collaboration

  • Notes: Improve delete confirm message for replies. (73173)
  • Update button label from โ€œAdd new noteโ€ to โ€œAdd new replyโ€. (73189)

Templates API

  • Template activation: Move php files. (73402)

Block Library

  • contentOnly patterns experiment: Make the Inspector fields key a private API. (73376)

Patterns

Double-click on pattern to edit pattern. (73268)

First-time contributors

The following PRs were merged by first-time contributors:

  • @PaulAsaf2: Update undestanding-global-state-local-context-and-derived-state.md. (73233)
  • @RoyHridoy: Fix: Keep Guide close button visible on hover. (73220)
  • @triple0t: Dataforms: Update Email Control component to use envelope icon instead of atSymbol. (73184)
  • @xristos3490: Fix alignment when viewing a DataView with table layout and non-default column alignment. (73398)

Contributors

The following contributors merged PRs in this release:

@aaronrobertshaw @adamsilverstein @aduth @andrewserong @annezazu @anomiex @audrasjb @bph @cbravobernal @DAreRodz @ellatrix @felixarntz @getdave @gigitux @harshbhonsle @hbhalodia @jameskoster @jasmussen @jeryj @jorgefilipecosta @jsnajdr @karthick-murugan @luisherranz @MaggieCabrera @Mamaduka @mcsf @mikachan @mikejolley @mtias @ntsekouras @oandregal @ockham @PaulAsaf2 @priethor @ramonjd @RoyHridoy @ryanwelcher @scruffian @senadir @shimotmk @simison @SirLouen @t-hamano @talldan @tellthemachines @triple0t @tyxla @xristos3490 @youknowriad

Props to @annezazu and @matveb for reviewing this post, and @joen for the visual assets!

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

Ability to Hide Blocks in WordPress 6.9

WordPress 6.9 now includes a built-in feature to hide blocks, making it easy to tuck content away without deleting it. You can now hide blocks: select a blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience., click the ellipsis, and choose โ€œHideโ€. Hidden blocks are visually removed from the editor, and fully omitted from the published markup. Scripts and styles for hidden blocks are also omitted from the rendered page by default (see WordPress 6.9 Frontend Performance Field Guide for more details).

To unhide a block, open the List View, identify hidden blocks via the โ€œHiddenโ€ icon next to them, open the ellipsis menu again, and choose โ€œShowโ€. You can also toggle Hide/Show from the keyboard: use Ctrl + Shift + H on Windows orย Linux, โŒ˜ + Shift + H on macOS.

How to disable the hide option

Because it is implemented as a standard Block APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. support flag, opting into or out of this capabilitycapability Aย capabilityย is permission to perform one or more types of task. Checking if a user has a capability is performed by the current_user_can function. Each user of a WordPress site might have some permissions but not others, depending on theirย role. For example, users who have the Author role usually have permission to edit their own posts (the โ€œedit_postsโ€ capability), but not permission to edit other usersโ€™ posts (the โ€œedit_others_postsโ€ capability). aligns with the rest of the block supports.

The support is enabled by default for every block type except for a short list of coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. blocks. To disable the support selectively, hook into the block_type_metadata() filter, adjust the metadata, and update the supports.visibility flag:

function disable_block_visibility_support( $metadata ) {
	// Disable visibility support for the core/group block.
	if ( isset( $metadata['name'] ) && 'core/group' === $metadata['name'] ) {
		$metadata['supports']['visibility'] = false;
	}
	return $metadata;
}
add_filter( 'block_type_metadata', 'disable_block_visibility_support' );

For additional implementation details and history, see Gutenberg PR #71203.


Props to @joen for co-authoring the note.
Props to @westonruter, @ramonopoly for review.

#6-9, #dev-notes, #dev-notes-6-9

Whatโ€™s new in Gutenberg 21.6? (10 September)

โ€œWhatโ€™s new in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses โ€˜blocksโ€™ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/โ€ฆโ€ 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 Editor.

Whatโ€™s New In
Gutenberg 21.6?

Gutenberg 21.6 has been released and is available for download!

It brings several enhancements, including improvements to the new Accordion blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. and the Dataviews grid. This release also incorporates various bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. fixes and code refactoring, continuing the migrationMigration Moving the code, database and media files for a website site from one server to another. Most typically done when changing hosting companies. to TypeScript. Additionally, it lays the groundwork for a future upgrade to ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. 19.

  1. New add accordion button
  2. Improved Dataviews grid interface.
  3. Select, dropdown and text inputs now support global styles.
  4. Changelog

New โ€œaddโ€ accordion button

A new โ€œaddโ€ button has been incorporated into the accordion block, simplifying the process of creating new content items by allowing direct additions to the accordion toolbar.

Improved Dataviews grid interface.

The dataviews grid now offers a cleaner interface. Titles can be hidden, and actions are accessible on hover, allowing for a simplified grid without sacrificing the ability to add actions to individual items.

Select, dropdown and text inputs now support global styles

This release brings global styles support to selects, dropdowns, and text inputs, giving themes consistent control over these common form elements. By defining styles in theme.json, authors can customize colors, borders, and typography without extra CSSCSS Cascading Style Sheets.. This update makes forms feel more cohesive with the rest of a siteโ€™s design.

Changelog

Enhancements

  • Add support for precision type placeholders to translator comments eslint. (71145)
  • CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Commands: Add Dashboard option to return to dashboard. (71261)
  • Core Data: Add โ€˜supportsPaginationโ€™ to all appropriate entities. (71302)
  • Core Data: Forward resolvers for pagination selectors. (71304)
  • Core Data: Include pagination metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. while receiving intermediate results. (71401)
  • Create Block: Add lifecycle script execution support. (71072)
  • Display names for Context providers. (71208)

DataViews

  • DataForm: Add description support for the combined fields and show the description in the Card layout. (71380)
  • DataForm: Streamline validation behavior. (71345)
  • Revert โ€œDataForm: Streamline validation behaviorโ€. (71359)
  • Support hiding the title in Grid layout, with actions available on hover. (71369)
  • Support the โ€œMinimal UIUI User interfaceโ€ story by using DataViews.Footer. (71276)

Block Library

  • Accordion Panel: Remove unnecessary wrapper div and simplify save. (71454)
  • Accordion: Add an โ€œAddโ€ button. (71388)
  • Query LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. Block: Fix broken placeholder. (70840)

Offline

  • api-fetch: Check navigator.onLine to improve failure notices. (71438)

Meta Boxes

  • Edit Post: Check for meta box container before adding constraints. (71423)

Commands

  • feat: Added keyword support & added basic keywords for post/page. (70624)

New APIs

Global Styles

  • Add support for select or dropdown elements. (70379)
  • Global styles: add element support for text related inputs. (70378)

Bug Fixes

  • Add permission checks to Command Palette commands. (71267)
  • Components: Fix Tab font size when used outside WP. (71346)
  • Core Data: Fix error in โ€˜getEntityRecordsTotalPagesโ€™ selector. (71303)
  • Scripts: Do not access window global. (71348)
  • wp-scripts: Remove clean-webpack-pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. dependency. (71080)

Block Library

  • Accordion HeaderHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitorโ€™s opinion about your content and you/ your organizationโ€™s brand. It may also look different on different screen sizes.: Fix RTL toggle button layout. (71480)
  • Fix issue of css affecting the nested accordion icon. (71445)
  • Fix timezone in Date block. (71430)
  • Fix: Randomization in Gallery Block doesnโ€™t work when Lightbox is enabled. (71408)
  • Group Block variation:Remove variation text color. (71429)
  • Properly apply styles and classes to the experimental form block. (55755)
  • Template Part: Display icons correctly when in placeholder state. (71327)
  • fix: Prevent accordion toggle button overflow at full width. (71446)
  • fix: Prevent scrollbars on accordion header and toggle. (71484)

Write mode

  • Allow adding โ€œcontentโ€ role blocks to containers that also have a โ€œcontentโ€ role in write mode. (71232)
  • Audio and Video: Hide caption controls in contentOnly mode. (71368)
  • Hide โ€˜Add blockโ€™ control in Link UI when Navigation Link block is in contentOnly mode. (71213)
  • Image: Donโ€™t allow convert to cover controls in contentOnly mode. (71329)

Post Editor

  • Edit Post: Fix misplaced icon on back button. (71406)
  • Editor: Fix theme stylesheet injection in โ€˜useAvailablePatternsโ€™. (71332)

DataViews

  • Fix grid padding values on mobile viewports. (71455)

Block Editor

  • Inserter: Fix InserterListbox rendering for React 19. (71410)

Style Book

  • Accordion Content, Header, Panel: Remove example field. (71407)

Zoom Out

  • Fix Zoom out should be disabled when Show Template is toggled off. (71361)

Components

  • ControlWithError: Show validating state when transitioning from error state. (71260)

Interactivity APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways.

  • iAPI: Make state getters to be updated asynchronously with store(). (70974)

Performance

  • Add wp-env SPX profiler option. (70693)

Post Editor

  • Editor: Improve the โ€˜Designโ€™ sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. panel performance. (71333)

Documentation

  • Core Data: Improve โ€˜registry.batchโ€™ documentation. (71325)
  • DataForm: Better story for validation. (71298)
  • DataViews: Fix defaultLayouts documentation error. (71334)
  • Field Types: Update storybook. (71440)
  • HooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same.: Document โ€˜hookNameโ€™ and โ€˜namespaceโ€™ parameters. (71288)
  • Storybook: Set DateCalendar and DateRangeCalendar components as private. (71453)

Code Quality

  • A11yAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both โ€œdirect accessโ€ (i.e. unassisted) and โ€œindirect accessโ€ meaning compatibility with a personโ€™s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility): Remove redundant styles. (65409)
  • Command Palette: Enqueue assets globally. (71264)
  • Convert api-fetch package to TypeScript. (67669)
  • Convert date package to TypeScript. (67665)
  • Core Data: Remove unused reducers. (71305)
  • Fix: Add JSON_HEX_TAG flag to wp_json_encode in script tags. (71280)
  • Interface: Remove leftover comment. (71331)
  • Types: Update to be compatible with React 19. (71374)
  • api-fetch: Clean up error handling. (71458)
  • api-fetch: Cleanup and improve unit tests. (71439)
  • core-data: Use Object.fromEntries instead of reduce when generating entities reducer. (36296)
  • Deps: Bump framer-motion to v11.15.0. (71442)
  • Move Site Editor command from wordpress/editor package to wordpress/core-commands. (71262)

Block Editor

  • Fold uniqueByBlock into options object. (71279)
  • Remove duplicate โ€˜InsertionPointOpenRefโ€™ context definition. (71465)

Block Library

  • Image block: Remove unused code. (71292)
  • refactor: Remove unnecessary fields from accordion block.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML. files. (71441)

Post Editor

  • Update types of getCurrentPostId. (71347)

Global Styles

  • Remove unecessary useEffect from ScreenStyleVariations. (71344)

Tools

Testing

  • Avoid using *-latest for runner images. (71201)
  • Fix failing command center end-to-end tests. (71293)
  • GitHubGitHub GitHub 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 by the repository owner. https://github.com/ Actions: Try to fix storybook smoke tests. (71284)
  • Upgrade Playwright to v1.55. (71285)

Build Tooling

  • Fix PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 7.4 or higher unit testing jobs to not include version. (71396)
  • Release Workflow: Add github.ref validation. (71404)

First-time contributors

The following PRs were merged by first-time contributors:

Contributors

The following contributors merged PRs in this release:

@Adity @andrewserong @aristath @DAreRodz @desrosj @dinhtungdu @getdave @himanshupathak95 @im3dabasia @jsnajdr @juanfra @kmanijak @lalitkumawat1m @levinbaria @MaggieCabrera @Mamaduka @manzoorwanijk @Mayank-Tripathi32 @mcsf @mikachan @mirka @nerrad @oandregal @R1shabh-Gupta @ramonjd @shimotmk @sirreal @swissspidy @t-hamano @talldan @tellthemachines @tyxla @USERSATOSHI @vipul0425 @westonruter @youknowriad

Props @mamaduka and @jorbin for peer review. Props @joen for visual assets.

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

Whatโ€™s new in Gutenberg 21.0? (11 June)

โ€œWhatโ€™s new in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses โ€˜blocksโ€™ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/โ€ฆโ€ 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).


Gutenberg 21.0 has been released and is available for download!

This release continues the ongoing effort to refine the editing experience, improve accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both โ€œdirect accessโ€ (i.e. unassisted) and โ€œindirect accessโ€ meaning compatibility with a personโ€™s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility), and streamline blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. customization. Below is a curated summary of the most notable changes in this release.

The HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. Element is now selectable on Button and Separator blocks.

Users can now choose between <a> and <button> elements for better accessibility in the Advanced panel of the Button block.

For the Separator block, they can choose between <hr> and <div>.

Extensive ToolsPanel Refactoring

Many block settings panelsโ€”including Button, Comment blocks, Embed, File, List, Navigation, Post Title, RSS, and moreโ€”have been refactored to use the unified ToolsPanel interface, providing a more consistent and organized editing experience.

Accessibility and usability

Several blocks, including Button, Columns, and Details, received keyboard accessibility improvements and better focus management.

Numerous bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. fixes address issues with block controls, gallery image captions, social link translations, and more, resulting in a smoother editing workflow.

Changelog

Enhancements

Block Library

  • Button Block: Add HTML Element selection in Advanced settings. (70139)
  • Comment Date: Convert Comment Date block settings to ToolsPanel. (70248)
  • Comment Author Name Block: Refactor setting panel to use ToolsPanel. (69407)
  • Comment Edit Link: Refactor settings panel to use ToolsPanel. (70247)
  • Comment Title: Refactor settings panel to use ToolsPanel. (70246)
  • Comments Pagination Block: Refactor settings panel to use ToolsPanel. (70245)
  • Embed Block: Refactor setting panel to use ToolsPanel. (69636)
  • File Block: Refactor setting panel to use ToolsPanel. (70189)
  • Form Input: Convert Form Input block settings to ToolsPanel. (70249)
  • Form: Convert Form block settings to ToolsPanel. (70253)
  • Latest posts: Change panel body to tools panel. (70200)
  • List Block: Refactor setting panel to use ToolsPanel. (69387)
  • Navigation Link, Navigation Submenu: Hide title UIUI User interface controls while keeping attribute support. (70234)
  • Navigation: Refactor display panel to use ToolsPanel. (68011)
  • Post Title: Refactor settings panel to use ToolsPanel. (70229)
  • RSS: Refactor setting panel to use ToolsPanel. (70213)
  • Separator: Change html element option visibility. (70185)
  • ShortcodeShortcode A 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.: Add role attribute to content in block.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.. (70164)
  • Video: Add option to set a track as default. (70227)

Components

  • ComboboxControl: Handle Unicode characters when matching values. (70180)
  • DropZone: Allow overriding the default icon. (70236)

Block Transforms

  • Adds transforms functionality to Post comments link and post comments number. (70287)

Bug Fixes

Block Library

  • Button: Avoid empty block control slot. (70191)
  • Fix: Click-through blur effect when gallery images have a caption. (69067)
  • Pullquote block: Cannot override cite element style via theme.json. (70260)
  • Social Link: Localize social service names for translations. (70199)
  • Social: Moves size settings to inspector controls. (70186)

Components

  • Ensure SVG Images Without a Width Attribute Are Displayed Correctly in FocalPointPicker. (70061)
  • FormTokenField: Fix filtering with full-width string. (70232)

Interactivity APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways.

  • iAPI: Make storePart argument optional in overloads. (70296)

Post Editor

  • Editor: Better normalize strings for hierarchical term filtering. (70178)

Block Editor

  • Flex Layout: Fix incorrect default alignment values for Vertical Alignment Control component. (68866)

Accessibility

Block Library

  • Button: Avoid focus loss when unlinking using keyboard. (70192)
  • Columns block: Donโ€™t use ToolsPanelItem for Columns setting. (70210)
  • Details Block: Fix keyboard accessibility issues and allow list view selection to show up inner blocks. (70056)

Components

  • Toolbar: Adjust colors for dark mode support. (69278)

Experiments

Interactivity API

  • iAPI: Remove the full-page client-side navigation experiment. (70228)

Documentation

  • Docs: Added the missing ALT attribute to all images. (70225)
  • Docs: Remove misleading section from curating the editor experience. (70262)
  • Fix parameter hint for canInsertBlocks. (70305)
  • Fix: Render_block_core_site_title function doc has missing return type. (70269)
  • Improve default ALT attribute value for images in documentation. (70226)
  • JSON schema: Clean reference URLs. (70274)
  • Removed Empty line and corrected typo in inline document. (70203)
  • Replace โ€œsidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme.โ€ with โ€œpanelโ€ in tutorial.md. (70257)
  • Small grammar fix in glossary.md. (70292)
  • The wp_admin_notice() function should be called instead of custom HTML for adminadmin (and super admin) notice in docs/how-to-guides/notices/README.md. (70231)
  • Updated small typo in inline documentation. (70187)
  • useDropZone: Refactor documentation to use the correct function syntax. (70286)
  • block.json schema: Add role field. (70272)

Code Quality

Block Editor

  • Clarify โ€˜clientIdโ€™ prop use for โ€˜HTMLElementControlโ€™. (70258)
  • ImageSizeControl: Use margin-free style. (70202)

Components

  • Remove forced focus of InputControl on mousedown. (41118)
  • SuggestionsList: Remove unused code. (70195)

Block Library

  • Video: Use a unique โ€˜keyโ€™ in the โ€˜TrackListโ€™ component. (70263)

Tools

Testing

  • Cover Block: Add E2E Test for FocalPointPicker. (69077)
  • E2E: Add general end-to-end tests for templateLock functionality. (70160)
  • Fix end-to-end test for block API / filtered blocks. (51882)
  • Format .githubGitHub GitHub 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 by the repository owner. https://github.com/ workflows .yml file. (70219)
  • Account for tests env port being overridden from 8889 in PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 7.4 or higher unit tests. (70267)

First-time contributors

The following PRs were merged by first-time contributors:

Contributors

The following contributors merged PRs in this release:

@aurooba @catgofire @DAreRodz @dhruvikpatel18 @himanshupathak95 @im3dabasia @Infinite-Null @Mamaduka @Mayank-Tripathi32 @Mukulsingh27 @nani-samireddy @OpuRockey @pmbaldha @ravigadhiya007 @Rishit30G @SainathPoojary @shail-mehta @shimotmk @stokesman @t-hamano @troychaplin @vipul0425 @vk17-starlord @westonruter @yogeshbhutkar

Props @luminuu, @priethor and @mamaduka for peer review. Props @joen for visual assets.

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

Whatโ€™s new in Gutenberg 19.9? (19 December)

โ€œWhatโ€™s new in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses โ€˜blocksโ€™ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/โ€ posts (#gutenberg-new) appear on a biweekly basis after every Gutenberg release, and showcase the latest features and improvements.ย 

Interested in learning more? Hereโ€™s an overview of how you can keep up with news and events related to Gutenberg and the BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. Editor.


Gutenberg 19.9 is out of the oven and ready to download.

The last release of 2024 introduces the Style Book to classic themes, a new Query Total block, a swathe of component library enhancements, and code quality improvements.

Table of contents

  1. Style Book in classic themes
  2. Introducing the Query Total block
  3. More Highlights
  4. Changelog
  5. First-time contributors
  6. Contributors

Style Book in classic themes

The Style Book now appears in supported classic themes under Appearance > Design > Styles in the adminadmin (and super admin) menu.ย 

Support is available for classic themes that either support editor styles via add_theme_support( 'editor-styles' ) or have a theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML. file.ย 

The Style Book provides a comprehensive overview of your siteโ€™s colors, typography, and block styles in an organized layout. Each block example and style group is labeled, making it easy to preview and understand your themeโ€™s current design settings. Think of it as if your theme threw a party, and all the design elements showed up wearing name tags. ๐Ÿ˜€

For classic themes that support the Style Book, site patterns have been relocated to Appearance > Design > Patterns, consolidating all design-related functionality from the Site Editor into one place. Previously, patterns were listed under Appearance > Patterns.ย 

Testing is an important step for this feature before itโ€™s introduced to WordPress CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. If you have the time, please help identify potential issues, and suggest areas for improvement by logging your feedback on GitHubGitHub GitHub 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 by the repository owner. https://github.com/. Testing instructions can be found on the original PR. Thank you!

Introducing the Query Total block

You know how many results are in your queries, but do your siteโ€™s readers? The new Query Total block is here to help.

When added within a Query LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. block, the Query Total block displays the number of results the query has returned, or, alternatively, the current range in a set of paginated results.

More Highlights

Gutenberg 19.9 introduces phpMyAdmin to wp-env as a launch option. phpMyAdmin will automatically connect to the running mysqlMySQL MySQL is a relational database management system. A database is a structured collection of data where content, configuration and other options are stored. https://www.mysql.com/. database service, allowing you to inspect and manage the local WordPress database as you develop. (#67588).

Featured imageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. backgrounds in the Cover block now come with resolution controls so that you can change their sizes (#67273).ย 

Reset colors for blocks and global styles in the editor with a single click thanks to the inline reset button added to all color controls (#67116).

Looking to replace your Query blockโ€™s design? Query block patterns have been relocated from a modal to a dropdown. Itโ€™s still in the block toolbar, now under โ€œChange designโ€ (#66993).

You can now also set your siteโ€™s home page from within the Site Editor via the page actions menu (#65426). This is the equivalent of updating the Reading Settings in โ€œSettings > Readingโ€. Under โ€œPagesโ€ in the editor, find the page youโ€™d like to set as your homepage, click on the action menu, and select โ€˜Set as homepageโ€™.

Changelog

Enhancements

  • Feature: Addย navigation.isLoadingย state to core/router store. (67680)
  • Update the title, description, and order of Experiments page. (67762)
  • wp-env: Add phpMyAdmin support. (67588)

Components

  • Added enableAlpha prop to CustomGradientPicker and GradientPicker components. (66974)
  • BorderBoxControl: Reduce gap value when unlinked. (67049)
  • DateTime: Add default date/time to stories. (67678)
  • Deprecateย COLORS.white. (67649)
  • Disabled: Suppressย contentEditableย warning in story. (67679)
  • Document layout in Storybook. (67628)
  • DropdownMenu: Increase option height to 40px. (67435)
  • DuotonePicker: Simplify Button styles. (66641)
  • Menu: Throw when subcomponents are not rendered inside top level Menu. (67411)
  • Popover: Useย anchorย instead ofย anchorRefย in story. (67674)
  • Storybook: Remove unnecessary feature flags. (67576)
  • Storybook: Updateย ArgsTableย toย Controlsย in preview. (67582)
  • Storybook: Update control types fromย nullย toย undefined. (67581)
  • Storybook: Use manager-api instead of addons package. (67578)
  • Update @ariakit/reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. to 0.4.13. (65907)
  • Update @ariakit/react to 0.4.15 and @ariakit/test to 0.4.7. (67404)

Block Library

  • Cover Block: Image size option for featured image. (67273)
  • Feature: Allow Post Template block to get deeply nested within Query Block. (67657)
  • Image Block: Change how the Imageโ€™s overlay styles are applied. (67788)
  • Navigation: Enable all non-interactive formats. (67585)
  • Query block: Move patterns modal to dropdown on block toolbar. (66993)
  • Separator block: Allow divs to be used as separators. (67530)
  • New Block: Add Query Total block for displaying total query results or ranges. (67629)
  • Block Library: Update the relationship ofย No resultsย block toย ancestor. (48348)

DataViews

  • Add headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitorโ€™s opinion about your content and you/ your organizationโ€™s brand. It may also look different on different screen sizes. to the quick edit when bulk editing. (67390)
  • Data views: Expand configuration drop down on mobile. (67715)
  • Quick Edit: Add Template field. (66591)
  • Refactor actions to render modal outside of the menu. (67664)
  • Rendersย DataFormย component only when data has been fetched. (67694)
  • Unify layout configuration. (67477)
  • Update bulk header with actions. (67743)

Style Book

  • Add stylebook screen for classic themes. (66851)
  • Scroll to top at styles root. (67605)
  • Stylebook: Render overview colors in 4 columns. (67597)
  • Update style book headings to new design. (67546)

Post Editor

  • Inline Commenting: Added new sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. as extension of the canvas. (67347)
  • Inline Commenting: Re-order the comments in sidebar in which blocks are listed. (66927)
  • Inline commenting: UXUX User experience Enhancements for Comments. (67385)

Site Editor

  • Data Views: Add action for pages to set site homepage. (65426)
  • Sidebar: Update appearance of active items. (67318)
  • Style the selected template pattern. (65917)

Data Layer

  • Data: Expose โ€˜useSelectโ€™ warning to third-party consumers. (67735)
  • Data: Include more details when shallow equality fails in โ€˜useSelectโ€™. (67713)

Global Styles

  • Controls in grid should match between sidebar panel and editor. (67602)
  • Shadows: Improve design and a11yAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both โ€œdirect accessโ€ (i.e. unassisted) and โ€œindirect accessโ€ meaning compatibility with a personโ€™s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) of remove button. (67705)

Block Editor

  • Prefer exact matches in Link Search results sorting. (67367)
  • Try direct drag (outside text editable). (67305)

Zoom Out

  • Keep only copy, duplicate and delete in the zoom out more block toolbar menu item. (67279)

Font Library

  • FontCollection: Update pagination controls. (67143)

Colors

  • Add reset button to color control. (67116)

Bug Fixes

  • Exclude Set instance methods from polyfills. (67230)
  • Preload: Fix settings fields order. (67450)
  • Scripts: Make React Fast Refresh work with multiple blocks. (64924)
  • WP Scripts: Update webpack dependencies related to styling. (67572)

Site Editor

  • Allow access to quick edit. (67469)
  • Edit Site: Fix sidebar template author navigation. (67382)
  • Fix Site editor navigation menuNavigation Menu A 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 alignment visual regressionregression A 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.. (67321)
  • Fix sidebar item animation regression. (67771)
  • Fix sidebar plugins. (67557)
  • Fix the templates route on mobile. (67547)
  • Fix: Fixed site-editor crashing when added front-page template and clicking more option. (67500)
  • Fix: Fixed styling tab not opening on themes without style variations on mobile & desktop. (67537)
  • Preload: Parse post ID from p (path). (67465)
  • Remove default page slug. (67673)
  • Router: Fix addition and removal of empty classnames. (67378)
  • Wrap each router area in โ€˜ErrorBoundaryโ€™. (64245)
  • useEditorTitle: Fix wrong request without ID. (67475)

Block Editor

  • Animateย useScaleCanvas()ย only when toggling zoomed out mode. (67481)
  • Drag and drop: Fix drop zones on block drag. (67317)
  • Drag and drop: Fix firefox compat logic. (67439)
  • Fix JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. error in the โ€˜useTabNavโ€™ hook. (67102)
  • FontFamilyControl: Restore margin bottom. (67424)
  • Inserter: Hide child blocks from the inserter when needed. (67734)
  • Inserter: Patterns: Remove loading indicator. (67072)
  • Inserter: Should receive focus on open. (67754)
  • Remove words count in the multi-selection inspector. (67624)
  • Storybook: Fixย BlockPatternsListย fixtures. (67672)
  • Drag and drop: Fix misplaced drop indicator. (67434)
  • Drag and drop: Fix scroll disorientation after drop. (67405)
  • Drag and drop: Restore moving animation. (67417)

Block Library

  • Align Submenu block and Nav Link block by including description and wrapping span. (67198)
  • CommentsPagination: Set font-size to inherit for pagination items. (67296)
  • Fix latest post block spacing issue. (66442)
  • Fix: Caption with Link in Wide-Width and Full-Width Images Appears on two lines. (67392)
  • Fix: Donโ€™t showย aria-labelย when its value is empty. (67381)
  • Navigation Block: Fix issue with double-clicking โ€œCreate a new menuโ€ causing duplicate menus. (67488)
  • Pullquote block having design issue when text-decoration is choosen strikethrough. (66707)
  • Remove inline-block display from image anchor in style.scss. (67368)
  • Search block: Add space between attributes when using โ€œButton onlyโ€ option. (61399)
  • Updated โ€˜Set featured imageโ€™ text in dropdown. (67775)

DataViews

  • Avoid double click handler on primary fields. (67393)
  • Better handling of missing onClickItem prop. (67402)
  • Fix filters lost when switching layouts. (67740)
  • Fix hidden List layout actions dropdown. (67778)
  • Fix reordering fields in list and grid layouts. (67777)
  • Fix: Duplicate template part refers to original name instead of duplicated name. (67329)
  • Preserve filters when switching layouts in templates dataviews. (67744)
  • QuickEdit: Prevent site-editor from crashing when slug is not an object. (67577)
  • Site Editor: Fix featured image not appearing in pages dataviews. (67562)

Components

  • CustomSelectControl: Update Value from Fresh State. (67733)
  • Fix the โ€˜ClipboardButtonโ€™ effect cleanup. (67399)
  • Navigation: Fix active item hover color. (67732)
  • Scrollable: Fix story by declaring field as readonly. (67683)
  • Storybook: Fix control types. (67646)
  • Storybook: Fix storybook blocks imports. (67684)
  • Storybook: Fix table markup in Design Language โ€“ Radius documentation. (67686)
  • Theme: Fix contrast in nested story. (67681)

Post Editor

  • Fix MetaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. boxes saving when theyโ€™re not present. (67254)
  • Fix hiding and showing of meta boxes. (67504)
  • Fix: Header layout spacing in Firefox. (67074)
  • Make sure Document Bar doesnโ€™t go missing. (67322)
  • Update pre-publish panel wording to accurately describe the review process. (67328)

Zoom Out

  • Fix for inserter. (67495)
  • Fix useZoomOut inserter behavior. (67591)
  • Fix zoom animation scrollbar. (67536)
  • UseScaleCanvas performance improvements. (67496)

Write mode

  • Fix color of disabled buttons in dark toolbar. (67348)
  • Fix synced pattern editing in write mode and refactor block editing mode to reducer. (67026)
  • Fix: Remove parent block selector while in Write mode. (67395)
  • Fix: Write Mode mode persists as enabled in widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. editor. (67587)

Global Styles

  • Edit site: Remove empty preview border and redirect to editor in global styles navigation. (67548)
  • Fix: Styles section does not moves stylebook to typography. (67423)
  • Global Styles Preview: Donโ€™t use iframeiframe iFrame is an acronym for an inline frame. An iFrame is used inside a webpage to load another HTML document and render it. This HTML document may also contain JavaScript and/or CSS which is loaded at the time when iframe tag is parsed by the userโ€™s browser. component. (67682)

Style Book

  • Fix critical error when blocks are not registered. (67703)

Design Tools

  • Global Styles: Fix handling of booleans when stabilizing block supports. (67552)

Block bindings

  • Revert โ€œExtensibility: Make Block Bindings work withย editor.BlockEditย hookโ€. (67516)

Patterns

  • Site Editor: Fix the patterns route on mobile. (67467)

Focus Mode

  • Site Editor: Fix focus mode navigation. (67458)

List View

  • Fix List View not updating when switching editor modes. (67379)

Extensibility

  • Make Block Bindings work withย editor.BlockEditย hook. (67370)

Synced Patterns

  • Remove use ofย contentOnlyย block editing mode for synced patterns. (67364)

Widgets Editor

  • Block Bindings: Remove client core sources registration in widgets. (67349)

REST APIREST API The REST API is an acronym for the RESTful Application Program Interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data. It is how the front end of an application (think โ€œphone appโ€ or โ€œwebsiteโ€) can communicate with the data store (think โ€œdatabaseโ€ or โ€œfile systemโ€) https://developer.wordpress.org/rest-api/.

  • Support search_columns argument in the user endpoint. (67330)

AccessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both โ€œdirect accessโ€ (i.e. unassisted) and โ€œindirect accessโ€ meaning compatibility with a personโ€™s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility)

  • [Dataviews] Fix: Space does not triggers the media button on grid view. (67791)

Block Editor

  • BlockSwitcher: Refactor to use Button layout properly. (67502)
  • Remove one occurrence of incorrect usage of ItemGroup. (67427)

DataViews

  • [a11y] Fix: Media button on the page view grid does not have an accessible name. (67690)

Components

  • Fix incorrect usage of ItemGroup in the Image block filters panel. (67513)

Post Editor

  • Fix EntitiesSavedStates panel dialog props. (67351)

Performance

  • Fix re-renders caused byย getEntityRecordsPermissionsย afterย #67667. (67770)
  • Preload: Fix end-to-end test. (67497)
  • Site Editor: Pages: Preload template lookup. (66654)
  • [mini] Preload: Add post type. (67518)

Experiments

  • Moveย duplicateTemplatePartย action to theย @wordpress/fieldsย package. (65390)

Documentation

  • Button: Revise documentation. (66617)
  • Docs: Fix Playwright Page Object Model link. (67652)
  • Docs: Include the strategy for settingย enginesย for WordPress packages. (67727)
  • Docs: Remove invalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid. key projects links on the documentation. (67491)
  • Improve documentation for fields package. (67580)
  • Refineย getServerState()ย &ย getServerContext()ย documentation. (67499)
  • Storybook: Add WritingModeControl story. (67343)
  • Storybook: Add stories for AlignmentToolbar and AlignmentControl components. (67046)
  • Storybook: Add stories for HeadingLevelDropdown component. (67294)
  • Storybook: Revert โ€œPreview: ArgsTable => Controls (#67582)โ€. (67656)
  • Storybook: Support keyword search in Icon Library. (67442)
  • Switch Several Links to httpsHTTPS HTTPS 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. in Document Files. (67706)
  • Update README.md. (67711)
  • Update extending-the-query-loop-block.md. (67529)
  • Update global stylesheet docblocks withย custom-cssย parameter. (67716)
  • Updated old URLURL A specific web address of a website or web page on the Internet, such as a websiteโ€™s URL www.wordpress.org in Documentation. (67446)

Code Quality

  • Convert lock unlock to generics. (66682)
  • CreateTemplatePartModal: Avoid identity warning in useSelect. (67786)
  • CreateTemplatePartModal: Replaceย ts-ignoreย withย ts-expect-error. (67709)
  • Fix misc type compilation errors in editor and block editor packages. (67410)
  • Fix: Invalid JSDoc for optional string parameter and return value. (67489)
  • Fix: Remove unused test code on tools panel. (67589)
  • Removed trailing space in โ€œColor randomizer โ€œ. (67457)
  • Update misc types and revert WPCompleter export from components. (67599)

Components

  • BoxControl: Deprecate 36px default size. (66704)
  • BoxControl: Passive deprecateย onMouseOver/onMouseOut. (67332)
  • BoxControl: Refactor and unify the different sides implementation. (67626)
  • CustomSelectControl: Deprecate 36px default size. (67441)
  • FormFileUpload: Deprecate 36px default size. (67438)
  • FormTokenField: Deprecate 36px default size. (67454)
  • NumberControl: Deprecate 36px default size. (66730)
  • RangeControl: Update the default marks styles to match the padding/margin control. (67611)
  • Removeย __unstableMotionContextย fromย @wordpress/components. (67623)
  • SlotFill: Remove explicit rerender from portal version. (67471)
  • Tabs: Overhaul unit tests. (66140)
  • ToolbarButton: Set size to โ€œcompactโ€. (67440)
  • UnitControl : Deprecate 36px default size. (66791)

Block Editor

  • Group โ€˜onRemoveโ€™ callback with other public APIs. (67551)
  • InspectorControlsSlot: Remove unused framer motion context forwarding. (67522)
  • LetteringSpacingControl: Deprecate 36px default size. (67429)
  • Reduce the โ€˜isZoomOutโ€™ selector calls in the block toolbar. (67594)
  • Remove โ€˜React.Childrenโ€™ legacy APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. in โ€˜Warningโ€™ component. (67675)
  • Replace remaining custom deep cloning with โ€˜structuredCloneโ€™. (67707)
  • Stabilizeย LinkControlย Component. (56384)

Site Editor

  • Remove .components-item-group selector in edit-site components[2]. (67575)
  • Site Editor Sidebar: Removeย hasGlobalStyleVariationsย condition for the Styles nav item. (67545)
  • Unify layout with posts dataviews. (67162)
  • Use path based routing instead of query args and site-editor.php routes. (67199)

Post Editor

  • Editor: Refactor โ€˜PostPublishPanelPostpublishโ€™ to function component. (67398)
  • Editor: Use hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same. instead of HOC in โ€˜PostPublishButtonOrToggleโ€™. (67413)
  • Remove PostSlugCheck and PostSlug unused components. (67414)

DataViews

  • Create a single component for rendering the actions list. (67558)
  • Fix: Dataviews remove primary field concept from some classes. (67689)

Data Layer

  • TypeScript: Convert factory utils in data package to TS. (67667)

Shortcodes

  • Add types for shortcodeShortcode A 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. package. (67416)

Block bindings

  • Remove fallback forย context.postTypeย in post meta. (67345)

Block hooks

  • Navigation block: Remove more obsolete Block Hooks helpers. (67193)

Tools

  • PR template: Add before/after table. (62739)

Build Tooling

  • Build: Stop generating unused legacy scripts for core blocks. (65268)
  • CI: Skip native jobs. (67799)
  • DataViews build-wp: Donโ€™t bundle singleton WordPress packages. (67590)
  • DataViews build-wp: Donโ€™t bundle the date package. (67612)
  • Keycodes: Improve tree shaking by annotating exports as pure. (67615)
  • Upgrade TypeScript to 5.7 and fix types. (67461)
  • Combine the release steps to ensure that releases are tagged. (65591)

Testing

  • e2e-test-utils-playwright: Increase timeout of site-editor selector. (66672)

Security

npm Packages

  • Update npm dependencies to fix issues reported by audit. (67708)

Various

Extensibility

  • Add ability to show drop cap setting in paragraph block by default. (45994)
  • DataViews: Move template and pattern title fields. (67449)
  • DataViews: Updateย usePostFieldsย to accept postType. (67380)

PluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party.

  • Only override REST server for older WP versions. (67779)

NUX

  • Welcome guide headline update. (67654)

Block Locking

  • Simplify description and option names in the Lock modal dialog. (67437)

First-time contributors

A colossal kudos to all the first-time contributors who submitted the following PRs:

Contributors

Finally, thanks to everyone who gave their time, code, reviews and ideas to Gutenberg 19.9:

@aaronrobertshawย @aferciaย @ajlendeย @akasunilย @AKSHAT2802ย @benazeer-benย @benniledlย @carolinanย @cbravobernalย @desrosjย @dhruvang21ย @dougwollisonย @ellatrixย @getdaveย @gigituxย @gzioloย @hbhalodiaย @himanshupathak95ย @Infinite-Nullย @jeryjย @jsnajdrย @juanfraย @louwie17ย @Mamadukaย @manzoorwanijkย @matiasbenedettoย @mcsfย @michalczaplinskiย @miminariย @mirkaย @ndiegoย @ntsekourasย @oandregalย @ockhamย @PARTHVATALIYAย @ramonjdย @SainathPoojaryย @SantosGuillamotย @sarthaknagoshe2002ย @snehapatil2001ย @Soeanย @Sukhendu2002ย @t-hamanoย @talldanย @tellthemachinesย @TylerB24890ย @tyxlaย @up1512001ย @vipul0425ย @yogeshbhutkarย @youknowriad

See you next year for Gutenberg 20.0! ๐ŸŽ‰

Thanks to @annezazu, @bernhard-reiter, @joen, @isabel_brison and @ndiego who helped with this release.

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

Whatโ€™s new in Gutenberg 19.8? (04 December)

โ€œWhatโ€™s new in GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses โ€˜blocksโ€™ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/โ€ฆโ€ 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 Editor.



Gutenberg 19.8. has been released and is available for download!

The latest release of the Gutenberg pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. entails a myriad of user experience improvements for selecting section styles, image manipulation and font handling. The DataViews layouts also received important improvements.ย 

Table of Contents

Section styles selector in toolbarย 

In zoom-out mode, users can now apply different sections styles and designs directly from the toolbar, cycling through them and inspecting them in the context of the rest of the page. This enhancementenhancement Enhancements are simple improvements to WordPress, such as the addition of a hook, a new feature, or an improvement to an existing feature. streamlines the decision-making and production process. (#67140)

Font family preview in dropdown

Another user experience improvement can be found in the list of fonts: Each font family is now previewed in the font picker dropdown and gives users a better indication as to what the font will look like. (67118)

The outcome of the Image manipulation methods are now better communicated in the blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. editor. The success notices are now displayed at the bottom of the editor. The notices also come with a handy Undo link to revert to the original if necessary. (67314)(67312)

Other Notable Highlights

DataViews improvements

This release also contains some Data View improvements. For instance,ย  the table layout received density options: A user can modify the amount of whitespace that is displayed per row on three levels: comfortable, balanced and compact.ย  (67170)ย  Developers working with the Dataviews can now make use of a new APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. to programmaticallyย  register and unregister fields for the various display methods. (67175).ย 

Block supports from experimental to stable.

๐Ÿ“ฃ Plugin authors and Theme builders might appreciate the stabilization of certain block support settings and functions. A separate make blogblog (versus network, site) post will explain the ins and outs. For now, you can read about it in two GitHubGitHub GitHub 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 by the repository owner. https://github.com/ PRs:ย  (67018) (66918).

Continue reading โ†’

#gutenberg, #gutenberg-new

Update on Phase 3: Collaboration efforts

Over the last year, Phase 3 of the GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses โ€˜blocksโ€™ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ roadmap has begun to take form and with it comes a need for an update around whatโ€™s been done, how to follow along, and what to expect going forward. This post seeks to provide answers at a high level view of these questions. As a reminder Phase 3 is centered around fostering seamless collaboration, tying together the user experience, and streamlining the content management flows to improve the way creators and teams work together within WordPress. As work progresses, feedback is needed and welcomed to ensure broader adoption.

Real-time collaboration

Over the last few months, Kevin Jahns, the author of Yjs, a popular framework for building collaborative applications has been sponsored by Automattic to work on real-time collaboration, after an initial experiment landed. He kicked off his efforts with some research and dialogue in this discussion issue. More recently, heโ€™s pulled together some prototypes ahead of sharing a full proposal for how to proceed. Right now, consider this work as being in a strong experimental stage without a final approach. The next step is to get the initial approach into a PR for folks to give feedback on and discuss openly.ย 

Below is a demo showing syncing content only relying on HTTPHTTP HTTP is an acronym for Hyper Text Transfer Protocol. HTTP is the underlying protocol used by the World Wide Web and this protocol defines how messages are formatted and transmitted, and what actions Web servers and browsers should take in response to various commands. APIs with the autosave interval set to 3 seconds. Because it relies on HTTP APIs, this demo would work on all WordPress instances:

Going a step further, you can see more demos in a recent update including adding y-webrtc into the experience to show how real time collaboration would work for users who can establish a peer-to-peer WebRTC connection.

Follow along in this dedicated GitHub issue and/or in the #feature-realtime-collaboration slackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. channel.

Async collaboration: In-line comments

An initial experiment for block-level inline comments landed with Gutenberg 19.6, breaking ground on the first of many async collaboration upgrades. At this point, another iteration on this initial feature is already planned and underway to refine the current experience further. If youโ€™d like to help test and shape the feature further, stay tuned for a dedicated call for testing or start testing today with this WordPress Playground instance and open issues in the Gutenberg GitHubGitHub GitHub 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 by the repository owner. https://github.com/ repository. The aim is to get early feedback and quickly iterate in order to land this new feature in an upcoming major WordPress release. Below is a look at the near term design slated to be shipped next with visuals for adding a comment, leaving a comment, toggling to see resolved comments, and the resulting view when looking at resolved comments:

Follow along in this dedicated GitHub issue.ย 

Adminadmin (and super admin) redesign: DataView & DataForm

DataViews is the foundational component of the initial overall admin design efforts. By design, these views are being built out only in the Site Editor, with a few efforts branching out including an experiment for a new, separate Posts experience using Data Views and an early Media Library powered by Data Views proof of concept.ย ย 

As a next step of the initial development of DataViews, the more recent DataForm API was later introduced in Gutenberg 18.8 with the aim to reduce expected duplication to create forms in Data Views. Work has continued progressively from there with DataViews and DataForm components influencing each otherโ€™s development. You can view each in their respective Storybook views: DataViews and DataForm.

Both of these components have been created with extensibility at the heart of everything being built! For now, pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. and agency developers can already start using the DataViews component for their WordPress customizations with two different Developer Blogblog (versus network, site) tutorials to get you started: Using Data Views to display and interact with data in plugins and Actions from Data Views: Adding images to the Media Library. If you want to go on a deeper dive, watch a recent hallway hangout that goes through both of these components with folks actively working on them. Expect a continual focus on extensibility as these components evolve. Below is a look at how DataViews comes together with the DataForm work with an easy option to quick edit within oneโ€™s pages:

Follow along in this dedicated DataViews component issue and this DataForm component issue. For early design work in this area and beyond, check out the biweekly design updates.


Thanks to @priethor @youknowriad @4thhubbard @matveb for reviewing this post and for @joen and @jameskoster for the design assets.

#gutenberg, #phase-3