在Wordpress中，我为TynyMCE编辑器创建了一个自定义样式，以便页面的发布者可以在文本中添加三列。我希望发布者能够选择他想要放在列中的文本（在可视化编辑器中），然后选择样式＆＃34;列1/3＆＃34;从样式菜单。文本将被包装在一个div3中，该div3类在网站上创建一个占据页面宽度1/3的列。我们的想法是，如果您为3部分文本执行此操作，那么您将获得彼此相邻的三列。
现在，我得到了这个（大多数情况下），但是当我尝试应用样式时编辑器表现得很奇怪。
我使用以下
定义了样式array(
'title' => 'column 1/3',
'block' => 'div',
'classes' => 'column3',
'exact' => true,
'wrapper' => true
)
我尝试放入列中的html如下：
<h2>Column 1</h2>
<p>Text of column one</p>
<h2>Column 2</h2>
<p>Text of column two</p>
<h2>Column 3</h2>
<p>Text of column three</p>
现在，在可视化编辑器中，如果我选择第一个h2和p，然后选择＆＃34;第1/3和第34列;从样式菜单中，代码如下：
<div class="column3">
<h2>Column 1</h2>
<p>Text of column one</p>
</div>
这就是我想要的方式。现在如果我选择第二个h2和p，希望它成为第二列，代码就是这样的：
<div class="column3">
<h2>Column 1</h2>
<p>Text of column one</p>
<h2>Column 2</h2>
<p>Text of column two</p>
</div>
第二个h2进入同一个div，但是我希望它们是这样的单独div：
<div class="column3">
<h2>Column 1</h2>
<p>Text of column one</p>
</div>
<div class="column3">
<h2>Column 2</h2>
<p>Text of column two</p>
</div>
我可以通过在/ p和h2之间添加两个输入来避免这种行为，但是在列之间会出现不间断的空格，导致它们无法正确对齐。我知道我可以通过文本编辑器删除不间断的空间，但我宁愿不让网站的发布者直接浏览html代码。
如何才能将样式仅放在我选择的文本上，让TinyMCE忽略它周围的块？ 如果那不可能，我可以删除/过滤编辑器中div之间的不间断空格（不是在模板中，我知道如何做到这一点，但我宁愿不在那里过滤内容）？< / p>
添加了3月4日
虽然我还没有找到解决方案，但我找到了解决问题的方法。 我已将column3类的样式添加到editor-style.css中。因此，发布者可以为第一列添加两个输入，然后第三列，第二列输入等内容。
然后他可以选择第一列的文本并应用样式，然后选择第二列和第三列。现在，当他看到列的错位时，他可视地看到进入。现在，他可以选择列上方的输入并将其删除。更多的工作，但可接受的解决方法。
对我的第一个问题的答案仍然感到好奇：如何才能将样式仅放在我选择的文本上，让TinyMCE忽略它周围的块？