You need to use Block Filters to modify existing blocks. There are couple of handy hooks you need to use in place of edit and save function to wrap around core blocks into your desirable block structure. For your purpose I guess, you need to use – blocks.getSaveElement and editor.BlockEdit
You can add a custom attribute to any registered block by using the blocks.registerBlockType filter. /** * Filter the attributes for all blocks to add custom ones * * Name can be used to only add the new attribute to a certain block. * * @param settings * @param name * @returns {*} */ function … Read more
If you have a server side rendered block in the backend, it is rendered via the REST API endpoint /wp/v2/block-renderer/xyz/blockname. This endpoint calls your render function. In the frontend the render function is called directly. The function is_admin() checks if a backend page was requested. In a REST API Request is no backend page, so … Read more
Ok, after some research I got the result I needed: // Fetch all posts based on the selected postType. const postsOptions = useSelect((select) => { const { getEntityRecords } = select(‘core’); const { isResolving } = select(‘core/data’); const postTypeSlugs = […postType].map((element) => element.value) ?? []; if (!postTypeSlugs.length) { return [ { label: __(‘No Filter used’, … Read more
Fortunately there is a hook that we can use to customize what component is used to render the taxonomy panels called editor.PostTaxonomyType. Gutenberg renders taxonomy panels with a component called PostTaxonomies, which really just checks whether the taxonomy is heirarchical or not, and passes the props along to either the HierarchicalTermSelector or FlatTermSelector components accordingly. … Read more
Switching Gutenberg to fullscreen mode requires setting to TRUE fullscreenMode from the core/edit-post package. To enqueue appropriate script, you use enqueue_block_editor_assets action hook. function se337302_fullscreen_editor() { $js_code = “jQuery(document).ready(function(){” . ” var isFullScreenMode = wp.data.select(‘core/edit-post’).isFeatureActive(‘fullscreenMode’);” . ” if ( !isFullScreenMode )” . ” wp.data.dispatch(‘core/edit-post’).toggleFeature(‘fullscreenMode’);” . “});”; wp_add_inline_script( ‘wp-blocks’, $js_code ); } add_action( ‘enqueue_block_editor_assets’, ‘se337302_fullscreen_editor’ );
In short, when saving an attribute, make sure its type matches the one that you defined in the block’s attributes option. The docs says: Lastly, make sure that you respect the data’s type when setting attributes, as the framework does not automatically perform type casting of meta. Incorrect typing in block attributes will result in … Read more
Not at the moment, but, you can go to a page with the block editor, open the browser dev tools, go to the console, and run the following: // grab all block types const types = wp.blocks.getBlockTypes(); // filter to just the core blocks const core_blocks = types.filter( type => type.name.startsWith( ‘core/’ ) ); // … Read more
It may be that your theme hasn’t declared support for responsive embeds. Try adding this code to your functions.php // Add support for responsive embedded content. add_theme_support( ‘responsive-embeds’ ); or your theme setup file if there is one.
The reusable block is registered with the core/block name. I tried to add it to the allowed blocks in the allowed_block_types filter, here’s an example: add_filter( ‘allowed_block_types’, ‘wpse324908_allowed_block_types’, 10, 2 ); function wpse324908_allowed_block_types( $allowed_blocks, $post ) { $allowed_blocks = array( ‘core/block’, // <– Include to show reusable blocks in the block inserter. ‘core/image’, ‘core/paragraph’, ); … Read more