Question

我创建了我的第一个自定义gutenberg块。我希望它除了显示一些PHP代码之外什么也不做。我让它在前端工作，但是代码无法呈现在我想要的位置。它呈现在页面标题下，所有其他块的上方。在后端，它呈现在正确的列中。另外，在保存页面时，它还会显示以下错误：不是有效的JSON响应。不过，所有修改都会保存。

我在这里不见了吗？这是我的代码：

    if ( ! function_exists( 'register_block_type' ) ) {
        // Gutenberg is not active.
        return;
    }
    wp_register_script(
        'ww-agenda-script',
        plugins_url( 'block.js', __FILE__ ),
        array( 'wp-blocks', 'wp-i18n', 'wp-element' )
    );
    register_block_type( 'woonenwerk/ww-agenda', array(
        'editor_script' => 'ww-agenda-script',
        'render_callback' => 'woonenwerk_agenda_render_callback',
    ) );

}
add_filter( 'init', 'ww_agenda_register_block' );

在block.js中：

( function( blocks, i18n, element ) {
    var el = element.createElement;
    var __ = i18n.__;


    blocks.registerBlockType( 'woonenwerk/ww-agenda', {
        title: __( 'Woon en Werk: Agenda' ),
    description: __( 'Dit block laat de eerstvolgende 5 agenda items zien.' ),
        icon: 'list-view',
        category: 'woon-en-werk',
        example: {},
        edit: function() {
            return el('p',{  },'Woon en Werk Agenda. Dit block laat de eerstvolgende 5 agenda-items zien.');
                },
    } );
}(
    window.wp.blocks,
    window.wp.i18n,
    window.wp.element
) );

我尝试添加一个返回null的保存函数（由于我将render_callback用于输出，因此我不需要保存任何内容）。那没用。

我还尝试了不同的钩子，而不是init，但这也不起作用。

我搜索了这个问题，但没有发现任何有用的东西。

如果您需要更多信息才能回答我的问题，请告诉我。.

更新：我使用BlockLab通过php文件中的render回调创建了另一个自定义块。这样就可以了，这个新块的内容现在显示在正确的位置。同样在后端，我看到了渲染的内容。我认为这与保存功能有关。我将继续分析BlockLab代码，看看如何将其放入插件中。如果我不需要BlockLab插件就能工作，那就太好了。

古腾堡自定义块在页面上呈现错误的位置

0 个答案: