Jump to:

3444 Posts in 1030 Topics by 871 members

Template Questions

SilverStripe Forums » Template Questions » add custom style to TinyMCE

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 5031 Views
  • NtM
    Community Member
    39 Posts

    add custom style to TinyMCE Link to this post

    I'm trying to add a new style to "--Styles--" TinyMCE:

    I go to "sapphire/forms/HtmlEditorField.php" and up-commented

    new HtmlEditorField_dropdown("mceSetCSSClass", "styleSelect", array(
                "mceContentBody" => "mceContentBody",
    inside the function Buttons.

    I also added span to "--Format--":

    new HtmlEditorField_dropdown("FormatBlock", "formatSelect", array(
                "<p>" => _t('HtmlEditorField.FORMATP', "Paragraph", PR_MEDIUM, '<p> tag'),
                "<h1>" => _t('HtmlEditorField.FORMATH1', "Heading-1", PR_MEDIUM, '<h1> tag'),
                "<h2>" => _t('HtmlEditorField.FORMATH2', "Heading 2", PR_MEDIUM, '<h2> tag'),
                "<h3>" => _t('HtmlEditorField.FORMATH3', "Heading 3", PR_MEDIUM, '<h3> tag'),
                "<h4>" => _t('HtmlEditorField.FORMATH4', "Heading 4", PR_MEDIUM, '<h4> tag'),
                "<h5>" => _t('HtmlEditorField.FORMATH5', "Heading 5", PR_MEDIUM, '<h5> tag'),
                "<h6>" => _t('HtmlEditorField.FORMATH6', "Heading 6", PR_MEDIUM, '<h6> tag'),
                "<address>" => _t('HtmlEditorField.FORMATADDR', "Address", PR_MEDIUM, '<address> tag'),
                "<pre>" => _t('HtmlEditorField.FORMATPRE', "Preformatted", PR_MEDIUM, '<pre> tag'),
                "<span>" => _t('HtmlEditorField.FORMATPRE', "parentItem for Quickinks", PR_MEDIUM, '<span> tag'),

    But nothing is changed inside my TinyMCE

  • elsbth
    Community Member
    8 Posts
  • NtM
    Community Member
    39 Posts

    Re: add custom style to TinyMCE Link to this post

    From what I found out:

    to add classes to the dropdown box, you don't need to change anything in "sapphire/forms/HtmlEditorField.php". You need to add class "editor.css" to your theme (css folder) and define classes there. All the classes from editor.css will automatically appear in the dropdown menu of TinyMCE.

    And how to add a new tag in the drop-down box......I still don't know

Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.