Plone 5：为什么 TinyMCE 禁用自定义内联样式？

Question

我在 TinyMCE 和 Plone 5 上遇到问题，但我不确定问题的核心是在 Plone CMS 还是在 TinyMCE 上。

我正在 TinyMCE 控制面板配置中添加自定义样式 ("TinyMCE Settings" --> "Inline styles")。

新配置是这样的：

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

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

但是新闻条目是"disabled"，点击它没有任何反应。检查我发现的 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>

因此：TinyMCE 正在禁用它。这个问题似乎与我使用的 class 有关，与我提供的名称或丢失的图标无关。如果我使用另一种样式的副本，例如...

...
Custom style|italic|custom-class

...有效。如果我使用另一个众所周知的 Plone class 就像...

一样

...
Custom style|discreet|custom-class

...但是其他 class 是不允许的。

这与 TinyMCE 内部结构有关吗？ TinyMCE 是 "testing" class 到 enable/disabled 吗？还是这个问题与 Plone 有关？

Answer 1

经过大量调试，在 mockup+Plone JSON conf+TinyMCE 地狱中迷失了自己，我找到了 that 用例的解决方案：

具有额外的和有效的内联样式是“内联样式”配置的问题...

...和“格式”配置...

因此：您也可以通过 通用设置 提供 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>

注意：这不与“格式”菜单的内容相关.

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

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

Plone 5：为什么 TinyMCE 禁用自定义内联样式？

Plone 5: why TinyMCE disable custom inline styles?

tinymce

plone

plone-5.x