Question

stackoverflow上有几篇文章描述了同样的问题，但是没有一个建议的解决方案对我有用。

在块元素（例如div）周围包装锚标记时，TinyMCE Visual Editor会更改此锚标记并将其“向上”移动。我在下面展示了这种行为：

“希望”DOM：

<a href="#">
  <div></div>
</a>

TinyMCe将其更改为以下内容：

<a href="#"></a>
<div></div>

到目前为止我尝试了什么：

以下是几个工作答案的预期，但不是我的情况。根据{{3}}，它需要关闭autop，这在我的情况下不是有效选项。

add_filter('tiny_mce_before_init', 'modify_valid_children', 99);
function modify_valid_children($settings){     
    $settings['valid_children']="+a[div|p|ul|ol|li|h1|span|h2|h3|h4|h5|h5|h6]";
    return $settings;
}

我也找到了TinyMCE自己的文档，声明以下内容应该可以完成这项工作：

tinyMCE.init({
    valid_children: '+a[div|p|h1|h2|h3|img]'; 
});

但是，我不太确定在哪里插入它，因为它必须在TinyMCE .js文件的范围内，而在wordpress的核心更新的情况下不会被覆盖。有什么想法吗？

我甚至尝试编辑wordpress（wp-includes/js/tinymce/tinymce.min.js）的核心文件并直接在这里添加上述内容，但也没有任何运气。

来自wordpress.stackexchange的上述内容详细解释了它，但我希望自2016年以来出现了一些新的选项/信息。

Answer 1

您要创建的HTML无效，因为块元素（例如<div>）不会进入内联元素（<a>）。一个有效的替代方案是：

<a href="#">
  <span></span>
</a>

除此之外，如果你想在TinyMCE中注入新的选项（在WordPress中），你可以构建一个简单的WordPress插件，并在WP用于设置TinyMCE配置的阵列中注入其他设置。

查看WP文档中的tiny_mce_before_init挂钩。你做这样的事情：

add_filter('tiny_mce_before_init', 'function_to_add_options', 1002);

...然后你使用引用的函数来注入你的设置：

function add_powerpaste_options($opt) {
  $opt['valid_children'] = '+a[div|p|h1|h2|h3|img]';
  return $opt;
}

Wordpress TinyMCE不允许在块元素周围进行锚定 - 尝试了几种方法

1 个答案: