3

After upgrading Episerver to version 11.5, the TinyMCE feature of being able to set custom names for menu items in a drop down is no longer working.

The special custom CSS attribute called EditMenuName is not working I guess. those menu items only showing particular CSS class names. not the names which are provided as "EditMenuName" attributes.

How do I get this feature working again?

Ironcache
  • 1,719
  • 21
  • 33
Eashan
  • 438
  • 4
  • 16

1 Answers1

3

There is no support for this. What you can do instead is to add these items to the style_formats, please see https://www.tinymce.com/docs/configure/content-formatting/#style_formats. More information on how you can customize the editor https://world.episerver.com/documentation/developer-guides/CMS/add-ons/customizing-the-tinymce-editor-v2/.

Here's an example configuration:

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" }
        }
    });
Johan Petersson
  • 972
  • 4
  • 13
  • Hi Johan Petersson, Plese refer this link to see full comment. https://www.goconqr.com/en-US/notes/13691222/edit – Eashan May 11 '18 at 09:45
  • That link doesn't work. Why not just post the comment here? – Johan Petersson May 12 '18 at 12:08
  • Hi Johan Petersson, Thanks for your response. Sorry about the broken link. I want to share my source code with you, that's why I'm trying to use link. because this comment field has character limitations. Can you please try this link in Codepen :- https://codepen.io/eashanxyz/pen/mLKzov?editors=1000 – Eashan May 14 '18 at 03:43
  • Update to latest version. Episerver has changed the default behavior now regarding the Styles select. Please see https://world.episerver.com/documentation/Release-Notes/ReleaseNote/?releaseNoteId=CMS-10052. – Johan Petersson May 18 '18 at 14:11
  • Thanks Johan Petersson, appreciate your reply. I'll discuss about this with development team. – Eashan May 18 '18 at 15:24