Removing panels (meta boxes) in the Block Editor

The remove_meta_box() function will not work with the Block Editor, because these are now Panels and work differently. There is currently no documentation on how to disable Panels, but, let’s dance. We want to avoid hiding panels via CSS, and rely on the JS API. We need to use the JS function removeEditorPanel() which will … Read more

Set default image link target in Gutenberg image block

This was (finally) fixed to Gutenberg (and will be applicable for both the image and the gallery blocks); and will add an option to WordPress options’ database table. this was done in https://github.com/WordPress/gutenberg/pull/25578 and https://github.com/WordPress/gutenberg/pull/25582 It’ll be added to WordPress 5.6 but it’s already available in the Gutenberg plugin. To link the image to the … Read more

How does Gutenberg handle translations in React?

In the Gutenberg’s GitHub repository you can see the source of the i18n package that is used. In this source, you’ll see Jed getting imported (line 4 of gutenberg/packages/i18n/src/index.js) and then being used for most of the translation tasks under the hood. Jed introduces the “Gettext Style i18n for Modern JavaScript Apps” (or at least … Read more

Deactivate Gutenberg tips forever – not Gutenberg

Update #1: After asking from @leymannx I checked how these settings are stored. It turned out that settings are not permanent, they are saved in the browser as localStorage. key: WP_DATA_USER_{id}: value: { “core/nux”:{ “preferences”:{ “areTipsEnabled”:false, “dismissedTips”:{} } }, //”core/edit-post” //… Update #2: Gutenberg tips can be disabled by using dispatch(‘core/nux’).disableTips() (NUX package) and action … Read more

How would I get a taxonomy/category list inside a Gutenberg block?

Load the elements into a constant using a function like this: const postSelections = []; const allPosts = wp.apiFetch({path: “/wp/v2/posts”}).then(posts => { postSelections.push({label: “Select a Post”, value: 0}); $.each( posts, function( key, val ) { postSelections.push({label: val.title.rendered, value: val.id}); }); return postSelections; }); Then use postSelections as your element “options”. el( wp.components.SelectControl, { label: __(‘Select … Read more

Trigger Javascript on Gutenberg (Block Editor) Save

Not sure if there is a better way, but I am listening to subscribe rather than adding an event listener to the button: wp.data.subscribe(function () { var isSavingPost = wp.data.select(‘core/editor’).isSavingPost(); var isAutosavingPost = wp.data.select(‘core/editor’).isAutosavingPost(); if (isSavingPost && !isAutosavingPost) { // Here goes your AJAX code …… } }) Official docs of the Post Editor data: … Read more

Add pre-publish conditions to the block editor

EDIT Sept 2021: An updated version of the answer that uses hooks. This version tracks changes in the editor much better. It also uses import statement instead of importing directly from the wp global. This approach when used with the @wordpress/scripts package will correctly add dependencies for this file when being enqueued. Accessing the wp … Read more