Hooks for how GenerateBlocks blocks behave in the block editor: the data they save, the wrapper and inserter controls they show, and the lists of fonts, shapes and templates they offer. For the controls in the inspector, see Editor: inspector controls and panels.
Jump to
- Font, shape and template lists
- Block attributes
- Editor wrappers and appenders
Font, shape and template lists
generateblocks_typography_font_family_list
GB Free — since GenerateBlocks 1.8.
The generateblocks_typography_font_family_list filter changes the list of fonts in the font family control, which is sent to the block editor. Add your own groups of fonts.
Parameters: $font_groups (array of groups, each with a label and an options array of { value, label }). Default: one group, System Fonts, with Arial, Helvetica, Times New Roman and Georgia.
add_filter( 'generateblocks_typography_font_family_list', function( $font_groups ) {
$font_groups[] = [
'label' => __( 'My fonts', 'my-plugin' ),
'options' => [
[
'value' => 'My Font',
'label' => 'My Font',
],
],
];
return $font_groups;
} );
Related: generateblocks_dashboard_screens Guide: The Blocks
generateblocks_svg_shapes
GB Free — since GenerateBlocks 1.2.
The generateblocks_svg_shapes filter changes the shape dividers available in the Shape block. Each group has a label and a list of shapes.
Parameters: $shapes (array keyed by group ID, each with a group label and an svgs array keyed by shape ID, where each shape has a label and an icon of SVG markup). Default: the built-in groups of dividers, starting with gb-waves (Waves).
add_filter( 'generateblocks_svg_shapes', function( $shapes ) {
$shapes['my-shapes'] = [
'group' => __( 'My shapes', 'my-plugin' ),
'svgs' => [
'my-shapes-1' => [
'label' => __( 'Slope', 'my-plugin' ),
'icon' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 100" preserveAspectRatio="none"><path d="M0 100V0l1200 100z"/></svg>',
],
],
];
return $shapes;
} );
Related: generateblocks.editor.iconSVGSets Guide: SVG Shapes & Icons
generateblocks.carousel.templates
GB Pro
The generateblocks.carousel.templates filter changes the layouts offered when you add a Carousel block.
Parameters: templates (array of templates, each with id, label, icon (an element), innerBlocks and attributes), context (object with clientId and attributes). Default: the built-in carousel layouts, such as Basic and Testimonials.
wp.hooks.addFilter(
'generateblocks.carousel.templates',
'my-plugin/carousel-templates',
( templates ) => templates.filter( ( template ) => 'testimonials-carousel' !== template.id )
);
Related: generateblocks_dynamic_css_blocks Guide: GenerateBlocks Pro
Block attributes
These are wp.hooks filters. Add them with wp.hooks.addFilter() in a script that loads in the block editor.
generateblocks.editor.htmlAttributes.style
GB Free — GenerateBlocks Pro also uses it.
The generateblocks.editor.htmlAttributes.style filter changes the value of a block’s style HTML attribute before the editor uses it. Your callback can return a promise.
Parameters: style (the style attribute value), props (the block’s props). Default: the block’s style attribute value.
wp.hooks.addFilter(
'generateblocks.editor.htmlAttributes.style',
'my-plugin/html-attributes-style',
( style, props ) => style
);
Related: generateblocks.utils.noStyleAttributes Guide: The Blocks
generateblocks.utils.noStyleAttributes
GB Free — GenerateBlocks Pro also uses it.
The generateblocks.utils.noStyleAttributes filter lists block attributes that are not styles. Features that copy, paste or sync styles skip these attributes. Add the attributes of your own block that hold content or settings, not styles.
Parameters: attributes (array of attribute names). Default: the names of the attributes of the GenerateBlocks blocks that aren’t styles, such as anchor, className, content and htmlAttributes.
The filter runs once when the script loads, so add your filter before the GenerateBlocks block scripts run.
wp.hooks.addFilter(
'generateblocks.utils.noStyleAttributes',
'my-plugin/no-style-attributes',
( attributes ) => [ ...attributes, 'myCustomSetting' ]
);
Related: generateblocks.editor.htmlAttributes.style Guide: The Blocks
generateblocks.media.imageAttributes
GB Free — GenerateBlocks Pro also uses it.
The generateblocks.media.imageAttributes filter changes the attributes the Media block copies from the media library to the image when you choose an image.
Parameters: imageAttributes (object with alt, title, height and width), context (object with image, the media library item, and attributes, the block’s attributes). Default: alt, title, height and width from the media library item.
wp.hooks.addFilter(
'generateblocks.media.imageAttributes',
'my-plugin/image-attributes',
( imageAttributes, { image } ) => ( { ...imageAttributes, loading: 'lazy' } )
);
Related: generateblocks.blockSettings.afterImageUrlControls Guide: The Blocks
Editor wrappers and appenders
generateblocks.rootElement.disable
GB Free — GenerateBlocks Pro also uses it.
The generateblocks.rootElement.disable filter chooses whether a block’s editor wrapper div is left out. A block that is nested inside another block has no wrapper by default.
Parameters: disable (a truthy value, such as the parent block’s client ID, or false), context (object with name, the block’s name). Default: truthy when the block has a parent block, otherwise false.
wp.hooks.addFilter(
'generateblocks.rootElement.disable',
'my-plugin/root-element',
( disable, { name } ) => ( 'generateblocks/shape' === name ? true : disable )
);
Related: generateblocks.editor.preview.context Guide: The Blocks
generateblocks.editor.preview.context
GB Free — GenerateBlocks Pro also uses it.
The generateblocks.editor.preview.context filter changes the block context the editor uses to preview a Looper or other block.
Parameters: context (object, the block’s context), data (object with props, the block’s props). Default: the block’s own context.
wp.hooks.addFilter(
'generateblocks.editor.preview.context',
'my-plugin/preview-context',
( context ) => context
);
Related: generateblocks.editor.looper.query Guide: The Blocks
generateblocks.editor.blockAppender
GB Free
The generateblocks.editor.blockAppender filter changes the appender inside an empty Element block, which is the button that opens the inserter.
Parameters: appender (an element), context (object with clientId, isSelected and attributes). Default: the built-in inserter button, or the block selector button when the block isn’t selected.
wp.hooks.addFilter(
'generateblocks.editor.blockAppender',
'my-plugin/block-appender',
( appender, { clientId, isSelected, attributes } ) => appender
);
Related: generateblocks.editor.showBlockAppender Guide: The Blocks
generateblocks.editor.showBlockAppender
GB Free
The generateblocks.editor.showBlockAppender filter chooses whether the Element block shows its appender.
Parameters: show (bool), context (object with clientId, isSelected and attributes). Default: true, except in a block preview.
wp.hooks.addFilter(
'generateblocks.editor.showBlockAppender',
'my-plugin/show-block-appender',
( show, { attributes } ) => ( attributes.className?.includes( 'my-locked-layout' ) ? false : show )
);
Related: generateblocks.editor.blockAppender Guide: The Blocks
generateblocks.editor.toolbarAppenders
GB Free
The generateblocks.editor.toolbarAppenders filter changes the extra toolbar controls GenerateBlocks adds to its blocks. The built-in control is an Add to Container button, and the Media block adds more for images.
Parameters: appenders (an element, the toolbar controls), props (object with the block’s clientId, attributes and name). Default: the built-in toolbar controls.
wp.hooks.addFilter(
'generateblocks.editor.toolbarAppenders',
'my-plugin/toolbar-appenders',
( appenders, props ) => appenders
);
Related: generateblocks.editor.areToolbarControlsDisabled Guide: The Blocks
generateblocks.editor.removeBlockWidthOptions
GB Free
The generateblocks.editor.removeBlockWidthOptions filter chooses whether the Default / Wide / Full width options are removed from the block toolbar.
Parameters: remove (bool), context (object with clientId). Default: false. The options also don’t show when the theme doesn’t support wide alignment or the block is nested.
wp.hooks.addFilter(
'generateblocks.editor.removeBlockWidthOptions',
'my-plugin/remove-width-options',
() => true
);
Related: generateblocks.editor.showBlockAppender Guide: The Blocks