How To Add Icons in Navigation Menu Along With Text

Adding icons before Options in navigation menu in blogger make's the blog more pretty.Icons before text will also create a good impact on Blogger template.If you are using a Wordpress blog this option is very simple by adding a PlugIn called IconIt.But in case of Blogger/Blogspot blogs we want to manually add the HTML section of your blog and insert a piece of HTML tag.

All you want to do is  follow the below given  steps and add a piece of HTML tag

Demo ::

Also Check : Add Alexa Site Metrics Certificate To Any Blog

  • Go to Blogger  > Dasboard > Template > Edit HTML
  • Go to the section of Navigation menu,To find,If you want to add icon before the option named "Download" then press Ctrl + F and in the box type as "Downloads
  • Then select the whole code of the particular option you want to add icon 
  • Replace the Code of your option with the code given below :

<li><a href='' itemprop='url'><i class='fa fa-paper-plane'/><span itemprop='name'>Tutorials</span></a></li>

Changes To Make

  1. Replace the red coloured URL with the URL of your label.
  2. Replace the code "fa fa-paper-plane" with your icon code you can browse and add your favourite code here : Visit Now
  3. Replace the word "Tutorials" with the name of your option

Do it for your all options in navigation menu to change all

Hi Guys, I'm Astro Joseph a young Blogger from Kerala,India.I Started IPEE World as passion and it is now empowering Millions of Readers around the Globe.Read more at About Page

Sharing is Caring :)

Related Articles

Previous Article
Next Article »

We’re very excited to see your comments. However, Please Keep in mind that, All Comments are strictly moderated by us before publishing.Comments with Links and other unnecessary contents will be removed and will not be published. :)

Contact Form


Email *

Message *