TinyMCE：如何更改格式（“段落”、“标题 1”等）

Question

默认情况下 TinyMCE (4) 有一个“段落？” 下拉菜单，如果你点击它，你会得到一个格式选项列表（“段落”、“标题 1”等）。

我希望能够做两件事。首先，我想更改选项及其名称（例如，更改为“Normal”和“Heading”），并且我找到了执行block_formats此操作的选项：

block_formats: 'Normal=p;Heading=h1'

但是，我坚持第 2 件事：向生成的元素添加类。而不是普通<h1>元素，当有人选择“标题”时，我想生成一个<h1 class="heading">.

我想也许这会奏效：

block_formats: 'Normal=p;Heading=h1.heading'

...但事实并非如此，而且我找不到任何其他选项可以让我这样做。再说一次，TinyMCE 文档并不总是最容易找到答案的地方，这就是我来到这里的原因。

有谁知道我如何配置 TinyMCE 以拥有“段落”？生成的元素上带有自定义名称和自定义类的下拉列表？

Answer 1

我从来没有找到一种方法来做到这一点，所以我最终所做的就是完全删除块格式下拉列表并将其替换为（自定义）格式下拉列表。换句话说我：

1. formatselect从配置中删除了toolbar1（删除不可配置的正常格式下拉列表）
2. 将自定义格式下拉列表 ( styleselect) 添加到toolbar1配置中
3. style_formats使用我的自定义样式定义了一个配置条目

配置style_formats如下：

style_formats: [
    {
        title: 'Header',
        inline: 'span',
        classes: 'someClass',
        styles: {someStyle: '5px'}
    },
], // next style would go here

这种方法只有两个缺点。首先，下拉菜单现在显示“格式”，我似乎无法在任何地方进行配置。不过，我确实有一个格式下拉列表，其中只有我想要的选项，并且这些选项将所需的类添加到格式化文本中，因此下拉列表的名称并不是什么大问题。

第二个问题是 TinyMCE 使用<iframe>，这阻止它使用我们的样式表。我可以为 TinyMCE 编写一个样式表，然后将其附加到<iframe>（或使用一些 TinyMCE 机制，如果有的话）...但我很懒，所以我只是使用style:每个自定义格式的条目来定义样式。