Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Dan White 206 posts 510 karma points c-trib
    Jan 15, 2015 @ 20:41
    Dan White
    0

    Overriding RTE style_formats??

    Anyone know how to override the Umbraco default rte style_formats? Prior to v7 I'd do it in the tinyMceConfig by adding something like:

    <config key="nonexistingkey">
        <![CDATA[',
        preview_styles : false,
        style_formats : [
            {title : "-Content Header"},
            {title : "h2", block : "h2", classes : "replace"},
            {title : "h3", block : "h3"},
            {title : "h4", block : "h4"},
            {title : "h5", block : "h5"},
            {title : "h6", block : "h6"},
            {title : "Image Wrap--right", selector : "img", classes : "thumb-right right"},
            {title : "Image Wrap--left", selector : "img", classes : "thumb-left left"}
        ],
        notusedproperty:'xx]]>
    </config>

     

    It isn't working in v7. I've tried a couple ways of formatting it like the following, but still no luck. 

    <config key="style_formats">
        [
            {title: 'Bold text', inline: 'b'},
            {title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
            {title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
            {title: 'Example 1', inline: 'span', classes: 'example1'},
            {title: 'Example 2', inline: 'span', classes: 'example2'},
            {title: 'Table styles'},
            {title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}
        ]
    </config>

    The RTE fails to load and I get a browser error like:

  • Dan White 206 posts 510 karma points c-trib
    Jan 15, 2015 @ 21:59
    Dan White
    0

    Doing some more digging I can see that my settings are being assigned, but as a string. 

    I'm assuming that if there was some conditional logic here (https://github.com/umbraco/Umbraco-CMS/blob/5b9a98ad6ae9e63322c26f7b162204e34f7fcb54/src/Umbraco.Web.UI.Client/src/views/propertyeditors/rte/rte.controller.js#L118) to do a JSON.parse on the value it would work?

  • Dan White 206 posts 510 karma points c-trib
    Jan 16, 2015 @ 17:59
    Dan White
    100

    For anyone else who may be trying to do this, I resolved it by adding the following code to /umbraco/js/umbraco.controllers.js around line:8092 (using Umbraco 7.2.1) just above...
    if(tinyMceConfig.customConfig)

    if (tinyMceConfig.customConfig.style_formats) {
        tinyMceConfig.customConfig.style_formats = JSON.parse(tinyMceConfig.customConfig.style_formats);
    }

    And changing the config to be valid JSON

    [
        {"title": "Bold text", "inline": "b"},
        {"title": "Red text", "inline": "span", "styles": {"color": "#ff0000"}},
        {"title": "Red header", "block": "h1", "styles": {"color": "#ff0000"}},
        {"title": "Example 1", "inline": "span", "classes": "example1"},
        {"title": "Example 2", "inline": "span", "classes": "example2"},
        {"title": "Table styles"},
        {"title": "Table row 1", "selector": "tr", "classes": "tablerow1"}
    ]
  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies