Plone 5:为什么TinyMCE禁用自定义内联样式?

keu*_*eul 11 tinymce plone plone-5.x

我在TinyMCE和Plone 5上遇到了一个问题,但我不确定问题的核心是Plone CMS还是TinyMCE.

我在TinyMCE控制面板配置中添加自定义样式("TinyMCE设置" - >"内联样式").

新配置是这样的:

Bold|bold|bold
Italic|italic|italic
Underline|underline|underline
Strikethrough|strikethrough|strikethrough
Superscript|superscript|superscript
Subscript|subscript|subscript
Code|code|code
Custom style|customClass|custom-class
Run Code Online (Sandbox Code Playgroud)

然后TinyMCE编辑器正确呈现菜单:

在此输入图像描述

但新闻条目是"禁用",点击它将无能为力.检查TinyMCE菜单的标记我发现:

<div aria-checked="false" aria-disabled="true" role="menuitem" id="mceu_155" class="mce-menu-item mce-menu-item-preview mce-stack-layout-item mce-last mce-disabled" tabindex="-1">
    <i class="mce-ico mce-i-custom-class"></i>&nbsp;
    <span id="mceu_155-text" class="mce-text">Custom style</span>
</div>
Run Code Online (Sandbox Code Playgroud)

所以:TinyMCE正在禁用它.问题似乎与我正在使用的课程有关,而不是我给的名字或缺少的图标.如果我使用另一种风格的副本,比如...

...
Custom style|italic|custom-class
Run Code Online (Sandbox Code Playgroud)

...有用.同样如果我使用另一个知道Plone类就像......

...
Custom style|discreet|custom-class
Run Code Online (Sandbox Code Playgroud)

......但是某些其他课程是不允许的.

这与TinyMCE内部相关吗?TinyMCE是否正在"测试"该类以启用/禁用它们?或者这个问题与Plone有关吗?

keu*_*eul 6

经过大量的调试,在模型+ Plone JSON conf + TinyMCE地狱中失去自己,我找到了该用例的解决方案:

具有额外和工作内联样式是" 内联样式 "配置的问题...

在此输入图像描述

......和" 格式 "配置......

在此输入图像描述

所以:你可以很容易地还可以通过配置该通用的设置提供registry.xml如下:

<registry>

    <record name="plone.inline_styles" interface="Products.CMFPlone.interfaces.controlpanel.ITinyMCESchema" field="inline_styles">
        <value>
            <element>Bold|bold|bold</element>
            <element>Italic|italic|italic</element>
            <element>Underline|underline|underline</element>
            <element>Strikethrough|strikethrough|strikethrough</element>
            <element>Superscript|superscript|superscript</element>
            <element>Subscript|subscript|subscript</element>
            <element>Code|code|code</element>
            <element>Foo Bar Baz|foo|foo</element>
        </value>
    </record>

    <record name="plone.formats" interface="Products.CMFPlone.interfaces.controlpanel.ITinyMCESchema" field="formats">
        <value>{
    "clearfix": {
        "classes": "clearfix",
        "block": "div"
    },
    "discreet": {
        "inline": "span",
        "classes": "discreet"
    },
    "foo": {
        "inline": "span",
        "classes": "foo"
    }
}
</value>
    </record>

</registry>
Run Code Online (Sandbox Code Playgroud)

:这是相关的"内容格式 "菜单.

在此输入图像描述

++plone++static/tinymce-styles.css由于TinyMCE importcss插件,样式表中的样式会自动从样式表中加载.

有关更多信息,请参阅https://github.com/plone/Products.CMFPlone/issues/492https://github.com/plone/Products.CMFPlone/issues/1264.

  • 史诗般的探险! (2认同)