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? – Maruti Mohanty Dec 23 '13 at 9:52
  • yeah..it is in the images folder inside my theme folder – Zammuuz Dec 23 '13 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 – Maruti Mohanty Dec 23 '13 at 10:48
  • i'm not getting the image. but the class "home-icon" is showing with other classes of home menu. – Zammuuz Dec 30 '13 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 Jan 2 '14 at 10:45

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, privacy policy and cookie policy

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