扩展古腾堡的核心区块

对于一个项目，我必须扩展核心块核心/封面图像。对于第一次基本尝试，我想到了以下代码：

PHP：

add_action(\'enqueue_block_editor_assets\', function() {
   wp_enqueue_script(\'hephaestus-admin-script\', 
   get_template_directory_uri() . \'/dist/js/admin.js\', [\'wp-blocks\', \'wp-element\', \'wp-edit-post\'], THEME_VERSION);
});

管理员。js公司：

function transformElement(element, blockType, attributes) {
  if (blockType.name != \'core/cover-image\') {
    return element;
  }

  var newElement = wp.element.createElement(
    \'div\',
    {
      className: \'wp-block-cover-image\',
      style: \'background-image: url(\\\'\' + attributes.url + \'\\\');\',
    },
    [
      wp.element.createElement(
        \'p\',
        {
          className: \'wp-block-cover-image-text\',
        },
        [
          wp.element.createElement(
            \'span\',
            {
              className: \'wp-block-cover-image-text-stage\',
            },
            attributes.title
          )
        ]
      ),
    ]
  );

  return newElement;
}

wp.hooks.addFilter(
  \'blocks.getSaveElement\',
  \'hephaestus/modify-get-save-element\',
  transformElement
);

基本上这是可行的。我可以在编辑器中添加封面图像块，前端输出也符合要求。

但在后端重新访问站点时，Gutenberg给了我以下错误：

块验证：的块验证失败core/cover-image

预期：

<div class="wp-block-cover-image" style="background-image: url(\'https://xxxxxxxx/wp-content/uploads/2018/08/xxxxxxxx.jpg\');"><p class="wp-block-cover-image-text"><span class="wp-block-cover-image-text-stage"></span></p></div>

实际值：

注意：图像url故意划掉

为什么我在这里得到这个块验证错误？我认为这与title属性有关。但我不知道是什么原因。。。

有人帮忙吗？

你好，马库斯

插件中的JavaScript数据表

我有一个已经开始开发的插件，我想尝试使用datatables。net显示表格数据。我不知道如何做到这一点，在搜索和尝试了不同的东西后，我迷路了。以下是我的插件中的内容。当前，当我加载页面时，它会显示表，我可以在页面源代码中看到加载了dataTables js、dataTables css和customScriptDatatables。add_action(\'create_datatable\', \'show_datatable\'); function show_datatable (){&#

相关推荐

插件中的JavaScript数据表