Title: What’s new in Gutenberg? (25 March) Author: Ella Van Durpe Published: March 26, 2020 Last modified: June 2, 2020 --- [ ](https://profiles.wordpress.org/ellatrix/) [Ella Van Durpe](https://profiles.wordpress.org/ellatrix/) 1:45 pm _on_ March 26, 2020 Tags: [core-editor ( 762 )](https://make.wordpress.org/core/tag/core-editor/), [editor ( 223 )](https://make.wordpress.org/core/tag/editor/), [gutenberg ( 554 )](https://make.wordpress.org/core/tag/gutenberg/), [gutenberg-new ( 221 )](https://make.wordpress.org/core/tag/gutenberg-new/)    # What’s new in Gutenberg? (25 March) This release is mostly focused on polish work for 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. UIUI User interface redesign. ![Screen Capture on 2020-03-16 at 15-49-00](https://user-images.githubusercontent. com/2322354/76795441-8bbb7280-679f-11ea-8870-b3d91cd94d51.gif) It also includes an official 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 register custom Block patterns from themes and plugins. The API is still a work-in-progress and might evolve before reaching WordPress CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. ```notranslate register_pattern( 'my-plugin/my-awesome-pattern', array( 'title' => __( 'Two buttons' ), 'content' => "\n
\n
Button One
\n\n\n\n
Button Two
\n
\n", ) ); ``` ## 7.8 ## Enhancements * Add visible labels to BlockPatternPicker pattern selection buttons [19789](https://github.com/WordPress/gutenberg/pull/19789) * Adds always on display of media URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org [19504](https://github.com/WordPress/gutenberg/pull/19504) * Adds current menu class to navigation block [20076](https://github.com/WordPress/gutenberg/pull/20076) * Block: Outline when interacting with Toolbar Block Type/Movers [20938](https://github.com/WordPress/gutenberg/pull/20938) * Create block: Improve how prompts and values provided are handled [20756](https://github.com/WordPress/gutenberg/pull/20756) * Expand create block options and add readme.txt template [20694](https://github.com/WordPress/gutenberg/pull/20694) * Patterns: Make adding patterns easier [20854](https://github.com/WordPress/gutenberg/pull/20854) * Polish a few icons [20980](https://github.com/WordPress/gutenberg/pull/20980) * Polish date-picker component [20824](https://github.com/WordPress/gutenberg/pull/20824) * Improve permalink editing [12009](https://github.com/WordPress/gutenberg/pull/12009) * Nicer block footprint for social links [20978](https://github.com/WordPress/gutenberg/pull/20978) * Show inserter only when block selected for nesting contexts [20753](https://github.com/WordPress/gutenberg/pull/20753) * URL: Use test data from web-platform-tests for isURL spec conformance [20537](https://github.com/WordPress/gutenberg/pull/20537) * Adds multi-select to categories on Latest Posts [20781](https://github.com/WordPress/gutenberg/pull/20781) * Add basic nav block example for inserter and styles previews [21011](https://github.com/WordPress/gutenberg/pull/21011) ## Bug Fixes * Allow media library in gallery mode to be reset [20675](https://github.com/WordPress/gutenberg/pull/20675) * Autocomplete: Add support for results with long titles [20962](https://github.com/WordPress/gutenberg/pull/20962) * Compat: Conditionally filterFilter Filters are one of the two types of Hooks [https://codex.wordpress.org/Plugin_API/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. editor settings for image dimensions [20939](https://github.com/WordPress/gutenberg/pull/20939) * Compat: Use core-js-url-browser for URL polyfill [20225](https://github.com/WordPress/gutenberg/pull/20225) * Data: Migrate post editor persistence with fullscreenMode false [21082](https://github.com/WordPress/gutenberg/pull/21082) * Edit Post: Make 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. 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. focusable for button focus normalization [21031](https://github.com/WordPress/gutenberg/pull/21031) * Fix auto-hiding appender regressionregression A software bug that breaks or degrades something that previously worked. Regressions are often treated as critical bugs or [blockers](https://make.wordpress.org/core/2020/03/26/whats-new-in-gutenberg-25-march/?output_format=md#blocker). 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. [20780](https://github.com/WordPress/gutenberg/pull/20780) * Fix fullscreen mode device preview [21010](https://github.com/WordPress/gutenberg/pull/21010) * Fix link control search results spacing. [21003](https://github.com/WordPress/gutenberg/pull/21003) * Fix snackbar container block portion of UI while present [21000](https://github.com/WordPress/gutenberg/pull/21000) * Make the inner button block not allowed as a reusable block or editable as HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. [20948](https://github.com/WordPress/gutenberg/pull/20948) * URL: Fix getQueryString incorrect handling of hash fragment [20738](https://github.com/WordPress/gutenberg/pull/20738) * Update social links block to output a custom class on each individual link [20998](https://github.com/WordPress/gutenberg/pull/20998) * Update the inserter’s block preview to use the AutoHeightPreview [20817](https://github.com/WordPress/gutenberg/pull/20817) * Latest Posts: - Fix link for read more markup [20917](https://github.com/WordPress/gutenberg/pull/20917) - Fixes the categories selector crash when categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. does not exist [20960](https://github.com/WordPress/gutenberg/pull/20960) * Fix input rules [20964](https://github.com/WordPress/gutenberg/pull/20964) * Trim input value in navigation search input field [19832](https://github.com/WordPress/gutenberg/pull/19832) * Fix mobile header [20946](https://github.com/WordPress/gutenberg/pull/20946) * Fix visually hidden classnames [20649](https://github.com/WordPress/gutenberg/pull/20649) * Fix/screen reader text [20607](https://github.com/WordPress/gutenberg/pull/20607) * Fix SelectControl example code synax highlight [19803](https://github.com/WordPress/gutenberg/pull/19803) ## New APIs * Add initial API to register patterns from themes and plugins [21074](https://github.com/WordPress/gutenberg/pull/21074) * Convert __experimentalCreateInterpolateElement to a stable API [20699](https://github.com/WordPress/gutenberg/pull/20699) ## Experiments * Site Editor: - Add Fullscreen mode [20691](https://github.com/WordPress/gutenberg/pull/20691) - Add fullscreen close button [20989](https://github.com/WordPress/gutenberg/pull/20989) - Add more menu and fullscreen toggle [21006](https://github.com/WordPress/gutenberg/pull/21006) - Style resets for top level page [20886](https://github.com/WordPress/gutenberg/pull/20886) - Get current template part correctly for auto drafts [20438](https://github.com/WordPress/gutenberg/pull/20438) - Add template preview to the edit site template switcher [20958](https://github.com/WordPress/gutenberg/pull/20958) - Add things required to load custom blocks to Site Editor page [20549](https://github.com/WordPress/gutenberg/pull/20549) - Avoid page templates overwriting page title [20865](https://github.com/WordPress/gutenberg/pull/20865) * Lighter block DOM: - Group [20586](https://github.com/WordPress/gutenberg/pull/20586) - Navigation [20729](https://github.com/WordPress/gutenberg/pull/20729) * Navigation Block: - Fix dynamic rendering recursive function name typo [21078](https://github.com/WordPress/gutenberg/pull/21078) - Avoid hiding submenu when adding a link [21035](https://github.com/WordPress/gutenberg/pull/21035) - Fix toolbar overlap on navigation links [21033](https://github.com/WordPress/gutenberg/pull/21033) * PlainText v2 [21076](https://github.com/WordPress/gutenberg/pull/21076) - Editable Component [18361](https://github.com/WordPress/gutenberg/pull/18361) ## Documentation * Add ESNext example for unregisterBlockType [20784](https://github.com/WordPress/gutenberg/pull/20784) * Docs/SlotFills: Small update for consistency [20767](https://github.com/WordPress/gutenberg/pull/20767) * Correct 2nd param of useViewportMatch() usage [20911](https://github.com/WordPress/gutenberg/pull/20911) * Include `npm run dev` guidance in “Getting Started” [21015](https://github.com/WordPress/gutenberg/pull/21015) * Document default login credentials and `wp-env run` command [20678](https://github.com/WordPress/gutenberg/pull/20678) * Fixes docblockdocblock (phpdoc, xref, inline docs) for useViewportMatch [20919](https://github.com/WordPress/gutenberg/pull/20919) * Lowercase visual editor and code editor to match block editor and classic editor [20968](https://github.com/WordPress/gutenberg/pull/20968) * Update README.md [20913](https://github.com/WordPress/gutenberg/pull/20913) * Add Custom Block Editor to TOC and Manifest [20749](https://github.com/WordPress/gutenberg/pull/20749) * Add tutorial link to Table of Contents for Custom Block Editor [20750](https://github.com/WordPress/gutenberg/pull/20750) ## Code Quality * Block Editor: Use useResizeObserver in place of direct reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. [https://reactjs.org](https://reactjs.org/)- resize-aware dependency [20889](https://github.com/WordPress/gutenberg/pull/20889) * E2E Test Utils: Improve durability of embedding matcher [20811](https://github.com/WordPress/gutenberg/pull/20811) * Framework: Migrate/remove temporary compatibility script initialization [19178](https://github.com/WordPress/gutenberg/pull/19178) * Framework: Use WHATWG URL in place of legacy url module [19823](https://github.com/WordPress/gutenberg/pull/19823) * Nav Block: Remove ‘frontend’ from style comments [21034](https://github.com/WordPress/gutenberg/pull/21034) * Project Management Automation: Add TypeScript type-checking [20850](https://github.com/WordPress/gutenberg/pull/20850) * Refactor the inserter menu component and split into multiple smaller components [20880](https://github.com/WordPress/gutenberg/pull/20880) * Remove 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. from content elements [20976](https://github.com/WordPress/gutenberg/pull/20976) * Update Search/RSS block render method [20977](https://github.com/WordPress/gutenberg/pull/20977) ## Various * Update glossary [20934](https://github.com/WordPress/gutenberg/pull/20934) * Improve performance testing [20802](https://github.com/WordPress/gutenberg/pull/20802) * Edit Post: Register block patterns as separate 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/](https://wordpress.org/plugins/) or can be cost- based plugin from a third-party. [20871](https://github.com/WordPress/gutenberg/pull/20871) * 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): updated headings to reflect semantic relationship between html 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.) and it’s content. [16444](https://github.com/WordPress/gutenberg/pull/16444) * Add Prettier shared config package [20026](https://github.com/WordPress/gutenberg/pull/20026) * Add default styles to the TabPanel component [20872](https://github.com/WordPress/gutenberg/pull/20872) * Add isFileURL method and use it on all native media upload checks. [20985](https://github.com/WordPress/gutenberg/pull/20985) * Add menus endpoints. [20292](https://github.com/WordPress/gutenberg/pull/20292) * Block Patterns: Update text-two-columns.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. [20890](https://github.com/WordPress/gutenberg/pull/20890) * Block Styles: Remove the block margin in the style selector [19983](https://github.com/WordPress/gutenberg/pull/19983) * Block patterns: improve success notice [21005](https://github.com/WordPress/gutenberg/pull/21005) * Blocks: Allow the Default Style selector to be hidden. [20620](https://github.com/WordPress/gutenberg/pull/20620) * E2E Tests: Mock Embed response for InnerBlocks locking test [20481](https://github.com/WordPress/gutenberg/pull/20481) * ESLint Plugin: Relax `prefer-const` for destructuring assignment [20737](https://github.com/WordPress/gutenberg/pull/20737) * Gallery: Update UI of controls [20776](https://github.com/WordPress/gutenberg/pull/20776) * Improves RTL style conversion [20503](https://github.com/WordPress/gutenberg/pull/20503) * Minor change to switch Help link target to _blank, add rels [20800](https://github.com/WordPress/gutenberg/pull/20800) * Mobile: Add accessibility label to Block List Footer [20633](https://github.com/WordPress/gutenberg/pull/20633) * Moves category multi select from LatestPosts to QueryControls [20832](https://github.com/WordPress/gutenberg/pull/20832) * Paste: replace iframes with url [20983](https://github.com/WordPress/gutenberg/pull/20983) * Polish poster image button arrangement. [20754](https://github.com/WordPress/gutenberg/pull/20754) * Preview Button: Remove the separator and border, and reduce the size of the icon. [20683](https://github.com/WordPress/gutenberg/pull/20683) * RangeControl: Improve disabled rendering and interactions [20723](https://github.com/WordPress/gutenberg/pull/20723) * Reduce gap between block library and preview [20777](https://github.com/WordPress/gutenberg/pull/20777) * Remove aria-expanded from close button in Publish panel [20993](https://github.com/WordPress/gutenberg/pull/20993) * Remove feature flag for mobile page templates [20718](https://github.com/WordPress/gutenberg/pull/20718) * Remove inaccurate message from image block [20909](https://github.com/WordPress/gutenberg/pull/20909) * Removed the textarea width restriction for the 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. block [20624](https://github.com/WordPress/gutenberg/pull/20624) * Revert “Framework: Travis: Avoid skipping Puppeteer download” [20828](https://github.com/WordPress/gutenberg/pull/20828) * Show errors in the media replace control [19244](https://github.com/WordPress/gutenberg/pull/19244) * Styles Panel: Don’t force it to be closed by default. [20617](https://github.com/WordPress/gutenberg/pull/20617) * Update 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. Item icon [20763](https://github.com/WordPress/gutenberg/pull/20763) * Update page template picker after design review [20883](https://github.com/WordPress/gutenberg/pull/20883) * Latest Posts: Testing larger margins [20563](https://github.com/WordPress/gutenberg/pull/20563) * Add codeowners for env package [20667](https://github.com/WordPress/gutenberg/pull/20667) * Scripts: Update all webpack related dependencies [20916](https://github.com/WordPress/gutenberg/pull/20916) * Dependencies webpack plugin: Let the output file be specified when output is combined [20844](https://github.com/WordPress/gutenberg/pull/20844) ## Performance Benchmark The following benchmark compares performance for a particularly sizeable post (~ 36000 words, ~1000 blocks) over the last releases. Such a large post isn’t representative of the average editing experience but is adequate for spotting variations in performance. | **Version** | **Loading Time** | **KeyPress event (typing)** | | 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/](https://wordpress.org/gutenberg/) 7.8 | 5193ms | 23.05ms | | Gutenberg 7.7 | 5134ms | 22.79ms | | WordPress 5.3 | 9512ms | 25.83ms | [#core-editor](https://make.wordpress.org/core/tag/core-editor/), [#editor](https://make.wordpress.org/core/tag/editor/), [#gutenberg](https://make.wordpress.org/core/tag/gutenberg/), [#gutenberg-new](https://make.wordpress.org/core/tag/gutenberg-new/) ### Share this: * [ Threads ](https://make.wordpress.org/core/2020/03/26/whats-new-in-gutenberg-25-march/?share=threads) * [ Mastodon ](https://make.wordpress.org/core/2020/03/26/whats-new-in-gutenberg-25-march/?share=mastodon) * [ Bluesky ](https://make.wordpress.org/core/2020/03/26/whats-new-in-gutenberg-25-march/?share=bluesky) * [ X ](https://make.wordpress.org/core/2020/03/26/whats-new-in-gutenberg-25-march/?share=x) * [ Facebook ](https://make.wordpress.org/core/2020/03/26/whats-new-in-gutenberg-25-march/?share=facebook) * [ LinkedIn ](https://make.wordpress.org/core/2020/03/26/whats-new-in-gutenberg-25-march/?share=linkedin) 1. ![](https://secure.gravatar.com/avatar/3ee25ec15c79a0ce794f8e935172908bcf82b3173be6a641e10eaaf2e991ac97? s=32&d=mm&r=g) 2. [Towfiq I.](https://profiles.wordpress.org/tislam100/) 2:25 pm _on_ March 26, 2020 3. So no more **14px** margins around blocks in the editor? 4. ![](https://secure.gravatar.com/avatar/f8b3e78da513af70d22b0a942297a300eef15e3ce8080e877c054ebb83e24d82? s=32&d=mm&r=g) 5. [John James Jacoby](https://profiles.wordpress.org/johnjamesjacoby/) 2:07 am _on_ March 31, 2020 6. Is it too late to consider renaming the pattern functions? 7. There have already existed multiple different patterns in WordPress for almost 15 years. Permalinks, specifically, but also many different regular expression patterns for post types, taxonomies, and those kinds of things. 8. IMO, `un/register_block_pattern()` seem like obvious alternatives, and “Pattern” by itself is not really a descriptive enough noun to guarantee collisions would not happen with some other future pattern related concept. (Imagine a `register_type()` function being proposed before custom post types existed, which would have been similarly vague.) 9. Sorry if these were discussed already. 10. * ![](https://secure.gravatar.com/avatar/c5876422a37fd6194f1443154e5b8dc0920c99df2e3cc83f3d146bf34992abc5? s=32&d=mm&r=g) * [Mark Uraine](https://profiles.wordpress.org/mapk/) 8:19 pm _on_ March 31, 2020 * Hey JJJ. It looks like you’re concerned about how the patterns are referred to in the code. I think keeping the `block_patterns` naming convention could work. In the UIUI User interface, we’d most likely refer to them simply as “ Patterns” though. For instance in the case of the Inserter, we’re exploring two tabbed sections; “Blocks” and “Patterns.” - ![](https://secure.gravatar.com/avatar/f8b3e78da513af70d22b0a942297a300eef15e3ce8080e877c054ebb83e24d82? s=32&d=mm&r=g) - [John James Jacoby](https://profiles.wordpress.org/johnjamesjacoby/) 11: 01 pm _on_ March 31, 2020 - Correct. As I said, the functions (not the UIUI User interface.) - The UI will always be much more adaptable than the internal workings of the 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., which will basically be there forever. - un/register_pattern() seems too vague un/register_block_pattern() feels right, to me - ![](https://secure.gravatar.com/avatar/19064ed4f839086c8fd557e5d00c62cdb52cdba868e6bf100a64d8a4f0974aed? s=32&d=mm&r=g) - [Mike Schinkel [WPLib Box project lead]](https://profiles.wordpress.org/mikeschinkel/) 1:57 am _on_ April 3, 2020 - +1 to [@JJJ](https://profiles.wordpress.org/jjj/)‘s concern. - In the future when we need to register some other pattern it will be confusing to have: - ```notranslate register_pattern() ``` - vs. - ```notranslate register_new_thing_pattern() ``` 11. ![](https://secure.gravatar.com/avatar/3f620d7e5627cf552b3edc88e4f9221944a5c65d21375e27ee1c3240cce5f1d4? s=32&d=mm&r=g) 12. [samjco](https://profiles.wordpress.org/samjco/) 11:50 am _on_ May 15, 2020 13. Here are my thoughts and ideas… 14. I think that it would be much cleaner if: 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. patterns opened in a popup showing the categories on one side (1/3) and the block pattern choices, based on cat selection, on the other side (2/3). 15. And… It would be nice to allow the community to build custom patterns (based on categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. e.g: 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.. Hero, etc) and add them to a “Block Pattern Repository” so users can add them to Gutenburg the same way we do 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/](https://wordpress.org/plugins/) or can be cost-based plugin from a third-party. and themes. 16. Some patterns in the repo can be dynamic (maybe packing a 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. somewhere) and static to be edited in the editor. 17. So then the theme block builders (who might phase-out because of Patterns) can focus their attention on building “Dynamic Block Patterns” that can be added to the Block Pattern Repository that we can add to out Gutenburn block library. 18. My two cents Comments are closed. # Post navigation [← Dev Chat Agenda for March 25, 2020 (5.4 Week 11)](https://make.wordpress.org/core/2020/03/25/dev-chat-agenda-for-march-25-2020-5-4-week-11/) [Dev Chat summary – March 25, 2020 →](https://make.wordpress.org/core/2020/03/26/dev-chat-summary-march-25-2020/)