It’s no secret that I love fonts. I am also becoming a huge fan of using icons as well. Icons are universal and get the point across quickly. I recently came across a site that has been making my love of icons even greater and allows me to display them on my blog; not just in graphics (like you can with Canva) but within widgets on your blog. Since this is new to me I thought I would share it with all of you as well. Get ready to use Font Awesome to make your blog POP!
I have included affiliate links within this post. If you click on them and purchase something, I will be compensated. Rest assured that I completely endorse all businesses and products that I use on my site.
Icons are a great way to get your message across quickly and they often are universal across languages. They are becoming more and more popular. In fact, my theme designer, Restored 316 Designs, just released a new theme that has utilizes icons. Icons are a great addition to any website in my opinion.
There’s a few steps to making this work but don’t let that scare you. I shied away from it myself for a few weeks thinking it might be too difficult once I read that I needed to insert code into my website. I got enough nerve to try it again and I am glad I did. As a disclaimer, this tutorial is for WordPress blogs. I’m not sure how to do it with Blogger blogs and don’t want to steer anyone wrong.
Using Font Awesome to Make Your Blog Pop!
Add the Insert Headers and Footers Plug In
This plug in is amazing for people like me that instantly freeze up when anything says “Add this code to your header (or footer) area.” Simply download the Insert Headers and Footers Plug In and you will be able to insert code without being afraid of crashing your site. Once added and activated, you can access this under Settings in your WordPress dashboard.
Head Over to Font Awesome
Font Awesome is pretty amazing. Take a look at the icons available. Keep in mind this is just a sample of what’s available to you. You can find all of them here.
Let’s start with adding the code to your site. Head over to the Get Started page on Font Awesome. Naturally I chose the easiest method and copied and pasted that code into my blog under the Insert Headers and Footers portion of my WordPress dashboard located under settings.
Start Browsing for Icons // Add Code to Your Blog
Choose an icon that you want to add to your site. I chose to add the house icon to my blog homepage. Click on the icon you choose.
Now copy and paste that code into the widget area where you want it displayed.
I also added the <center> and </center> coding at the end so that the icon would be centered.
Each icon can be enlarged or made smaller.
Simply choose the size you want and add the “fa-2x” (for example) before the end quotes of your coding. See my above photo of the widget area for a visual.
Click on Save. Head to your blog to see the icon in action.
I also added an icon to my sidebar as well as an example.
Adding icons to your blog is a breeze with this simple tutorial! Click To Tweet
That’s it! You now have the ability to use icons on your blog.
Be sure to take a look around Font Awesome’s website. The possibilities are endless and they have some great options as to how you can display them on your blog.