css - 将 Episerver 升级到 11.5 版后 TinyMCE“EditMenuName”css 属性不起作用

Question

将Episerver升级到 11.5 版后，能够在下拉菜单中为菜单项设置自定义名称的TinyMCE功能不再起作用。

我猜这个特殊的自定义 CSS 属性EditMenuName不起作用。那些仅显示特定 CSS 类名称的菜单项。不是作为“EditMenuName”属性提供的名称。

如何让这个功能再次发挥作用？

标签： csstinymceepiserver

Answer 1

对此没有任何支持。您可以做的是将这些项目添加到 中style_formats，请参阅https://www.tinymce.com/docs/configure/content-formatting/#style_formats。有关如何自定义编辑器的更多信息https://world.episerver.com/documentation/developer-guides/CMS/add-ons/customizing-the-tinymce-editor-v2/。

这是一个示例配置：

config
.Default()
.Schema(TinyMceSchema.Html5Strict)
.ContentCss("/gui/css/base.css")
.AddPlugin("link table paste code contextmenu")
.Toolbar(
    "styleselect undo redo pastetext removeformat searchreplace code fullscreen",
    "bold italic numlist bullist outdent indent table epi-link unlink image epi-image-editor epi-personalized-content")
.StyleFormats(
    new { title = "Paragraph", format = "p" },
    new { title = "Header 2", format = "h2" },
    new { title = "Header 3", format = "h3" },
    new { title = "Header 4", format = "h4" },
    new
    {
        title = "Inline",
        icon = "forecolor",
        items = new[]
        {
            new { title = "Strikethrough", format = "strikethrough", icon = "strikethrough" },
            new { title = "Superscript", format = "superscript", icon = "superscript" },
            new { title = "Subscript", format = "subscript", icon = "subscript" },
            new { title = "code", format = "code", icon = "code" }
        }
    },
    new
    {
        title = "Blocks",
        icon = "template",
        items = new[]
        {
            new { title = "Blockquote", format = "blockquote" },
            new { title = "Preformatted", format = "pre" },
        }
    },
    new
    {
        title = "Images",
        icon = "image",
        items = new[]
        {
            new { title = "Left", selector = "img", classes = "left", icon = "alignleft" },
            new { title = "Right", selector = "img", classes = "right", icon = "alignright" },
            new { title = "Full-width", selector = "img", classes = "fullwidth", icon = "alignjustify" }
        }
    },
    new
    {
        title = "Tables",
        icon = "table",
        items = new[]
        {
            new { title = "Left", selector = "table", classes = "left", icon = "alignleft" },
            new { title = "Right", selector = "table", classes = "right", icon = "alignright" },
            new { title = "Full-width", selector = "table", classes = "fullwidth", icon = "alignjustify" }
        }
    });