You’re pretty close. Specifying layout details in block.json should nest inside a “default” property. Doing so will have the Layout panel display accordingly but there’s more to it than that. If you want the default layout for the block, there is no need to add contentSize or wideSize. Here is the layout config I’d recommend … Read more
An official tutorial to add custom buttons is now available here.
Many wp.blocks.* controls have been moved to wp.editor.* (see release notes). Specifically wp.blocks.InspectorControls is now wp.editor.InspectorControls – you’ll need to change the first line of your code. Note: registerBlockType is still imported from wp.blocks.* iirc. As a side note, I’ve also found that the focus && trick no longer required as GB automatically displays the … Read more
You can find the versions in WordPress here with this recently created document: https://developer.wordpress.org/block-editor/principles/versions-in-wordpress/ You weren’t alone in wanting to have this information 🙂 As mentioned above, it can be tricky to directly line up versions but this is the closest approximation currently. When WordPress 5.5 is launched, this document will be updated.
LinkControl is an experimental component, so it’s declared differently in blockEditor package try this as an import statement, this worked for me: const {__experimentalLinkControl } = wp.blockEditor; const LinkControl = __experimentalLinkControl;
TextControl is from wp.components not wp.blocks. const { registerBlockType, RichText, AlignmentToolbar, BlockControls, InspectorControls, } = wp.blocks; const { TextControl } = wp.components; Changing that I was able to get your block to work fine instead of error in Gutenberg 2.2.0.
The block id is saved in the clientId field. It’s regenerated at each save of the post and is only available in props in the edit function. In order to use this field as unique id in the save function, it needs to be saved as attribute in the edit section. It will be then … Read more
<InspectorControls> <PanelBody title={ __( ‘Settings One’ ) }> </PanelBody> <PanelBody title={ __( ‘Settings Two’ ) }> </PanelBody> <PanelBody title={ __( ‘Settings Three’ ) > </PanelBody> </InspectorControls> If you insert multiple Panelbody like I did in above code. You will have multiple inspector controls with first one being ope by default. Change the panelbody accordingly to … Read more
Not tested. I just was browsing looking for something else. But I would try something like this: onReplace: function() { var myID = props.clientId; wp.data.dispatch(‘core/block-editor’).removeBlock(myID); }
Add additional classes to gutenberg .editor-styles-wrapper