Previews

Previews make it possible to show the block in the inserter panel on hover. This feature behaves similar to the field registration and has to be defined in an $example variable inside your block file.

ACF

<?php // cta.php /* Title: Call to Action Description: Call to action element. Category: design Icon: lightbulb Mode: preview SupportsAlign: false SupportsMode: false */ $fields = [ [ 'key' => 'cta_title_key', 'label' => 'Title', 'name' => 'cta_title', 'type' => 'text', ], [ 'key' => 'cta_text_key', 'label' => 'Text', 'name' => 'cta_text', 'type' => 'textarea', ], ); $example = [ 'attributes' => [ 'mode' => 'preview', 'data' => [ 'cta_title' => "Example title", 'cta_text' => "Example text" ] ] ); ?> <h1><?php the_field( 'cta_title' ) ?: 'Title'; ?></h1> <p><?php the_field( 'cta_text' ) ?: 'Text'; ?></p>

Metabox

<?php // cta.php /* Title: Call to Action Description: Call to action element. Category: design Icon: lightbulb Mode: preview SupportsAlign: false SupportsMode: false */ $fields = [ [ "type" => "text", "id" => "cta_title", "name" => "Title", ], [ "type" => "text", "id" => "cta_text", "name" => "Subtitle", ], ]; $example = [ 'cta_title' => "Example title", 'cta_text' => "Example text" ); ?> <h1><?php mb_the_block_field( 'cta_title' ) ?: 'Title'; ?></h1> <p><?php mb_the_block_field( 'cta_text' ) ?: 'Text'; ?></p>