TinyMCE自定义style_formats：div包裹自动保留p标签问题求助

我在使用TinyMCE编辑器时，尝试通过style_formats添加自定义标题格式，配置如下：

//...
{ title: 'Headings', items: [
                { title: 'Titre principal', block: 'div', classes: ['title'], wrapper: true },
                { title: 'Titre alternatif', block: 'div', classes: ['title-alt'], wrapper: true },
                { title: 'Titre alternatif (gris)', block: 'div', classes: ['title-alt', 'grey'], wrapper: true },
                { title: 'Titre informatif', block: 'div', classes: ['title-alt', 'infos'], wrapper: true },
                { title: 'Sous-titre', block: 'div', classes: 'subtitle', wrapper: true },
                { title: 'Petit titre', block: 'div', styles: { color: 'var(--violet)', fontFamily: 'var(--playfair)', fontWeight: 'bold' }, wrapper: true }
]},
//...

但应用格式后，文本会被自动包裹在<p>标签中，生成的代码如下：

<div class="title">
<p>
Text goes here
</p>
</div>

我期望的输出是不带<p>标签的结构：

<div class="title">
Text goes here
</div>

原生h1/h2等标题格式可正常工作，我曾尝试设置valid_children : '-div[p]'但应用格式时完全无反应；尝试自定义format时，会替换掉之前的所有div容器（例如将<div class="cadre-admin">包裹的内容直接替换为<div class="title">结构）。

要解决这个问题，需要在自定义格式配置中添加remove: 'p'属性，调整wrapper的使用逻辑，让TinyMCE在应用格式时移除内部的<p>标签，同时避免替换原有外层容器。

修改后的配置如下：

//...
{ title: 'Headings', items: [
                { 
                  title: 'Titre principal', 
                  block: 'div', 
                  classes: ['title'],
                  remove: 'p',
                  merge_siblings: true
                },
                { 
                  title: 'Titre alternatif', 
                  block: 'div', 
                  classes: ['title-alt'],
                  remove: 'p',
                  merge_siblings: true
                },
                { 
                  title: 'Titre alternatif (gris)', 
                  block: 'div', 
                  classes: ['title-alt', 'grey'],
                  remove: 'p',
                  merge_siblings: true
                },
                { 
                  title: 'Titre informatif', 
                  block: 'div', 
                  classes: ['title-alt', 'infos'],
                  remove: 'p',
                  merge_siblings: true
                },
                { 
                  title: 'Sous-titre', 
                  block: 'div', 
                  classes: 'subtitle',
                  remove: 'p',
                  merge_siblings: true
                },
                { 
                  title: 'Petit titre', 
                  block: 'div', 
                  styles: { color: 'var(--violet)', fontFamily: 'var(--playfair)', fontWeight: 'bold' },
                  remove: 'p',
                  merge_siblings: true
                }
]},
//...

关键配置说明： #

• remove: 'p'：明确告诉TinyMCE在应用该格式时，移除包裹选中内容的<p>标签，直接将内容放入目标<div>中。
• merge_siblings: true：如果选中多个相邻的<p>标签，应用格式后会合并成一个<div>容器，避免生成多个独立的<div>。
• 移除wrapper: true：原配置的wrapper是将选中内容嵌套包裹在目标元素内，而我们需要的是替换原有<p>标签为目标<div>，而非嵌套，因此去掉该属性。

该配置既可以实现无<p>标签的目标结构，也不会替换掉原有外层的div容器，符合需求。

内容的提问来源于stack exchange，提问作者Joshua Fleuri