ACF 古腾堡块中的预览图像

问题描述

是否可以在使用 ACF 注册块时将图像添加到古腾伯块预览中？

这是注册块的代码：

acf_register_block(array(
    'name'              => 'bk-raisons','title'             => __('Les raisons','diezel'),'description'       => __('Les raisons','render_callback'   => 'my_acf_block_render_callback','category'          => 'spira-custom','icon'              => 'align-wide','keywords'          => array('bk-raisons'),));

将鼠标悬停在块上时会出现预览。

谢谢！

解决方法

我终于找到了解决方案。

我不知道你是否使用 Twig（木材）。

如果不检查这个：https://stackoverflow.com/a/67846162/6696150

就我与 Timber 而言

当你声明你的块时添加示例属性：

$img_quadruple = array(
    'name'              => 'img-quadruple','title'             => __('Quatre images'),'title_for_render'  => 'img-quadruple','description'       => __(''),'render_callback'   => 'ccn_acf_block_render_callback','category'          => 'imgs','icon'              => '','mode'              => 'edit','keywords'          => array( 'quatre images' ),'example'           => array(
        'attributes'        => array(
            'mode' => 'preview','data' => array(
                'preview_image_help' => get_template_directory_uri().'/assets/img/preview/preview_img_quadruple.jpg',),)
    )
);

当你声明你的回调时：

function ccn_acf_block_render_callback( $block,$content = '',$is_preview = false ) {
    $context = Timber::context();

    // Store block values.
    $context['block'] = $block;

    // Store field values.
    $context['fields'] = get_fields();

    // back-end previews
    if ( $is_preview && ! empty( $block['data'] ) ) {
        echo '<img src="'. $block['data']['preview_image_help'] .'" style="width:100%; height:auto;">';
        return;
    } elseif ( $is_preview ) {
        echo 'Other condition';
        return;
    }

    // Store $is_preview value.
    $context['is_preview'] = $is_preview;

    // Render the block.
    Timber::render('gutenberg/gut_' . strtolower($block['title_for_render']) . '.twig',$context );
}