What’s new in Gutenberg 17.6?

Introduction

Gutenberg is WordPress’s “block editor”, and introduces a modular approach to modifying your entire site. Edit individual content blocks on posts or pages. Add and adjust widgets. Even design your site headers, footers, and navigation with full site editing support.

What’s new in Gutenberg 17.6?

Gutenberg has some improvements in the new “Data Views” experiment, block hooks improvements, and finally, a feature that all developers have been waiting for: the ability to extend allowed blocks within a parent block.

• New Block JSON allowed Blocks
• Site Editor – Post Editor unification
• Other Notable Highlights
• Changelog

1. New Block JSON allowed Blocks:

Until now, there has been no way to filter the allowed blocks in an inner block area. This means that developers could not specify which blocks could be inside a parent block without editing the parent block’s edit file. Imagine you’ve just created an amazing icon block to include in the navigation block; now, you can whitelist it using a filter.

2.Site Editor – Post Editor unification

Several smaller edit actions are available in the post editor but not the site editor. The misalignment means users sometimes need to hop between editors, which can be frustrating. This Gutenberg version includes all page edit features in both editors.

Also, the Interactivity API and the Fonts Library API have received a big refactor. These APIs are getting close to the 6.5 release, so it’s a great time to test them.

3.Other Notable Highlights

The Interactivity API now includes several new directives that will be incredibly helpful when creating interactive blocks.

• data-wp-on-window and data-wp-on-document to handle global events like scroll, keypress, load, ready, etc.
• data-wp-each to render lists.
• data-wp-run to execute custom logic while rendering an element with directives.

4. Changelog

Interactivity API

• Add wp-data-on-window and wp-data-on-document directives.
• Add wp-each directive.
• Add wp-run directive and useInit & useWatch hooks.
• Create @wordpress/interactivity-router module.