On March 26, 2019 we launched new MODX Forums. Please join us at the new MODX Community Forums.
Subscribe: RSS
  • You might find that you need to allow some HTML5 elements in your TinyMCE editor, but by default it does not allow any of these new elements. Now, you are probably not going to want to be allowing editors to add elements like header,footer,section - these should probably be controlled in your template/snippet/chunks, but some elements it is nice to add this feature in. For instance, I wanted to be able to allow the figure and figcaption elements to be used to wrap images. Note: this is only possible if you use HTML mode, this is not an automatically added tag.


    Locate the config file for TinyMCE, and update the mce_extended_valid_elements variable to include the elements you need.
    The config file is located:
    In Evo: 'assets/plugins/tinymce/js/xconfig.js'
    In Revo: 'assets/components/tinymce/xconfig.js'

    You add the name of the element, plus any attributes that should be allowed. Multiple elements are added separated by a comma. Details on how to add elements are here.
    http://www.tinymce.com/wiki.php/Configuration:extended_valid_elements

    var mce_extended_valid_elements = "figure[class],figcaption";


    It can be also helpful to refer to the docs for the standard valid_elements, as this describes how the rules are applied in more detail:
    http://www.tinymce.com/wiki.php/Configuration:valid_elements

    Also, if you are having trouble getting this to work, check you have emptied your browser cache since making the change. [ed. note: christianhanvey last edited this post 8 years, 3 months ago.]
    • Nice tip. Thanks!
        Did I help you? Buy me a beer
        Get my Book: MODX:The Official Guide
        MODX info for everyone: http://bobsguides.com/modx.html
        My MODX Extras
        Bob's Guides is now hosted at A2 MODX Hosting
      • Hi,

        I'm not able to locate the config file you're talking about.
        It's now Tiny 4.32
        • Hi,

          I'm not able to locate the config file you're talking about.
          It's now Tiny 4.32

          Thanks
          • Hi elz064,
            which version of MODX are you using? And you have definitely installed TinyMCE?
            I have a fresh install of v2.2.2 and Tinymce4.3.2 and the config file is definitely at:
            'assets/components/tinymce/xconfig.js'

            (I also notice that many HTML5 elements have now been added by default)
            • oh, I'm sorry I found it. Probably not looking the right folder. {: ((
              However, with revo 2.22 and last Tiny I can actually see figureand figcaption are already included into the valid elements list.

              But I just can add them to the select list to make them pickable in the select.
              Same issue for strong tag which is now included into the valid list but no way to make it appears in the select .

              I'm doing it by adding those tag in the tiny.theme_advanced_blockformats (system param) list.
              This only add new blank lines into the select, but strictly nothing else.

              How do you manage ??
              Thank you [ed. note: elz064 last edited this post 7 years, 7 months ago.]
              • I dont wanna bump old threads but I have another solution in revolution.

                1. Open: core/components/tinymce/templates/script.tpl
                2. Add your code after this:
                Tiny.config = <?php echo $this->modx->toJSON($this->properties); ?>;


                In my case I add'd this code
                Tiny.config.valid_elements = "*(*)";


                I can't use the bracket in my code so replace ( with [ [ed. note: DragoslaV last edited this post 7 years, 3 months ago.]
                  Jack of all Trades and Proud Honda Zoomer owner. Also available on twitter.
                • Great tip. Thanks for posting. smiley


                  ------------------------------------------------------------------------------------------
                  PLEASE, PLEASE specify the version of MODX you are using.
                  MODX info for everyone: http://bobsguides.com/modx.html
                    Did I help you? Buy me a beer
                    Get my Book: MODX:The Official Guide
                    MODX info for everyone: http://bobsguides.com/modx.html
                    My MODX Extras
                    Bob's Guides is now hosted at A2 MODX Hosting
                  • Anyone got a solution to the <li plus indent button producing blockquote tags?
                      Frogabog- MODX Websites in Portland Oregon
                      "Do yourself a favor and get a copy of "MODX - The Official Guide" by Bob Ray. Read it.
                      Having server issues? These guys have MODX Hosting perfected - SkyToaster
                    • In my case I add'd this code
                      1

                      Tiny.config.valid_elements = "*(*)";

                      Hi,

                      Tried this.. still nothing. as soon as I click on INSERT there's no more my code into the rte (only a surrounding div if my custom tpl had one, but everything inside it had been removed).

                      Really, does any of the modx guru can find something please?

                      thank you