Copied to clipboard

Flag this post as spam?

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


  • David Peck 690 posts 1896 karma points c-trib
    May 22, 2024 @ 12:55
    David Peck
    0

    Adding a class to a UL in the RTE

    I'm trying to figure out if there is solution that allows me to style some bulleted lists with a different background colour. There are basically two styles of bulleted list, and I need to toggle between them. The <ul /> needs a class to do that.

    Using an RTE stylesheet I don't appear to be able to achieve this. I might end up adding a block inside my RTE, which I don't love.

    I'm sure this used to be possible by setting the stylesheet selector as ul.green but this wraps an additional <ul /> around my original one. Just .green puts <span />s inside my <li />s.

    TIA

  • Danine Noble 82 posts 368 karma points
    May 22, 2024 @ 14:35
    Danine Noble
    1

    D: All the tricks I knew to get it to work do as you describe, or will create a ul with no li tags inside it so enter key just creates new uls but no li.

    This is incredibly annoying as many clients want two-columned lists so there has to be a reliable way to apply a class to the list and not each individual list item :( But now that seems impossible outside of having a ul.class wrapping the actual ul and then requiring non-technical users to go into code and clean it up or they get flagged for improper markup. Or creating a block just for a simple list I suppose. Seems a bit silly when all you need is to apply a single class.

    Sorry I don't have an answer for yah David. Just adding a voice to the need for something like this to work. Key being for non-technical users. Can't expect everyone to go in and play with markup.

  • David Peck 690 posts 1896 karma points c-trib
    May 30, 2024 @ 16:38
    David Peck
    100

    From Discord by Dan Bramall:

    "Umbraco": {
        "CMS": {
            "RichTextEditor": {
                "CustomConfig": {
                   "style_formats": "[{\"title\":\"Lists\",\"items\":[{\"title\":\"Alternative List\",\"selector\":\"ul\",\"classes\":\"alternative\"}]}]"
                }
            }
        }
    }
    

    Update appsetting.json as above

  • 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