How To Add Font Awesome Icons In Blogger Template

How To Add Font Awesome Icons In Blogger

What is Font Awesome?

Font Awesome is an iconic font especially designed for Bootstrap. Collection of Scalable Vector Graphic icons that can be customized. These Font Awesome icons are in compact-sized.Font Awesome contains a collection of 369 SVG icons from a wide array of categories, including navigation controls, form controls, buttons, currency icons, web application and brand icons, and so on.Font awesome icons load much faster as compared to CSS sprite images.You can use CSS styles to modify them change size, color, shadows etc.
how to add Font Awesome icons to Blogger?

installation steps

1 Go To Blogger > Template
2 Click Edit HTML 
3 Search <head> 
4 Paste the following code after it.
<link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"/>

Adding font awesome icons

You can check it out list of available Font Awesome Icons here. Pick any font awesome icon of your choide, and write down its CSS Class name e.g. fa-home or fa-arrow-down.To use this icon, add the <i> tag look below for e.g
<i class="fa fa-home"></i>

Editing/Adding CSS style

.fa-home {
 font-size: 22px;
 color: #ff3333;
 padding: 7px;
 border: 1px solid #000;
 float:left;
}
If you need any help regarding font awesome icons feel free to ask.