Register an ACF Block with block.json

Register a custom Gutenberg block using ACF’s block.json method — the recommended approach since ACF 6.0.

Create a block.json file in your theme or plugin’s blocks directory (e.g. blocks/testimonial/block.json):

{
    "name": "acf/testimonial",
    "title": "Testimonial",
    "description": "A custom testimonial block.",
    "category": "theme",
    "icon": "format-quote",
    "keywords": [ "testimonial", "quote" ],
    "acf": {
        "mode": "preview",
        "renderTemplate": "blocks/testimonial/render.php"
    },
    "supports": {
        "anchor": true,
        "align": true,
        "jsx": false
    }
}

Register the block in your theme’s functions.php:

<?php
add_action( 'init', function () {
    register_block_type( get_template_directory() . '/blocks/testimonial' );
} );

Create the render template at blocks/testimonial/render.php:

<?php
/**
 * Testimonial Block Template.
 *
 * @param array $block The block settings and attributes.
 */
$quote  = get_field( 'quote' );
$author = get_field( 'author' );
$role   = get_field( 'role' );
?>

<blockquote class="testimonial-block">
    <p><?php echo esc_html( $quote ); ?></p>
    <?php if ( $author ) : ?>
        <footer>
            <cite><?php echo esc_html( $author ); ?></cite>
            <?php if ( $role ) : ?>
                <span><?php echo esc_html( $role ); ?></span>
            <?php endif; ?>
        </footer>
    <?php endif; ?>
</blockquote>