tinymce 4个自定义类供用户使用

Question

如何将自定义类添加到tinymce 4？我想要一个选择，用户可以在其中选择要在其文本上使用的类。我不想使用像前景色这样的标准插件，因为我想提供我的用户可以使用的某些类。

简短的例子：

tinymce编辑器“选择类”（工具栏中的按钮）

• 红色的
• 蓝色的
• 绿色的

my_custom_css.css

.red { color: red; }
.blue { color: blue; }
.green { color: green; }

Answer 1

style_formats您可以为此使用配置选项。TinyMCE 文档提供了您需要的所有信息：http://www.tinymce.com/wiki.php/Configuration:style_formats

该选项中指定的样式将显示在下拉菜单中，并且可以作为内联样式和类应用。如果您选择将类应用于所选元素，您可能会希望使用该content_css选项包含编辑器内容的自定义样式表。

在您的示例中，配置的相应部分将如下所示：

tinymce.init({
    ...
    style_formats: [
        {title: 'Red', inline: 'span', classes: 'red'},
        {title: 'Green', inline: 'span', classes: 'green'},
        {title: 'Blue', inline: 'span', classes: 'blue'}
    ],
    content_css: 'my_custom_css.css'
});