Sign in Register
Copied to clipboard

Flag this post as spam?

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


  • Chris Koiak 700 posts 2626 karma points
    Dec 06, 2011 @ 10:30
    Chris Koiak
    0

    RichTextEditor (TinyMCE) Nested Lists Markup

    When I nest unordered lists via the RichTextEditor then nested UL is wrapped <li style="list-style: none;"/>

    Does anyone where you can change/control this?

    I'd prefer the markup to either use a class name on the surrounding LI or (ideally) include the nested UL in the last valid LI.

    Generated markup (after you hit save)

    <ul>
    <li>Item 1</li>
    <li style="list-style: none;">
    <ul>
    <li>Sub Item 1</li>
    </ul>
    </li>
    <li>Item 2</li>
    </ul>

     

    Thanks

    Copy Link
  • Jan Skovgaard 11280 posts 23678 karma points MVP 12x admin c-trib
    Dec 06, 2011 @ 22:39
    Jan Skovgaard
    1

    Hi Chris

    I'm not sure where to actually change this odd behaviour but as a workaround I suppose you could write something like

    html .yourrtecontentcontainer li{display:block} or use jquery to remove the style attribute? I know it's not ideal but perhaps it could do as a workaround?

    /Jan

    Copy Link
  • Chris Koiak 700 posts 2626 karma points
    Dec 07, 2011 @ 09:23
    Chris Koiak
    0

    Thanks for the response Jan. The css approach won't work as the li is already block and I'd use jquery as a last resort for this.

    The main issue is that the parent li has a background image as a bullet, therefore I end up with a, seemingly, additional bullet.

    Any other thoguhts?

    Copy Link
  • Euan Rae 105 posts 135 karma points
    Dec 07, 2011 @ 11:28
    Euan Rae
    2

    You could try going into the tinyMce.config file and in the '<validElements>' section, and try update '-li[class|style]', to be '-li[class]'.  Not 100% sure if this will work though.

     

    Copy Link
  • Chris Koiak 700 posts 2626 karma points
    Dec 07, 2011 @ 11:32
    Chris Koiak
    0

    Nice idea Euan, definately stops the inline styles. However doesn't stop the un-neccessary LI tag or give me control via CSS 2

     

    Copy Link
  • Chris Koiak 700 posts 2626 karma points
    Dec 07, 2011 @ 12:33
    Chris Koiak
    2

    I've found the solution! You need to install and enable the 'lists' plugin.

    • Get the source for TinyMCE and move '\tinymce\jscripts\tiny_mce\plugins\lists' folder to '\umbraco_client\tinymce3\plugins\lists'
    • Add the following line to the 'plugins' section in 'config\tinyMceConfig.config' 
    <plugin loadOnFrontend="true">lists</plugin>

     

    Thanks to everyone for their input.

    Copy Link

  • 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