How To Properly Add Together Font Awesome Icons Inward Blogger
What is Font Awesome:
Font Awesome provides scalable vector icons that looks expert at whatever size or dimension. Being a spider web designer you lot powerfulness demand a lot of unlike icon ready to make your blueprint a professional person ship on land maintaining the latest developing standards. According to the Font Awesome site:Font Awesome gives you lot scalable vector icons that tin forthwith last customized — size, color, drib shadow, too anything that tin last done amongst the ability of CSS
Why to purpose Font Awesome:
Though the perks of using this tool are countless but few of the prominent ones are mentioned below:- Wide Range of Icons: It provides a broad make of high character vector icons too build clean images.
- Supports CSS: It also industrial plant amongst CSS thence that colors, size, shadows too other components tin easily last adjusted too applied to them.
- Speed: Font Awesome images are extremely lightweight too loads rattling chop-chop equally compared to the CSS Spirit images.
- Flexibility: They are thence many unlike ways to add together too purpose Font Awesome inwards your site to improve its surgical operation too site appearance.
- Innovate: The squad behind this amazing tool is highly talented too they are continually working to acquire inwards fifty-fifty better.
- Everything for FREE: You tin acquire this too everything for absolutely FREE.
How to Properly Add Font Awesome Icons inwards Blogger:
Step#1: Installing Font Awesome inwards Blogger:
The proper agency to install Font Awesome is to include it inwards your Blogger Template file without compromising the speed is to add together it correct afterward the <head> Tag. Therefore, become to Blogger >> Template >> Edit HTML too search for the <head> tag, but below it glue the next business of code.<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"/>
Step#2: Using Icons inwards Blogger:
Since, nosotros stimulate got been using the newly released version of the Font Awesome 4.0.1. Therefore, croak along inwards heed that naming has been changed for the version 4.0+ significantly from the previous version 3.x. All examples below are using version 4.0.1. Check out this example:<i class="fa fa-play-circle"></i> fa-play-circle
It would make you lot the follow result:
fa-play-circle
If you lot desire to access the consummate listing of available icons become to Font Awesome Icons inventory. It volition non solely supply you lot a consummate make of icons, but would also supply a agency to add together them inwards your site which makes it a lot easier for non-designers.
Step#3: Applying CSS to Icons:
You tin alter the color, size, shadow too to a greater extent than through applying CSS to your icons. The method is quite straightforward too it is achieved through the cast given to your icon. Check out the next example:
.fa-play-circle {
font-size:20px;
font-weight:bold;
color:#111;
border:1px corporation #111;
padding:10px;
float:left;
}
If you lot are withal confused virtually the usage, thence you lot tin also stimulate got a hold off at Examples page providing in-depth conduct to both designers too non-designers.
Font Awesome is a fantastic, flexible too a fast agency to add together character graphic vectors to your blogger site. There are tons too tons of endless purpose to graphics inwards menus, posts, footer too etc to spice upwardly your site. We promise this article may stimulate got helped you lot inwards learned how to properly add together font awesome inwards blogger. Do part your thoughts inwards the department below.