react - Read For Learn

How to render HTML content using the Interactivity API?

Rather than binding text with a directive, you could bind a callback with data-wp-watch that sets the inner HTML of the div when it runs: <div data-wp-watch=”callbacks.renderContent”></div> callbacks: { renderContent() { const context = getContext(); const element = getElement(); element.ref.innerHTML = context.randomPost.content.rendered; }, }, Since the callback uses context.randomPost.content.rendered, it should run any time that … Read more

Gutenberg DatePicker component with time set to zero

I managed to find the solution myself. You need to modify the onUpdateStartDate() function: function onUpdateStartDate(value) { const date = new Date(value); date.setHours(0, 0, 0, 0); setMeta({ …meta, ‘_my_start_date’: date }); }

Custom plugin translation not working

Core/Image access caption in render_template and in wp.hooks

Remove AM/PM in gutenberg add/edit post and use 24-h format

useSelect() plus resolver result is serving cached data incorrectly

Thanks for MVE, @helgatheviking! It was beneficial. When wp.data caches the resolvers, it also considers arguments. Here’s what happens when following the reproduction steps for the bug: Selecting the first product resolves data, creates a cache for getProduct(1), and sets a value for the product state. Selecting second does the same (cache: getProduct(2)) and sets … Read more

How to re-render Gutenberg component when object instance is available

wp_add_inline_script can be used to insert a tiny trigger script that executes after the script specified in script and any instance defined by that script will be available. // When this js executes `Masonry` is sure to be defined wp_add_inline_script( ‘masonry’, ‘if (window.top !== window) doItNow()’); This will end up being executed twice when the … Read more

How to transform a shortcode into a block

I’m sharing my solution here in case it can help someone, as I believe this type of shortcode transform is a common use case. As fetching data inside a transform is not possible right now, I’m creating the block inside the transform by passing just the carousel id attribute from the carousel shortcode. I then … Read more

Can you nest columns/column in a gutenberg custom template?

I believe the cause of the problem has nothing to do with columns and nesting columns within columns,. The errors are related to the very first block added in the template and a mixup of the syntax used in the examples on wp.org when reproduced. If we clear up the indentation you’ll see that this … Read more

Problems with the PluginDocumentSettingPanel SlotFill in Gutenberg

It doesn’t work because that is old behaviour and Gutenberg changed a year ago. Where The Confusion Comes From This commit: https://github.com/WordPress/gutenberg/commit/00cb38c3655daffd429ad4acfc57d6ee3b7f2d83 On Apr 20, 2022 code was removed that made it fallback to the plugin icon. Now an icon has to be explicitly passed as a prop or no icon is shown. Why? https://github.com/WordPress/gutenberg/pull/40355 … Read more

+ More