Home>Support>Fontawsome Icon instead of square in bullet list

Fontawsome Icon instead of square in bullet list

By Jose AMezcua, 9 years ago. Last reply by Andrew Misplon, 9 years ago.

Hello Site Origin,

I hope you guys are all doing great!

I would like to add this custom icon: http://fortawesome.github.io/Font-Awesome/icon/bolt/

to replace the square in the entry lists.
And also change the color.

How can I do this!
Thanks in advance,
J

URL: http://electricaixtapa.com/productos/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 4 months ago Andrew Misplon
    Hi, I Work Here

    Hi Jose

    Good to hear from you. Please take a quick look at:

    http://stackoverflow.com/questions/13354578/custom-li-list-style-with-font-awesome-icon

    The first answer at the above link is good.

    Here is the JSFiddle from the answer: http://jsfiddle.net/joplomacedo/a8GxZ/

    For your case you might change the rule slightly, you’ll also need to add in the FontAwesome content code:

    .entry-content ul li {
  padding-left: 1.3em ;
}

.entry-content ul li:before {
  content: "\f0e7";
  display: inline-block;
  margin-left: -1.3em;
  width: 1.3em;
}

    Hope that helps.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More