Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Sign in to follow this  

HTML Tip 1: Adding Font Awesome

Recommended Posts

Font Awesome is a great way to add cool icons without having to bog your site down with images. The even cooler part is that you can change their color, their size and have cool spinning icons and everything. You can read more about Font Awesome on their site:




It's pretty easy to add it to your site. You can either host it yourself or you can use a CDN (Content Delivery Network) link. The easy option is to use a free CDN and enter it into the <head> bit of your skin.


<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">

(You are free to simply copy the above link into your HTML.


Then you can get cool icons like what we have up in the header of the Initiative site by using things like this:

<i class="fa fa-bath" aria-hidden="true"></i>


I personally love to use these as macros as they are clean and simple and you can make them any size with an extra class or a span around the icon.


More in a future tip.

  • Thank you 1





Profile set made by @jordan of Dark Motives


Share this post

Link to post
Share on other sites
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Create New...

Important Information

By using this site, you agree to our Terms of Use, Guidelines and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.