Your JavaScript code works for me. The metadata do get saved. But perhaps you’d like to try my code which is pretty much completed, i.e. on page load, the checkbox is auto-checked/unchecked (and the text box is also shown/hidden) depending on the current database value. Secondly, I did it just as the Gutenberg team did … Read more
Without the root id the block is looked for at the top-level1. Something like this seems to work: useSelect(select => { const editor = select(‘core/block-editor’) const rootId = editor.getBlockRootClientId(blockId) return editor.getBlockIndex(blockId, rootId) }, [blockId]) [1] https://github.com/WordPress/gutenberg/blob/v9.9.3/packages/block-editor/src/store/selectors.js#L945
This is a known issue in Gutenberg. You can get this working by passing {plugin-slug}/{panel-name} For your example, try: dispatch(‘core/edit-post’).toggleEditorPanelOpened(‘plugin-document-setting-panel-mycustom/mycustom-panel’)
The Preview button and associated functionality is currently undergoing a fair amount of iteration – I would imagine we will see a keyboard shortcut added, along with other options for modifying it’s UI down the road. A Big Hack Interestingly, the old direct-preview button’s component is still rendered, but is hidden on a > 600px … Read more
I ended up implementing my own ColorControl. I’m not satisfied with this solution and I don’t advice you to follow this route blindly. However, if you want to get the job done and don’t want to spend two hours on something that might not exist as I did, here you go. Install two extra packages: … Read more
Yes, you can do this via the classnames() function. import classnames from ‘classnames’; const withClass = createHigherOrderComponent( ( BlockListBlock ) => { return ( props ) => { let wrapperProps = props.wrapperProps; wrapperProps = { …wrapperProps, className={ classnames( ‘my-custom-class’, props.className ) } }; return <BlockListBlock { …props } wrapperProps={ wrapperProps } />; }; }, ‘withClass’ … Read more
As an answer to @RiddleMeThis, here is a working solution by parsing the default output from the core/image-Block with DOMDocument: In the init-Hook, register your custom output function: register_block_type( ‘core/image’, [ ‘render_callback’ => ‘myImageOutput’ ] ); Define your custom output function: In this function render the default output ($content) which is passed as the second … Read more
To partly answer my own question: As mentioned in this git issue you can use console.log(wp.blocks.getBlockTypes()); in the browser console after all the Gutenberg magic loaded (e.g. in the editor window of a post) to show all currently registered blocks, inluding their attributes. Another Info-Source: The Git-Project of Gutenberg holds all core blocks and their … Read more
The generated id is added to the component’s props. So it can be accessed through this.props.instanceId inside the component. In the example you posted it is being used to assign a unique id attribute to the html element. However it can be used for custom logic inside react. Just as an example, you can assign … Read more
The getEntityRecords() method uses the REST API, so make sure the taxonomy is enabled for the REST API. You can enable it via the show_in_rest parameter when registering the taxonomy using register_taxonomy(). With getEntityRecords(), if you set per_page to -1, it will actually be changed to 100, which as you’ve figured it out, is the … Read more