Support Center Visit Demo License manager Buy @ envato

Bullet List w/Icons?

jasfolsomjasfolsom
in Shortcodes
Is it possible to have the bullet list use icons of my choosing other than the star, idea, and check marks? More specifically I'm attempting to do this within the "Footer #4" Widget area.

Comments

  • AlbertAlbert
    Hi,

    this can be done with custom css only. Or you can also replace current images on FTP responsible for list items.

    Thanks!
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • jasfolsomjasfolsom
    Could you be a little more specific? This is what I've found in the CSS, am I able to add to this in the custom CSS section?

    ul.list_mixed, ul.list_check, ul.list_star, ul.list_idea { margin-left: 0; }
    ul.list_mixed li, ul.list_check li, ul.list_star li, ul.list_idea li { margin-bottom: 20px; position: relative; list-style: none; padding-left: 50px; margin-left: 0; }
    ul.list_mixed li:after, ul.list_check li:after, ul.list_star li:after, ul.list_idea li:after { content: ""; width: 70px; height: 1px; overflow: hidden; background: rgba(0,0,0,.08); position: absolute; left: 0; bottom: -11px; }
    ul.list_mixed li:last-child:after, ul.list_check li:last-child:after, ul.list_star li:last-child:after, ul.list_idea li:last-child:after { display: none; }
    ul.list_check li, li.list_check { background: url(../images/icons/list_check.png) no-repeat 20px 5px; }
    ul.list_star li, li.list_star { background: url(../images/icons/list_star.png) no-repeat 20px 5px; }
    ul.list_idea li, li.list_idea { background: url(../images/icons/list_idea.png) no-repeat 20px 6px; }
  • AlbertAlbert
    Yes, sure. In the last 3 lines, you have paths to current list images. If you are not planning to use our lists, you can replace those images with your own.
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
Sign In or Register to comment.