i need to add "home.png" icon image as home button instead of text for example enter image description here

i searched this question in google and find out a way, but that didn't work. the method mentioned in those sites are

  1. enable css class in screen options in apperance>>menu
  2. write a class "home-icon"
  3. in style.css insert this class. i wrote the code as

    .home-icon{ background-image:url(images/home.png); }

i followed this site but this didn't work for me. what is the problem in this method? or any other alternative ideas?

  • Did you put a respective icon home.png in the images folder? Commented Dec 23, 2013 at 9:52
  • yeah..it is in the images folder inside my theme folder
    – Zammuuz
    Commented Dec 23, 2013 at 9:56
  • Then can you check with a tool like firebug, if you really are getting the image or not, and also check the permission of the image Commented Dec 23, 2013 at 10:48
  • i'm not getting the image. but the class "home-icon" is showing with other classes of home menu.
    – Zammuuz
    Commented Dec 30, 2013 at 5:19
  • View the page, then view source and copy the URL of the home.png image. Paste that into your browser and see if you get the image, otherwise you might have an error in your path
    – TomC
    Commented Jan 2, 2014 at 10:45

2 Answers 2


to hide "HOME" label from wordpress navigation i use

//change 105 with your home id
 #menu-item-105 span {

and for icon i use "Iconic Navigation" wordpress plugin


i solved the problem by using a plugin named nav-menu images

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.