自定义格式在“所见即所得的附加选项”中不起作用答案

【问题标题】：Custom Format not working in 'wysiwyg additional options'自定义格式在“所见即所得的附加选项”中不起作用
【发布时间】：2019-02-08 09:52:19
【问题描述】：

我使用的是最新的 Keystone.js，下面是我的 Keystone.init

var keystone = require('keystone');

keystone.init({
    'name': 'Dashboard',
    'user model': 'User',
    'auto update': true,
    'auth': true,
    'cookie secret': 'secure string goes here',
     views: 'templates/views',
    'view engine': 'pug',
    'wysiwyg cloudinary images': true,
    'wysiwyg additional plugins': 'example, autosave, charmap, table, '
    + 'advlist, anchor, wordcount, preview, fullscreen, importcss,  '
    + 'paste',
    'wysiwyg additional buttons' : 'undo redo charmap blockquote formatselect styleselect removeformat  |'
    + 'example preview fullscreen bodytext',
    'wysiwyg additional options': { 
            default_link_target: '_blank',
            paste_as_text: true,
            menubar: true, // added to test formats
            'style_formats': [ 
                { title: 'Red text', inline: 'span', styles: { color: '#ff0000' } }
                ],
            formats: {
                    bodytext: {block : 'p', attributes : {title : 'bodyText'}, styles : {color : 'grey'}}
                }
        }, });

keystone.set('routes', require('./routes'));

keystone.import('models');

keystone.set('nav', {
    'projects': ['Projects', 'Keywords'],
    });

keystone.start();

我在 TinyMCE 编辑器中得到的是格式下拉菜单，其中没有任何自定义格式。

有人知道如何解决吗？我需要添加一个自定义格式来为文本添加一个类，例如。图片标题、正文等。

查看 Keystone.js 文件后，我发现它使用的是 TinyMCE 版本 4.4.3，而 Keystone 版本是 4.0 RC。

【问题讨论】：

请注意，如果我正在自定义现有格式，例如 h1，那么它可以正常工作并且我可以添加类或指定样式。但我无法创建新的自定义格式。
您可能会被此绊倒：“请务必注意 style_formats 选项虽然语法相似，但与格式选项完全分开。此选项只会将项目添加到“格式”下拉列表在工具栏中，而不是菜单栏中的格式下拉菜单。”来自tiny.cloud/docs/configure/content-formatting
也许您缺少工具栏选项：toolbar: "styleselect", style_formats: [ ... ] ?
所见即所得的附加按钮有“styleselect”

标签： tinymce keystonejs

【解决方案1】：

所以，我找到了解决方案，这是一个愚蠢的错误，style_formats: 应该与引号一起出现：

'wysiwyg additional options': { 
            default_link_target: '_blank',
            paste_as_text: true,
            menubar: true, // added to test formats
            style_formats: [ 
                { title: 'Red text', inline: 'span', styles: { color: '#ff0000' } }
                ],
            formats: {
                    bodytext: {block : 'p', attributes : {title : 'bodyText'}, styles : {color : 'grey'}}
                }
        }, });

我希望如果其他人也遇到这个问题，您可以检查一下这是否可以为您解决。

【讨论】：