Teft Banner Block

The banner block includes three “Block Styles” - Default, Content left and Content right. You can switch between them by clicking “Change block type or style” up in the top left corner.

If you don’t want all included styles you can unregister them by using JavaScript:

wp.blocks.unregisterBlockStyle( 'teft/banner', 'default' );
wp.blocks.unregisterBlockStyle( 'teft/banner', 'content-left' );
wp.blocks.unregisterBlockStyle( 'teft/banner', 'content-right' );

See block style variations documentation for more info.

Block options

You can configure the block defaults and available toggles using

wp.domReady( () => {
	wp.hooks.addFilter( 'teft-banner-config', 'teft', config => {
		return config;
	}, 1 )
} );

inside of your theme editor js.

Available options

color boolean - Toggles the text/background color picker. Default true

focalPoint boolean - Toggles the image focal point picker. Default true

resize boolean - Toggles the pixel input and drag-drop banner resizer. Default true

overlayColor boolean - Toggles the overlay color picker. Default true

overlayOpacity boolean - Toggles the overlay opacity slider. Default true

height float - Banner height. Default 400

minHeight float - Banner min height. Default 200

media array - Allowed background media types. Default ['media']

innerBlocksTemplate array - Toggles the default blocks added automaticly to a new banner. default

[
	[ 'core/heading', {
		placeholder: __( 'Write title…', 'teft-banner' ),
	} ],
]

innerBlocksTemplate array - Toggles the block types allowed inside of a banner default

[ 'core/button', 'core/buttons', 'core/heading', 'core/paragraph' ]