How can I use fontawesome icons as the default bullet for unordered lists?

Viewed 4631

On fontawesome's example page, they show this code:

Use fa-ul and fa-li to easily replace default bullets in unordered lists.

<ul class="fa-ul">   
    <li><i class="fa-li fa fa-check-square"></i>Listicons (like these)</li>   
    <li><i class="fa-li fa fa-check-square"></i>can be used</li>   
    <li><i class="fa-li fa fa-spinner fa-spin"></i>to replace</li>   
    <li><i class="fa-li fa fa-square"></i>default bullets in lists</li> 
</ul>

This works fine, but I have a lot of unordered lists on my wordpress site, and I was wondering if it was possible to make the fontawesome checkbox the default bullet across the entire site? I know that my theme uses LESS, so any LESS code is acceptable.

I was thinking about doing something like like this in css:

ul li i {
   class="fa-li fa fa-square";
}

But I don't think that's possible with css. I was looking at LESS and I think mixins might prove useful, but I haven't been able to figure out the correct syntax.

Any help is much appreciated.

1 Answers
Related