Forum Discussion

Tim_'s avatar
Tim_
Community Member
6 months ago

What's your hack for doing lists with icons?

I'd really love a list where I could have icons - with the layout of the numered list.

But it's not a thing, and I sometimes compromise and use the 'image and text' - but it looks awful since the icons are so far away from the text.

The numbered list is already close to how I'd like it to look, and it's almost like Articulate was going to let you edit the numbers, since you can type in values in their editor (but anything you type in doesn't get saved).

If you were able to specify images for each item which get turned into the bullet, that would be perfect. However, asking for feature changes in Rise just seems to be black-holed by Articulate.

I'd also tried the "Quote D" type where you delete the authors name, but you get double apostrophe glyphs you can't remove, and the padding is huge (even when set to zero).

What tricks have you pulled when trying to do a simple list with icons?

Rise 360
  • PhilFoss's avatar
    PhilFoss
    Community Member
    6 months ago

    "Simple list with icons" that made me chuckle and snort coffee all over my laptop. I think I found a good solution with Icons8 they have a huge library and have a very liberal licensing. The only downside is it creates a dependency on icons8.com links. And to use for free you need to credit them, which I think you could do with a 'notes' section at the end of your course. I shall record a video and go over the licensing options and how to "simply" install in your course.

    • AlexSchaffer-cf's avatar
      AlexSchaffer-cf
      Community Member
      5 months ago

      Hi Phil

      This looks great. When you click on inspect and then edit html in the block, where exactly do you paste the code?

      Thanks

       

      Alex

      • PhilFoss's avatar
        PhilFoss
        Community Member
        5 months ago

        Lex, looks like you got this figured out but here's a new screen recording showing how to copy/paste my custom block templates with your debug tool to replace the default text in Rise.

  • PhilFoss's avatar
    PhilFoss
    Community Member
    6 months ago

    Here's how I used icons8.com for these icons. Note that this does create a dependency on the icons8 service. They've got tons of icons, still exploring their service. Its free but check their licensing for giving credit.

    • JoyceNoval-0698's avatar
      JoyceNoval-0698
      Community Member
      2 months ago

      Hey Phil. Thank you for this. I've been using this hack since it looks cool and saved this to my block templates. For some reason, this doesn't work anymore today. The icons were turned into normal bullet symbol. :(

      The existing once that I created can still be previewed but I cannot edit them anymore.

  • Tim_'s avatar
    Tim_
    Community Member
    6 months ago

    HI Phil, great demo and list design. It's frustrating that you have to clone list rows using the inspector, but better than the nothing that Articulate give us.

    • KarlMuller's avatar
      KarlMuller
      Community Member
      6 months ago

      Hi Tim,

      Some time ago Tom Kuhlman made the suggestions below that work well for us.

      1. Leave the Quote area blank.
      2. Put the Quote in the Name area.

      The result looks like this:

      If you use multiples of this block type together, a lot of white space between blocks is an issue. 

      • Tim_'s avatar
        Tim_
        Community Member
        5 months ago

        Hi Karl,

        This is a neat idea, hadn't thought about leaving the quote field empty :)

        Padding is always inconsistent between blocks.

Related Content