javascriptrichtextboxtinymcerichtextediting

TinyMCE: Using CSS class attributes with the formatselect-dropdown formats

I would like to customize the formats in the TinyMCE formatselect dropdown to support css class attributes.

Example: If would like to be able to select <h2 class='foo'> instead of just <h2> as format in the formatselect dropdown.

Does anyone here have an idea how I could do this?

Solution

  • There is no smart way to do this in the current TinyMCE version according to its main developer:

    We have plans for a advanced style format plugin. So that you can specify formats, styles, containers, wrappers etc in a JSON style structure.

    Best regards,

    Spocke - Main developer of TinyMCE

    ...though there is an "unsmart" way to achieve this:

    A CSS-class h2.foo defined in TinyMCE's content_css will appear in the styleselect dropdown as foo.

    You can now select a <h2>-text and choose the style foo from the styleselect dropdown. This results in <h2 class='foo'>.