We have already shown you how to add custom navigation menus and how to style navigation menus in WordPress themes. In the styling article, we covered how you can add background images to each menu item by using classes. Well if you don’t want to got that route, then we have another solution for you. In this article, we are going to show you how to add custom menu image to each WordPress menu item using a plugin.
First thing you need to do is install and activate the Custom Menu Images Plugin for WordPress.
Once you have activated it, go to the menus screen and select a menu. If you notice, each menu item has an extra field now which lets you select an image.
In the Navigation Image field you can either enter the URL of the image or upload it. As for the CSS, this plugin doesn’t come with any styling out of the box. You will have to add custom CSS classes and style your custom images the way you want. While testing the plugin we noticed a bug with regards to the way CSS classes were applied. This plugin will override all existing CSS classes in the menu. If you don’t have any, then it should work fine. If you did, then be cautious about that. We have already contacted the author about the issue.