How to add an image in a menu in wordpress

I was working on a project that needs an image in a menu. First, I was thinking to modify the theme but it felt like it’s kinda silly to do that. I had this feeling that wordpress can support that functionality without being so geekish.

Guess What! I’m right! So now, i’ll show you how to add an image in a menu in wordpress.

  • Go to Appearance->Menus
  • Add a Custom Link
  • ¬†Enter the url of the image when it is clicked. I only put “#” since I only wanted to show the image no redirection happening or whatsoever.
  • Here’s the interesting part. Did you know that you can put HTML tags in the Label, Yes! you read it right! You can put HTML tags in the label. ¬†That is where you can put something like this <div><img src=”myImageSrc” /></div>. You can even put the inline CSS in there. So it looks like this:
  • Then hit “Add to Menu” ! Now you are golden! Refresh your page and see the beauty of your menu!

 

So that’s how easy to add an image in a menu in wordpress!

Have a happy coding! Cheers! :)

4 thoughts on “How to add an image in a menu in wordpress

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>