Title: What’s new in Gutenberg? (17th April) Author: Riad Benguella Published: April 17, 2019 Last modified: May 20, 2020 --- [ ](https://profiles.wordpress.org/youknowriad/) [Riad Benguella](https://profiles.wordpress.org/youknowriad/) 11:53 am _on_ April 17, 2019 Tags: [core-editor ( 761 )](https://make.wordpress.org/core/tag/core-editor/), [editor ( 223 )](https://make.wordpress.org/core/tag/editor/), [gutenberg ( 553 )](https://make.wordpress.org/core/tag/gutenberg/), [gutenberg-new ( 220 )](https://make.wordpress.org/core/tag/gutenberg-new/)    # What’s new in Gutenberg? (17th April) More than 48 contributors participated in this 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/) release. It marks the addition of the very expected **Group** 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. (sometimes referred to as container or section block). It’s a minimal version at the moment and improvements about the flows to add inner blocks, group/ungroup blocks are expected in follow- up releases. ![](https://make.wordpress.org/core/files/2019/04/Capture-d%E2%80%99e%CC%81cran- 2019-04-17-a%CC%80-10.53.37-AM-e1555495475329-1024x691.png) The 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 from this release will be backported to WordPress CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. in order to ship in the upcoming WordPress 5.2 release. This release includes a lot of improvements to existing blocks and flows. ![](https://make.wordpress.org/core/files/2019/04/media-text-vertical-align-small- 1.gif) Enhanced Media & Text Block ![](https://make.wordpress.org/core/files/2019/04/resizers-1.gif) Resizing blocks and images ## 5.5 ### Features * Add a new [Group](https://github.com/WordPress/gutenberg/pull/13964) [block](https://github.com/WordPress/gutenberg/pull/14920). * Add [vertical alignment](https://github.com/WordPress/gutenberg/pull/13989) support to the Media & Text block. * Add [the image fill option](https://github.com/WordPress/gutenberg/pull/14445) to the Media & Text block. ### Enhancements * Improvements to the [Image Block](https://github.com/WordPress/gutenberg/pull/14142) [flows](https://github.com/WordPress/gutenberg/pull/14807). * Automatically [add `mailto:` to email addresses](https://github.com/WordPress/gutenberg/pull/14857) when linking. * Add [visual handles for side resizers](https://github.com/WordPress/gutenberg/pull/14543) for various blocks. * Improve the [performance of the](https://github.com/WordPress/gutenberg/pull/14664) [annotations](https://github.com/WordPress/gutenberg/pull/14808) by avoiding excessive memoization. * Announce the [color accessibility issues](https://github.com/WordPress/gutenberg/pull/14649) to screen readers. * Add [enum block attributes validation](https://github.com/WordPress/gutenberg/pull/14810) to browser block parser. * Use a [consistent grey background](https://github.com/WordPress/gutenberg/pull/14719) in 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. * 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) of video block [select poster image](https://github.com/WordPress/gutenberg/pull/14752). * Respect [prefers-reduced-motion for fixed backgrounds](https://github.com/WordPress/gutenberg/pull/14848) in Cover block. * Prevent ArrowLeft key press in multi-line selection from [prematurely triggering multi-selection](https://github.com/WordPress/gutenberg/pull/14906). ### Bug Fixes * Avoid keeping the [RichText value in cache](https://github.com/WordPress/gutenberg/pull/14750) indefinitely. * Fix the [post title input borders](https://github.com/WordPress/gutenberg/pull/14771) in the code editor. * Fix the [block restrictions](https://github.com/WordPress/gutenberg/pull/14003) to insert, replace or move blocks. * [Select gallery images](https://github.com/WordPress/gutenberg/pull/14813) on focus. * Fix [removing gallery images](https://github.com/WordPress/gutenberg/pull/14822) on delete/backspace key press. * Fix small visual 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/2019/04/17/whats-new-in-gutenberg-17th-april/?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. in the [block autocompete popover](https://github.com/WordPress/gutenberg/pull/14772). * Fix the data module[ resolver resolution status](https://github.com/WordPress/gutenberg/pull/14711). * Avoid [saving metaboxes when previewing](https://github.com/WordPress/gutenberg/pull/14877) [changes](https://github.com/WordPress/gutenberg/pull/14894). * Fix [selecting the separator block](https://github.com/WordPress/gutenberg/pull/14854). * Fix displaying the [color palette](https://github.com/WordPress/gutenberg/pull/14693) [tooltips](https://github.com/WordPress/gutenberg/pull/14944) on hover. * Fix Firefox/NVDA bug not [announcing the toggle settings](https://github.com/WordPress/gutenberg/pull/14475) button. * Fix [arrow navigation in paragraph](https://github.com/WordPress/gutenberg/pull/14804) blocks with backgrounds. * Fix the [columns block click to select](https://github.com/WordPress/gutenberg/pull/14876). * Fix [post dirtiness](https://github.com/WordPress/gutenberg/pull/14916) after fetching reusable blocks. * Fix the hover and focus styles for [buttons with the isBusy](https://github.com/WordPress/gutenberg/pull/14469) prop. * Remove the box [shadow from the side inserter](https://github.com/WordPress/gutenberg/pull/14936) button. * Changing the [region navigation shortcuts](https://github.com/WordPress/gutenberg/pull/14681) to avoid conflicts. * Fix [space insertion in the Button block](https://github.com/WordPress/gutenberg/pull/14925) in Firefox. * Prevent the [link popover from animating constantly](https://github.com/WordPress/gutenberg/pull/14938) as we type. * Fix the warning triggered by [clearing the height of the spacer block](https://github.com/WordPress/gutenberg/pull/14785). * Fix [undo behavior](https://github.com/WordPress/gutenberg/pull/14955) after fresh post loading. ### Documentation * Add design documentation to the [Modal component](https://github.com/WordPress/gutenberg/pull/14757). * Clarify the [CSS naming coding guidelines](https://github.com/WordPress/gutenberg/pull/14556). * Add [InspectorControls usage example](https://github.com/WordPress/gutenberg/pull/11736). * Tweaks and typos: [1](https://github.com/WordPress/gutenberg/pull/14736), [2](https://github.com/WordPress/gutenberg/pull/14737), [3](https://github.com/WordPress/gutenberg/pull/14762), [4](https://github.com/WordPress/gutenberg/pull/14741), [5](https://github.com/WordPress/gutenberg/pull/14756), [6](https://github.com/WordPress/gutenberg/pull/14778), [7](https://github.com/WordPress/gutenberg/pull/14827), [8](https://github.com/WordPress/gutenberg/pull/14895), [9](https://github.com/WordPress/gutenberg/pull/14909), [10](https://github.com/WordPress/gutenberg/pull/14917), [11](https://github.com/WordPress/gutenberg/pull/14940), [12](https://github.com/WordPress/gutenberg/pull/14941), [13](https://github.com/WordPress/gutenberg/pull/14964). ### Various * Bootstrap the design of the [new widgets screen](https://github.com/WordPress/gutenberg/pull/14612)( non functional yet). * Reorganization of the block-library code base: - Use a babel 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. to [load block.json files](https://github.com/WordPress/gutenberg/pull/14551). - Introduce [block.json metadata](https://github.com/WordPress/gutenberg/pull/14770) [for](https://github.com/WordPress/gutenberg/pull/14863) all client side blocks. - Move [the edit functions and the icons](https://github.com/WordPress/gutenberg/pull/14743) to separate files. - Move the [transforms and save functions](https://github.com/WordPress/gutenberg/pull/14882) to separate files. * Add [forwardRef support to the PlainText](https://github.com/WordPress/gutenberg/pull/14866) component. * Support [Button Block Appender](https://github.com/WordPress/gutenberg/pull/14241) in the InnerBlocks component. * [Unset the focal point attributes](https://github.com/WordPress/gutenberg/pull/14746) from the Cover block if not needed. * [Consistently return promises](https://github.com/WordPress/gutenberg/pull/14830) from the data module action calls. * Remove obsolete [CSS currentColor](https://github.com/WordPress/gutenberg/pull/14119) usage. * Improve the [e2e test CLI arguments](https://github.com/WordPress/gutenberg/pull/14717) and docs. * Improve the [e2e test login stability](https://github.com/WordPress/gutenberg/pull/14243) on MacOS. * Remove [is-plain-obj package](https://github.com/WordPress/gutenberg/pull/14751) dependency. * 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. urls and ids from [media test](https://github.com/WordPress/gutenberg/pull/14625/files) [fixtures](https://github.com/WordPress/gutenberg/pull/14790). * Remove the [deprecated Gutenberg plugin functions](https://github.com/WordPress/gutenberg/pull/14806) slated for 5.4 and 5.5. * remove or rename [undocumented RichText package functions](https://github.com/WordPress/gutenberg/pull/14239) and constants. * Adjust [paragraph block spacing](https://github.com/WordPress/gutenberg/pull/14679) to use standardised variables. * Allow [spaces in file paths](https://github.com/WordPress/gutenberg/pull/14789) for package build process. * Update pre-commit to [check modified files only](https://github.com/WordPress/gutenberg/pull/14971). * Improve the [performance of the webpack build](https://github.com/WordPress/gutenberg/pull/14860) configuration. * [Update dependencies](https://github.com/WordPress/gutenberg/pull/14978) with known vulnerabilities. * Fix [typo in variable names](https://github.com/WordPress/gutenberg/pull/14970). ### Mobile * [Accessibility improvements to the Button](https://github.com/WordPress/gutenberg/pull/14697) component. * Enhance the [unsupported block type](https://github.com/WordPress/gutenberg/pull/14577). * Fix [image upload progress](https://github.com/WordPress/gutenberg/pull/14799) not being displayed consistently. * Support [copy/pasting images](https://github.com/WordPress/gutenberg/pull/14802). * Add [the](https://github.com/WordPress/gutenberg/pull/14865) [list block](https://github.com/WordPress/gutenberg/pull/14636). * Visual [refinements for the native nextpage](https://github.com/WordPress/gutenberg/pull/14826) block. * Fix [importing the column](https://github.com/WordPress/gutenberg/pull/14880) block. * Remove DOM logic from the [list block toolbar](https://github.com/WordPress/gutenberg/pull/14840). * Put the caret at the end of the text field after [merging blocks](https://github.com/WordPress/gutenberg/pull/14820). * Fix caret position [after](https://github.com/WordPress/gutenberg/pull/14957) [inline paste](https://github.com/WordPress/gutenberg/pull/14893). ## 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)** | | Gutenberg 5.5.0 | 6.4s | 71.1ms | | Gutenberg 5.4.0 | 6.5s | 78.5ms | | Gutenberg 4.8 (WordPress 5.1) | 8.6s | 154.1ms | | Gutenberg 4.7 (WordPress 5.0) | 11.2s | 191.44ms | --- 👏 Kudos to all the contributors. Thank you. [#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/2019/04/17/whats-new-in-gutenberg-17th-april/?share=threads) * [ Mastodon ](https://make.wordpress.org/core/2019/04/17/whats-new-in-gutenberg-17th-april/?share=mastodon) * [ Bluesky ](https://make.wordpress.org/core/2019/04/17/whats-new-in-gutenberg-17th-april/?share=bluesky) * [ X ](https://make.wordpress.org/core/2019/04/17/whats-new-in-gutenberg-17th-april/?share=x) * [ Facebook ](https://make.wordpress.org/core/2019/04/17/whats-new-in-gutenberg-17th-april/?share=facebook) * [ LinkedIn ](https://make.wordpress.org/core/2019/04/17/whats-new-in-gutenberg-17th-april/?share=linkedin) 1. ![](https://secure.gravatar.com/avatar/31bd23ded7b9ee2d550daaf2aa25cdb5f036dd66ae34707d1c64c18edf6b8139? s=32&d=mm&r=g) 2. [Tom Ryan](https://profiles.wordpress.org/tomdryan/) 2:24 pm _on_ April 17, 2019 3. Reminder: A 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. 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. is just a group/container 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.. There is no longer a need for a separate interface to manage widget placement!!! 4. * ![](https://secure.gravatar.com/avatar/4358d28c1e85f9015cb3363e024e2b238bccb44d05c4b84e9a38aafef0d83ac9? s=32&d=mm&r=g) * [Riad Benguella](https://profiles.wordpress.org/youknowriad/) 2:31 pm _on_ April 17, 2019 * Definitely! In a world where themes are made of 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. templates instead of php templates, there’s no need for 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. areas. * That said, 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/) is a huge change for WordPress and its community. With the new blocks concept, Phase 2 is about helping the WordPress community adopt this new concept without completely changing what a theme means in WordPress. We shouldn’t just abandon existing themes and switch into full-site editing without an iterative plan. * We’ll eventually get there where everything is made of block templates and blocks but we need to make smaller steps first. and the first one is the ability to use blocks instead of widgets in existing themes. - ![](https://secure.gravatar.com/avatar/31bd23ded7b9ee2d550daaf2aa25cdb5f036dd66ae34707d1c64c18edf6b8139? s=32&d=mm&r=g) - [Tom Ryan](https://profiles.wordpress.org/tomdryan/) 2:51 pm _on_ April 17, 2019 - Hi Riad! - There are limited WP development resources and it seems like a waste to use those resources to rewrite a legacy interface. Here would be my suggestion: - 1. Leave the existing 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. interface as is and create a legacy widget which simply displays a group 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.*. This will get you backward compatibility. - 2. Focus on the group block builder interface and depreciate the widget interface screen completely. - *for ease of use, you could create a default set of group blocks mirroring 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. names of the installed theme and auto insert the group block widget (with no content) into each of those sidebars. That will enable people to work 100% within the new group block builder interface. 5. ![](https://secure.gravatar.com/avatar/944ddfc8d4b2f5bad1918020a033eeb4c59f850565d2b7f286efa210fde70db2? s=32&d=mm&r=g) 6. [David Smith](https://profiles.wordpress.org/get_dave/) 1:03 pm _on_ May 1, 2019 7. Really great to see all these improvements! 8. ![](https://secure.gravatar.com/avatar/8a92a7f0bc3acf12151afd683aac5bdc59b41e9db35d93f98d478a180e8946af? s=32&d=mm&r=g) 9. [la2texas](https://profiles.wordpress.org/la2texas/) 5:36 am _on_ May 18, 2019 10. Where do we go to enable this new group 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.? Just updated to WordPress 5.2, and don’t see a “Section” or “Group” block. 11. * ![](https://secure.gravatar.com/avatar/5058d52425c1e7f41d9e5303d1d8adfaf3a25aa78c62c6e4ebe0ecce5329090b? s=32&d=mm&r=g) * [designsimply](https://profiles.wordpress.org/designsimply/) 7:14 pm _on_ June 6, 2019 * I think 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/) 5.5 will be included in WordPress 5.3. To get access to the group 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. before that, you can install and activate 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/](https://wordpress.org/plugins/) or can be cost-based plugin from a third-party. and use it prior to the WordPress 5.3 release. Comments are closed. # Post navigation [← Dev Chat Agenda: April 17](https://make.wordpress.org/core/2019/04/16/dev-chat-agenda-april-17/) [JavaScript chat summary, April 16th, 2019 →](https://make.wordpress.org/core/2019/04/17/javascript-chat-summary-april-16th-2019/)