TinyMCE add custom CSS-Class for Headings, Blocks [SOLVED]

after digging through Plone, and Mockup.
How can I add a custom Heading (header_styles), or Block (block_styles) CSS-Classes?

This is how I did it in Plone4

Accordion Heading|h2|css-accordion-heading

But since mockup the last part is used as icon for TinyMCE-Dropdown-Icon (Source)

And as far as I have tried, "Formats" arent also not working...

Plone 5.1-latest

In the registry.xml you can put some Editor-Config-Values:

<!-- register custom css settings for editor -->
  <field type="plone.registry.field.Text">
    <description>Editor Settings, push JSON to Configure the Editor, Read Docs!</description>
    <title>Other Settings</title>
      "style_formats" : [
          "title" : "Video",
          "inline" : "span",
          "attributes" : {
            "class": "wcvideo"
       { "title": "Image Responsive", "selector": "img", "classes" : "img-responsive" },
       { "title": "Link Download", "selector": "a", "classes" : "link-list link-download" },
       { "title": "Link Member", "selector": "a", "classes" : "link-list link-network" },
       { "title": "Link Activity", "selector": "a", "classes" : "link-list link-activity" },
       { "title": "Link Join Us", "selector": "a", "classes" : "link-list link-join-us" }
     "style_formats_merge": "True"
1 Like

Thank you, works perfect - now I have found it (Documentation)

1 Like