What’s new in Gutenberg 20.4 and 20.5?

We’re catching up with these posts now, as they have not been posted in a while. Since the recent releases have been smaller in scope, this post combines updates from both the 20.4 (March 5) and 20.5 (March 20) releases.

Both versions introduce a collection of enhancements, 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 improvements. These updates concentrate on refining the editor experience, improving 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 ensuring consistent design. Additionally, the releases incorporate under-the-hood updates focused on code quality and performance.

  • 20.4 (5 March)
    • Persist the user’s ‘Show Template’ preference in the editor
    • 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. 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. now supports sorting posts by menu order
    • Changelog
  • 20.5 (20 March)
    • The create-block package now supports blocks manifest and relevant CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. APIs by default
    • Changelog

20.4 (5 March) – Highlights

Persist the user’s ‘Show Template’ preference in the editor

The editor now remembers the ‘Show Template’ preference set by the user and uses it as the default rendering mode. (69286)

Query Loop Block now supports sorting posts by menu order

The Query Loop block now lets users sort posts by their menu order, in both ascending and descending order, for post types that support it. (68781)

Changelog

Enhancements

  • Generate built CSSCSS Cascading Style Sheets. file containing the adminadmin (and super admin) color theme CSS custom properties. (69128)

Post Editor

  • Editor: Conditionally enable the new default rendering mode for Pages. (69160)
  • Editor: Persist user’s ‘Show Template’ preference. (69286)
  • Editor: Restore starter content modal. (69081)
  • Post Template Panel: Display popover on the left side of the 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.. (69134)

Block Library

  • Post Navigation Link: Enable all non-interactive formats. (69325)
  • Pullquote: Adding missing alignment style. (68121)
  • Query Loop: Add menu_order as sorting option. (68781)

Site Editor

  • Enhance 404 message styling. (69234)

Media

  • Media Utils: Restrict file uploads with multiple prop in uploadMedia and mediaUpload. (69175)

Components

  • BorderControl: Always show Reset button. (69066)

Block Editor

  • Block Action: Implement cut functionality in block actions and settings menu. (68554)

Global Styles

  • Allow :Focus-visible pseudo-selector to be set in 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.. (68521)

Design Tools

  • Post Comments Count: Add Border Support. (68223)

Bug Fixes

  • Core Data: Allow ‘null’ as raw attribute value. (69257)
  • Dataviews: Fix alignment issue of “Title” 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.. (68840)
  • Fix addQueryArgs and removeQueryArg on URLs with fragments. (69313)
  • Post formats: Make title and description human readable. (69275)
  • Site Editor: Fix back link from “Navigation” sub-menus in mobile web. (69192)
  • TextControl: Fix text direction for URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org and email fields in block editor for RTL languages. (68561)

Block Library

  • Fix: Extra top and bottom margin issue in Social Link block for classic theme below twenty twenty. (69100)
  • Make navigation block wavy underline more visible on dark backgrounds. (69004)
  • Template Part block: Guard against get_block_file_template returning null. (69309)
  • Video Block: Disable autoplay when video is not muted. (69232)

Post Editor

  • Editor: Add an extra check before enabling the new default rendering mode for Pages. (69209)
  • Editor: Avoid a ‘flash’ when rendering in ‘template-locked’ mode. (69173)
  • Editor: Revert bulk editing support for post actions. (69341)

Site Editor

  • Fix space on the left or right of the menu in mobile view. (69327)
  • Show pattern categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. step in navigation for mobile. (69206)
  • Site Hub: Navigate correctly in mobile view. (69157)

Components

  • Notice: Fix text contrast for dark mode. (69226)
  • NumberControl: Fix invalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid. HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. attributes for infinite bounds. (69033)

Colors

  • Format Library: Prevent the text and color picker from overlapping. (69169)
  • Format Library: Text-color popover width to fit sidebar. (68881)

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: Revert “Handle styles assets on region-based navigation”. (69222)

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

  • Fix typo for ‘ignore_sticky_posts’ 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. (69171)

Block Editor

  • Inserter: Hide drag-and-drop help text on mobile devices when previewing patterns. (69159)

Block 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.

  • Fix duplicated insertion in Post Content. (69142)

REST API

  • Adds the site reading options to the index. (69106)

Block API

  • Block support: Add server-side processing for ariaLabel. (69096)

Document Outline

  • Show heading blocks when template-lock is enabled. (69073)

Media

  • Improve display of error returned from the REST API when an unsupported image type is uploaded. (68788)

Accessibility

Components

  • Cover: Fix placeholder color options keyboard accessibility. (68662)
  • InputControl: Ensure consistent placeholder color. (69334)

Post Editor

  • Improve the EntitiesSavedStates modal dialog design and labeling. (67792)
  • Swap fullscreen mode snackbar notice message. (69305)

Patterns

  • Close patterns modal on insertion and focus on inserted pattern. (68975)

Block Editor

  • Fix CSS classes for the post editor 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. body. (68481)

Performance

Interactivity API

  • Introduce withSyncEvent action wrapper utility and proxy event object whenever it is not used. (68097)

Documentation

  • Added Missing Double Quote in Number Control. (69207)
  • Added Missing Global Documentation in Query Total Block. (69233)
  • Added php.net/date links. (69280)
  • Components: Fix typo for notice color in readme.md. (69204)
  • Docs: Add Documentation for Adding Block Variations Using get_block_type_variations Hook. (68434)
  • Docs: Removes notes about Block Hooks only supporting static theme elements. (65455)
  • Fix Syntax Issue in Documentation. (69166)
  • Fix typo incorrect article before “user interface”. (69168)
  • FontSizePicker: Fix FontSizePicker Storybook control type and improve documentation. (68936)
  • Update javascriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com/.-in-the-block-editor.md – fix link. (62431)
  • docs: Correction in plugin-sidebar-0.md. (69268)

Code Quality

  • Fields: Avoid ‘useSelect’ warnings in the template component. (69344)
  • Remove unnecessary opacity override for Firefox placeholders. (69312)
  • Revert “Feature: Add navigation.isLoading state to core/router store (#67680)”. (69330)

Post Editor

  • Editor: Use a stable array ref as fallback value in ‘BlockVisibility’. (69288)

Site Editor

  • Test: Add end-to-end test for 404 page. (69272)

Tools

Testing

  • ESLint: Improve lint regex for preventing “toggle” word usage in translationtranslation The process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. ready functions. (68958)
  • Media Utils: Add tests for new error behavior. (69215)
  • Performance Tests: Update method for creating sample content. (69210)
  • Tests: Fix preloading end-to-end test. (69228)
  • end-to-end Tests: Add Block Hooks Test Coverage. (69044)

Various

Plugin

  • ESLint: Add rule to prevent usage of the word ‘sidebar’ in translatable strings. (68894)

Post Editor

  • Update template-related messages to improve clarity for custom post types. (67722)

First-time contributors

The following PRs were merged by first-time contributors:

  • @alexchrysovergis: Fix typo incorrect article before “user interface”. (69168)
  • @andreawetzel: Components: Fix typo for notice color in readme.md. (69204)
  • @kellymears: docs: Correction in plugin-sidebar-0.md. (69268)

Contributors

The following contributors merged PRs in this release:

@adamsilverstein @afercia @alexchrysovergis @andreawetzel @benazeer-ben @carolinan @DAreRodz @davilera @fabiankaegy @felixarntz @himanshupathak95 @huubl @im3dabasia @Infinite-Null @jonathanbossenger @juanmaguitar @kellymears @Mamaduka @ockham @Rishit30G @SainathPoojary @shail-mehta @shimotmk @singhakanshu00 @snehapatil2001 @stokesman @Sukhendu2002 @swissspidy @t-hamano @yogeshbhutkar


20.5 (20 March) – Highlights

The create-block package now supports blocks manifest and relevant Core APIs by default

Blocks created using the create-block package now include a block manifest file by default, making it easier to manage metadata and improving performance when working with multiple block types. (69446)

Pre-publish panel: Do not show suggestions for tags and categories if there are none.

The conditions that determine if the pre-publish panel should show suggestions to add categories or tags have been updated if no categories or tags are added. (69453)

Changelog

Enhancements

  • Admin bar: Update the Edit Site link. (69271)
  • Enhance create-block package to support blocks manifest and relevant Core APIs by default. (69446)
  • Remove trailing periods from Show or hide settings panel. (69356)
  • Site Editor: Make current theme and editor settings available to route area resolvers. (69299)

Block Library

  • Button Block: Add draft page creation capability. (69368)
  • Query Total: Update the block color support settings. (69500)

Block Editor

  • BlockEditor: Resolve MediaReplaceFlow UIUI User interface text inconsistency. (69546)

Site Editor

  • Add period to Design description. (69537)

Post Editor

  • Pre-publish panel: Do not show suggestions for tags and categories if there are none. (69453)

DataViews

  • DataView Actions Modal: Allow customizable modal size through props. (69302)

Bug Fixes

Block Library

  • Archives Block: Fix showLabel default state. (69469)
  • Comment Template: Use fallback when there’s an 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. error. (69422)
  • Fix: Show the author and author name examples in the Stylebook. (69436)
  • Image block: Unwrap img element in editor. (68666)
  • Latest Posts: Make Latest Posts block consistent with sticky posts display. (69428)
  • Query Total: Prevent stricted type fatal errors on post per page. (69508)
  • Social Icons: Disable edit as HTML support. (69374)
  • Spacer: Revert height defaults to 100px if left unset. (69450)
  • SpacerControls: Default the height to 100px if left unset. (68819)
  • Table Of Contents: Include headings exclusively within the core/post-content block. (69366)

Site Editor

  • Classic themes: Prevent access to parts of the Site Editor. (69473)
  • Hide admin bar in classic theme site preview. (69514)
  • Prevent access to the Design/Styles screen from classic themes without StyleBook support. (69377)
  • Show save panel in mobile layout. (69448)
  • Site Editor Sidebar: Fix header scrolling in mobile layout. (69413)

Global Styles

  • Shadow, Duotone: Fix reset button style. (69471)
  • ShadowsPanel: Remove Flex Wrapper from Subtitle. (69541)

Post Editor

  • Autocompleters: Change user slug color. (69003)
  • Editor: Fix ‘slug’ editing in ‘template-locked’ mode. (69516)

Document Settings

  • Editor: Use disabled state for ‘Change template’ menu item. (69558)

Style Book

  • Classic theme site preview: Make all interactive elements unclickable. (69522)

Document Outline

  • Disable selection for non-content headings. (69506)

Block Editor

  • Fix error from popover scroll hook. (69479)

REST API

  • Add additional default template data fields for the active theme. (69417)

Block Directory

  • Fix installations for ‘template-locked’ mode. (69394)

Layout

  • Layout Support: Replace incremental IDs with hashes. (68210)

Accessibility

Post Editor

  • Editor: Refactor the ‘PostVisibility’ component. (69451)
  • Make password protected input fields consistent. (69440)

Components

  • Button: Remove fixed width from small and compact buttons with icons. (69378)
  • Remove non translatable additional info from font size picker visual label and improve labeling. (69011)

Block Editor

  • ARIA: Fix invalid DropdownMenu children structure. (69441)

Block Library

  • Site Title: Fix logic for ‘aria-current’ attribute. (68909)

Performance

Post Editor

  • Editor: Optimize queries for ‘useAllowSwitchingTemplates’ hook. (69560)
  • Editor: Optimize selector queries for Homepage and Posts Page actions. (69461)
  • Editor: Preload template lookup. (69454)

Site Editor

  • Fix template lookup preloading for non-draft pages. (69400)

Experiments

  • Added Missing Trailing periods in Experiment Settings Page. (69395)

Documentation

  • Docs/update reference to JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. build setup 404 in scripts README, fix absolute links. (69495)
  • Fix: Update invalid JSON Schema link in README.md. (69505)
  • Update documentation about wp-scripts build-blocks-manifest in relation to new WordPress 6.8 function. (69445)

Code Quality

  • Alignment note with WordPress report 62426. (69519)
  • Core Data: Update ‘__unstableBase’ entity types. (69556)

Block Library

  • Audio Block: Refactor setting panel to use ToolsPanel. (69324)

Global Styles

  • Removed color.__experimentalDuotone from core blocks. (58241)

Tools

Testing

  • Restore post preview end-to-end tests. (69447)
  • Skip failing post preview end-to-end tests. (69429)
  • Template UI mu-plugin: Run 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. after the setup_theme action. (69542)

Various

Plugin

  • Update hierarchical data compat directory. (69550)

First-time contributors

The following PRs were merged by first-time contributors:

  • @Anuj-Rathore24: Fix: Update invalid JSON Schema link in README.md. (69505)
  • @bschneidewind: Site Title: Fix logic for ‘aria-current’ attribute. (68909)
  • @dontfeedthecode: Docs/update reference to JS build setup 404 in scripts README, fix absolute links. (69495)
  • @sabbir1991: Removed color.__experimentalDuotone from core blocks. (58241)
  • @SirLouen: Alignment note with WordPress report 62426. (69519)

Contributors

The following contributors merged PRs in this release:

@afercia @Anuj-Rathore24 @bschneidewind @carolinan @cbravobernal @DAreRodz @dhruvikpatel18 @dontfeedthecode @felixarntz @HILAYTRIVEDI @himanshupathak95 @im3dabasia @Infinite-Null @Mamaduka @sabbir1991 @SainathPoojary @shail-mehta @shimotmk @SirLouen @stokesman @t-hamano @yogeshbhutkar


Props to @yogeshbhutkar for writing the post and @luminuu and @bph reviewing it.

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