Nav Menu Images is a WordPress plugin (download) that enables uploading of images for nav menu items on a menu edit screen. By default, those images will be displayed instead of text for respective menu items. Note that after upload, you should set an image as featured to be able to display it.
You can also set images that will be displayed only when you hover menu item, or when menu item is of currently displayed page.
How to use
If you have just created menu, or you have just added new menu item, you need to save menu first before you can upload menu item image.

When menu is saved, expand menu item you want to upload image to by clicking on the arrow on the right. This will reveal additional options and a link for image uploading.

When media modal opens up, make sure that you list only images uploaded to that menu item. Do this each time you want to change or upload image.

When you upload image, just click on a button “Set featured image” to make it menu item image.

When you set image as featured, you will be returned to default menu managment screen where you can see links for removing and changing of menu item image.
Link for changing menu item image is also used when you want to upload image that is used for hover or when menu item is active.

If you want to upload image for hover or active, change tab to upload new images and upload image you want.

When image is uploaded, make sure that only that image is selected in the list from the left side. After you select it, scroll down at sidebar “Attachment details” until checkbox “Used on hover?” is visible and check it if you want to use that image on hover.

If you want to add image to show when menu item is active, follow procedure from above for adding hover image, and only check “Used when active?” checkbox.

If you want to remove image used for active or hover, just uncheck it or delete it.
For developers
Developers can use many available filters to make their own way of displaying images, or even create a child class on top of base one. Read a detailed guide for developers.
Although this plugin displays uploaded images out of the box, it will probably not give best possible look, so it’s recommended to create custom CSS styles for affected elements.
I need feature X, will you help me?!
I’m very aware that many users need functionalities or custom solutions that aren’t available out of the box, but I can’t provide free support or custom development for your needs. If you need something like that, I’m available for hire and I can look at your problem and solve it for a fee. This will help continuous maintaining of this plugin for general usage.
Credits
Nav Menu Images code is partly based on a code from now defunct plugin Custom Menu Images by Anabelle Handdoek/∞manos s.a.s and a code from plugin Metronet Profile Picture by Ronald Huereca/Metronet Norge AS.
If you are translator, you can translate it to your language and send translations. Currently, only Serbian translation is available.
Nav Menu Images is released under the terms of GNU General Public License. It is completely free so if you find it useful you can give something back to author. Your help could be done by giving donation, translating plugin to your language, sending bugs and suggestions, promoting plugin in blogs, forums social networks, and other websites.
I have error in menu- “Missing argument 3 for Nav_Menu_Images::register_menu_item_filter() (path to my page) on line 195” what did I do wrong? This error occurs immediately after loading the plugin
What version of WordPress are you using? This shouldn’t happen.
Wordpress 3.4.2
I can’t reproduce this and don’t see a reason for it.
I have the exact same issue as shoy
“Missing argument 3 for Nav_Menu_Images::register_menu_item_filter() (path to my page) on line 195″
http://www.digitalbla.com/Teste/LeoDale
@shoy, @DigitalBlá
Can you, please, try this version, and if still doesn’t works, try this one too and tell me what happens?
You can do this fast by deleting plugin then choosing option to upload plugin, not searching for it.
Same kind of problem, but a bit awkward:
On http://www.larmit.nl/caresse I get:
PHP Warning: Missing argument 2 for Nav_Menu_Images_Admin::_wp_post_thumbnail_html() in E:\larmit.nl\wwwroot\caresse\wp-content\plugins\nav-menu-images\inc\admin.php on line 131
On http://www.caresseboxsprings.nl it works fine! (this site is not visible yet.)
Exactly the same sites, both with WordPress 3.4.2
Hi, just overwritten the plugin with the first version (‘Can you, please, try this version…’ ) with ftp. Seems to work ok now!
Tnx, Henk
Hm, it’s the 1.0 version again. Only difference between my two sites is that I have got the All-in-one-seo-plugin installed at the site with 2.0.
Grtz Henk
Can you please look and tell me are there any differences in PHP versions on servers those two sites are using?
Sorry for the delay, had to put a website online.
The info (I hope it’s usefull):
Server with NavMenuImages 1.0, WP 3.4.2
MySQL
• Server: Localhost via UNIX socket
• Server version: 5.0.77
• Protocol version: 10
• User: ***
• MySQL charset: UTF-8 Unicode (utf8)
Web server
• Apache/2.2.3 (CentOS)
• MySQL client version: 5.0.77
• PHP extension: mysql
phpMyAdmin
• Version information: 3.4.8,
Server with NavMenuImages 2.0, WP 3.4.2
Database server
• Server: Localhost via UNIX socket
• Software: MySQL
• Software version: 5.5.25-log – Source distribution
• Protocol version: 10
• User: ***
• Server charset: UTF-8 Unicode (utf8)
Web server
• Apache/2
• Database client version: libmysql – 5.5.25
• PHP extension: mysqli Documentation
phpMyAdmin
• Version information: 3.5.1
Grtz Henk
Would it show the image and description text… like text under the image?
If not it would be great to have an option to show image and text together..
great work!
Pozdrav!
Only image will be shown. If you want to show anything different, you need to use
nmi_menu_item_content
filter.Checkout the tutorial I wrote in the meantime.
Turn off automatic swapping of title for image in functions.php:
add_filter('nmi_filter_menu_item_content','__return_false');
OR — have image appear BEFORE text in functions.php:
… and then you can use CSS to disable images on all menus, except those you want…
In my case, the same menu appeared in the sidebar and did not NEED images there.
Hi, thanks for this great plugin.
I try to let the text below or above the images related to the titles by adding this code in functions.php, but I can’t… I use the basic theme Twenty Eleven, do you have any idea?
Thanks for your answers…
Juliette, checkout the tutorial I wrote in the meantime.
An idea for you. I don’t know if it’s easy, but can you modify this plugin allowing to upload two pictur for every page: the first one for the menu and the second one for the menu in modality OVER???
What is “modality over”?
He means ‘hover’. I have the same request: can you add an upload for a hover image, please.
Thank you 🙂
So that you have two images uploaded or that uploaded image is only used for hovers?
Hi Milan,
Thanks for the great plugin, it works fantastic! I was wondering if there is some news on the hover topic. To answer your last question here: a second image that only appears when hoovered upon the menu item would be a great add!
Cheers,
Bernard.
I’ve released version 3.0 that adds support for hover and active images.
neat plugin. shame I’ve no idea how to add the page title with the
nmi_menu_item_content
filter 🙁I actually plan to write such tutorial, but if you’re into development, you can learn how to use filters in WordPress in general.
cool thanks man. I dove in the deep end and managed to get it working with this:
function nmi_with_title($content) { // Your custom code goes here, between the curly braces return $content . '<span class="page-title">' . get_the_title($item_id) . '</span>'; } add_filter('nmi_menu_item_content','nmi_with_title');
actually this is wrong. doh. back to the drawing board
Nigel, checkout the tutorial I wrote in the meantime.
Okay guys I want the image to display before my text in my menu how can i do that I don’t really want to mess with functions.php but if i have to which functions.php are we talking about. are we talking about the one in child theme? and also for something like this how would the css code look like if I may ask I am a beginner trying to learn. please help.
Ramin, the first question is partly answered in the tutorial I wrote in the meantime.
About functions.php, you need to learn how to create and save custom code you make for WordPress. If you’ve built your own custom theme (child or not), it might be a good idea to put your custom code like this into that theme’s function.php file.
Otherwise, you should create a custom plugin for you site, from scratch or by help.
I have social media icons in the header inline. When you reach the homepage on a mobile device you select pages from a popup with radio buttons. However, for the 3 links that are icons/images the radio buttons are present but have no label:
http://www.optometricinsights.com
Again, this is on mobile device only. Same scenario for FF, Android default browser and Opera.
Thanks in advance for any help!
This is happening because responsive design uses those same labels that are visible for regular browsers and since you are using images for socials and no text, there is nothing to be shown. So you need to either use custom filters to display/hide labels of socials, or you need to hide them completely for mobiles.
In either way, this is completely unrelated issue to regular plugin usage and doesn’t cover free support, I’m giving you this detailed answer just because I like how you use my plugin. 😉
Thank you Milan. I appreciate the information.
Hi Milan and thanks for the plugin.
I’m using it on an Artisteer generated theme and, unfortunately, there is a big issue: images won’t show.
I first used the plugin via WordPress INSTALL NOW page – no results and main menu is missing from screen; then I tried the nav-menu-images-1.zip, again no results and missing main menu.
Then I tried nav-menu-images-2.zip: this time menu appears as planned, but no images, only the original text link.
Do you think this could be something somehow related to Artisteer?
Stefano
I don’t understand, does menu appears/disappears in admin section under Appearance, or on the front end of the site? Have you uploaded images through this plugin?
Error “You need to set an image as a featured image to be able to use it as an menu item image”
?? Help me
You haven’t read the tutorial, you need to set uploaded image as featured image in order to use it by this plugin.
Nav Menu Images. Great. Awesome. No other plugin like it.
But, it does not work with the “Better WP Security” plugin which changes the path of the wp-content folder for security reasons. The path to the uploaded image will generate a 404 error. It may not work in a Multi-Site installation either?
As far as I can see, all old uploads won’t work after you change path in Better WP Security, not just for this plugin, so this is not my plugin’s issue. If you update your database with new path it should work, and also new uploads should work immediately.
As for multisite, it should work.
Yes, you are right. The problem seems to have been my write permissions on my .htaccess file. I had them set at 444. But, when I changed them to 644 everything seemed to work for me.
Thanks for the reply.
I have the similar problem with “You need to set an image as a featured image to be able to use it as an menu item image”. could you please tell me how to change images to featured image. i have read your tutorial, but i still couldn’t get it changed to a featured image. thanks.
HI Milan,
I have checked it again. normally there should be an option as “use as featured image” but there was this option next to the “insert into post”. Is there any other way to set the upload picture to feature image? I use PNG format.
Thanks
Edward
With version 2.0 this button is more prominent.
Hey,
thanks for you great plugin!
I would like to display a different image when you are on a particular page (so if you click on “Home” for example, it should be highlighted or underlined) – so you can see what page you are currently on.
Example: http://jakobgasteiger.com
Is this possible?
regards
Mat
This can be done two ways depending what you want to achieve: using CSS (active menu item has class
current-menu-item
that you can use to customize it) or with very custom solution that would output different image.Thanks for the plugin. Just wondering how to customize the position of the icon on the menu. I need to move the image up. I figure it has to do with the css but an example would be appreciate…or if I can simply edit one of the plugin php files.
Thanks again
I created a custom css class with the following and it worked.
.menu li.ICON {
position:relative;
top:-25px;
}
Hello
great plugin
My question is with file should i change to integrate it in my theme instead of using it as a plugin ??
thanks and great plugin agian
You mean to pack this plugin with your theme? If you are already releasing WordPress themes you should know how to include other libraries with it.
Be careful with naming convention so that theme and plugin don’t block one another. Also please share your work.
Hi, great work with this plugin but I’ve got a problem.. everything was working fine while I was creating my custom menu, the “upload image” button was showing with no problems but suddenly when I created the third button, the field “upload menu item page” vanished and never came back.. Do you have any issue?
Did link disappear from all menu items or only for newly added one? Have you saved you menu before trying to upload? After you add items to your menu, you need to save menu first before being able to upload images.
Thanks for your nice plugin.
I’m using wp 3.5.1 and Elegant Themes’ Lucid theme.
I installed your nice plugin but the upload image option isn’t showing up when expanding the menu item.
What could be wrong? I’ll donate 10 if you help me fix it.
Thanks!
Russ
Have you saved you menu before trying to upload? After you add items to your menu, you need to save menu first before being able to upload images.
I am having the same issue as the first commenter. I am getting this message
:Warning: Missing argument 3 for Nav_Menu_Images::register_menu_item_filter() in /home/content/j/a/b/jaboostudios/html/wordpress/wp-content/plugins/nav-menu-images/nav-menu-images.php on line 198
I want to have an image of the Like US on Facebook logo but this error message keeps coming up ?!?!?
PLEASE HELP I AM VERY CONFUSED
How can I allow the image to appear next to the name of the menu item?
I see this just replaces the name itself, but I’d like to be able to display the name as well as the image.
Is this in the php or css?
Please look over to developers guide.
I like your plugin, but for some reason when viewing the site in a mobile browser (iphone or android) not only the images disappear but there is not a label showing up either.
Can you suggest a solution/work around? has anyone else encountered this problem?
@Serge: This has to do with your CSS styles.
I would like my image to change to another image on hover/click, how do i go about that?
How do I upload two different images on one menu example (about us) so that when a person click/hover on the tab it changes to another image.
How do i activate the hover effect on the menu. how to upload to images to make them change when a tab is active
i have tried displaying both image and title but its not working, only the page title or image is displayed alone
I’ve released version 3.0 that adds support for hover and active images.
I’m getting 500 Internal server error after uploading a menu image. I tested this in my test blog and its using Swift theme. Please fix this issue.
I don’t see how is this issue related with this plugin, it obviously works for many, including me, and without any more information I can’t fix anything.
Hi Milan,
I am trying to use the new feature(hover and active) but when i select another picture to be used as the hover or active picture, it only shows the image i selected to use as hover/active.
Is extra coding needed to fully use the new feature or should it work instantly?
Greetings, Kasper
There shouldn’t be need for any extra coding, it should work out of the box. Have you by chance clicked on set featured image after you selected hover/active image? You should click that button only when you select default nav menu item image.
I am 80% sure the problem is another plugin i am using to show the title of the menu item(on hover). I did click “Set featured item” but have also tried without. I’ll try to test it out without the other plugin. thanks for the help
Using WordPress 3.5.1, a theme developed with Artisteer 4.1 and Nav Menu Images 3.0. I get the following error message in the menu widget of the vertical nav panel. The top nav panel renders as expected. All I have done is install and activate the plugin, I have not yet added any images.
Nav_Menu_Images::register_menu_item_filter() in /web/docroot/…………./htdocs/cc/wp-content/plugins/nav-menu-images/nav-menu-images.php on line 268.
(note I have removed the domain from the error message file path for security reasons).
This appears not to be an isolated case from reading this blog and the support area on the WordPress website. I don’t want to be editing core files to fix this, can you please sort the plugin.
Thanks
Since I have never reproduced error like this, I really can’t know what is a reason unless looking at place where this is happening.
Hello – I am having trouble like others with the hover function… sorry to be dense and thanks for the plugin which is just what I needed! I seem able to set an image but can’t see a hover option. I have downloaded version 3.0. Thanks for any help you can offer
Denise
You don’t see checkboxes for hover/active on a side like in screenshots above? I really can’t know what is a reason unless looking at place where this is happening.
Hi – no I really don’t see checkboxes for hover/active. I don’t have anything on the right under the box ‘Description’. I’m wondering if it’s because I’m on a PowerPC iMac – have you heard of any other people with a problem seeing the hover options? Thanks
Sorry for jumping in here but I might have the answer: which version of WordPress are you using? The active/hover checkbox shows in the new media uploader used by WP 3.5.x. The checkbox is at the right hand side of the uploader (becomes the media manager once the file is uploaded) when an image is selected (ticked); there is a vertical scrollbar on the right-hand-side of the screen, you will need to scroll it down.
Hi Milan, thank you for adding hover images. It’s a great enhancement. I am having difficulty using them, though, because the hover image selected for one menu item seems to be the one that shows on hover for all tabs in the menu. I’ve tried removing all images then reuploading and choosing them again…. but nothing seems to help.
I’m using WP 3.5.x and the Genesis theme framework with the Dynamik child theme.
Could you add separate upload buttons to the menu editor? I think that might make it easier (more intuitive) to set both the active and hover images for each menu tab.
Thank you, Milan. By the way, where’s your donate button?
Lee, there is a new version. If you still have issues, delete your old images and try again. You can donate here.
Hi there,
My site is using this plugin to control the main customer navigation and unfortunately the images are not showing in IE8 (Internet Explorer 8). Is there something I am missing that I need to do?
@Paul: Thats probably problem with your theme.
Hello
your plug-in very great, but only in responsive display (for iphone or android phone) the image don’t display?
i have the Eprom theme
if you have the solution, i keep!
Thank you
@creation: You need to fix your CSS styles. If you need help, I provide support.
Hi Milan,
I’ve just added two buttons using your plug in…and they are displaying vertically. Can you help on how to get them to go horizontally?
Many thanks,
Aries
http://s458388316.onlinehome.fr
@Aries: You need to change your CSS styles. If you need help, I provide support.
Hello,
I uploaded images with transparent backgrounds, but when using your plugin they always appear with a white background. How can I change this?
I’ve tried putting: background: transparent !important; in the CSS classes area but no luck. Very newbie, so if there is any easy fix, please tell me exactly what to put and where.
Thanks – once that’s fixed the plugin will be perfect!
This has nothing to do with this plugin, you need to either fix your CSS styles or your images.
Hello, I am also having trouble with the hover images for the Nav Menu Images plugin. I upload the images, I set one to featured, and I check the hover checkbox for another, but nothing happens once I save the menu. I am using WordPress 3.5.1.
@Matt: Please have a look at instructions to see how to add hover images. If there are still issues with old images (added before latest release), delete them and try again.
I installed this plugin a week or so ago and it was working perfectly up until today. I don’t know what changed. I don’t have any new plugins and I haven’t updated anything. As of today, I get an error that reads “Warning: Missing argument 3 for Nav_Menu_Images::register_menu_item_filter() in /homepages/28/d451937599/htdocs/app464104963/wp-content/plugins/nav-menu-images/nav-menu-images.php on line 268.” I looked at the PHP and found that line 268 is “public function register_menu_item_filter( $item_classes, $item, $args ) {” but I don’t know what that means (I have no experience with PHP).
I have tried downgrading to both your previous versions, but I still get the same error. Any other suggestions?
How do I add the hover images? I didnt see the option in the menu tabs. I am running the latest version of wordpress and pagelines.
@the1kane: Please have a look at instructions to see how to add hover images.
To fix the ‘Nav_Menu_Images::register_menu_item_filter()…’ issue:
-Locate the register_menu_item_filter method in nav-menu-images.php (line 268 at the time of this post).
-Set a default value for the $args parameter (ie $args = null).
public function register_menu_item_filter( $item_classes, $item, $args = null ) {
It seems only a select few people are having this issue and I’m not sure under what circumstances it occurs. The above seems to resolve the problem without any side effects. $args isn’t referenced in that function so setting it to null doesn’t break anything.
Hi Milan,
thank you for your plug in, but i’ve trouble with margin of menu image, i’d like to set margin-top = 0 px of the menu bar , i’ve no idea to edit in (nav-menu-images.php) or i’ve to edit in the theme setting?
thank you for your help.
Regards,
@Tubb: You need to put your custom styles in your stylesheet file, this has nothing to do with this plugin.
Hi Milan,
your plugin seems like the perfect solution for my problem! Thanks!
I’m working on a website based on an Artisteer generated theme. Everything works fine but the pictures are not showing up on menu. I’m also not seen the hover option box. Is there a way to fix this issue?
Thanks in advance
Rosane
@Rosane: Please have a look at instructions to see how to add hover images.
Problem with Artiseer theme might be that it doesn’t support menus the way this plugins needs.
Edit nav-menu-images.php
in function register_menu_item_filter comment out $args
public function register_menu_item_filter( $item_classes, $item /*, $args*/ )
no more
Missing argument 3 for Nav_Menu_Images
I’m having issues with the hover and active images. Even if I delete, upload or upload individually for each menu item, the hover and active images are changing to be the last image’s hover and active state that I just modified for a different menu item.
I’d really like to utilize this. I still have some modifications to make for the css.
Hope I can resolve this, otherwise, I’m moving out of WordPress because its so darn difficult to modify – especially compared to the WordPress versions from about 4 years ago.
When editin link in menu
1.Change menu item image
2.Set Hover image and Avtive image
3.Set Featured image
4.Save Menu
5.Edit next link in menu
When editin multiple links without saving menu, hover image will be the same for all links
I tried this but it still didn’t work for me. The last modified menu image’s state for hover is spread to all the other menu items…
View Source reveals that the hover_06 is spread to all other item’s hover:
<nav id="site-navigation" class="main-navigation" role="navigation"> <h3 class="menu-toggle">Menu</h3> <a class="assistive-text" href="#content" title="Skip to content">Skip to content</a> <div class="menu-2013-spring-container"><ul id="menu-2013-spring" class="nav-menu"><li id="menu-item-649" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-8 current_page_item menu-item-649"><a href="http://localhost/wordpress/"><img width="105" height="70" src="http://localhost/wordpress/wp-content/uploads/active_01.png" class="attachment-full wp-post-image" alt="Home" title="Home" /></a></li> <li id="menu-item-648" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-648"><a href="http://localhost/wordpress/about-us/"><img width="132" height="70" src="http://localhost/wordpress/wp-content/uploads/default_02.png" class="attachment-full wp-post-image" alt="About Us" title="About Us" onmouseover="this.src='http://localhost/wordpress/wp-content/uploads/hover_06.png'" onmouseout="this.src='http://localhost/wordpress/wp-content/uploads/default_02.png'" /></a></li> <li id="menu-item-643" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-643"><a href="http://localhost/wordpress/appointments-exams/"><img width="168" height="70" src="http://localhost/wordpress/wp-content/uploads/default_03.png" class="attachment-full wp-post-image" alt="Appointments & Exams" title="Appointments & Exams" onmouseover="this.src='http://localhost/wordpress/wp-content/uploads/hover_06.png'" onmouseout="this.src='http://localhost/wordpress/wp-content/uploads/default_03.png'" /></a></li> <li id="menu-item-644" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-644"><a href="http://localhost/wordpress/frames-and-contact-lenses/"><img width="125" height="70" src="http://localhost/wordpress/wp-content/uploads/default_04.png" class="attachment-full wp-post-image" alt="Frames & Lenses" title="Frames & Lenses" onmouseover="this.src='http://localhost/wordpress/wp-content/uploads/hover_06.png'" onmouseout="this.src='http://localhost/wordpress/wp-content/uploads/default_04.png'" /></a></li> <li id="menu-item-646" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-646"><a href="http://localhost/wordpress/technology-health/"><img width="169" height="70" src="http://localhost/wordpress/wp-content/uploads/default_05.png" class="attachment-full wp-post-image" alt="Technology & Health" title="Technology & Health" onmouseover="this.src='http://localhost/wordpress/wp-content/uploads/hover_06.png'" onmouseout="this.src='http://localhost/wordpress/wp-content/uploads/default_05.png'" /></a></li> <li id="menu-item-645" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-645"><a href="http://localhost/wordpress/news/"><img width="96" height="70" src="http://localhost/wordpress/wp-content/uploads/default_06.png" class="attachment-full wp-post-image" alt="News" title="News" onmouseover="this.src='http://localhost/wordpress/wp-content/uploads/hover_06.png'" onmouseout="this.src='http://localhost/wordpress/wp-content/uploads/default_06.png'" /></a></li> <li id="menu-item-647" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-647"><a href="http://localhost/wordpress/contact-map/"><img width="145" height="70" src="http://localhost/wordpress/wp-content/uploads/default_07.png" class="attachment-full wp-post-image" alt="Contact & Map" title="Contact & Map" onmouseover="this.src='http://localhost/wordpress/wp-content/uploads/hover_06.png'" onmouseout="this.src='http://localhost/wordpress/wp-content/uploads/default_07.png'" /></a></li> </ul></div> </nav> <!-- #site-navigation -->
That’s realy weird
Try this method
1.phpmyadmin>>wordpress_db>>wp_postmeta
search for _wp_attached_file and find all hover_06.png
my example
_wp_attached_file 2013/07/n150_n.png <- Normal / Active
_wp_attached_file 2013/07/n150_h.png <-Hover
change hover_06 to hover_01 ect
I only found one instance for the current hover image. So, knowing that I want different hover images for each menu item, I went and changed it to hover_01.php, and now all the menu items do have that hover_01.png versus hover_01, hover_02, hover_03, etc.
I thought my menu name could have affected it since the name began with a number – a no, no for wordpress – but that change didn’t help either.
So, I don’t know what’s up but it looks like I should code all the menu items individually with CSS.
Thank you for your time and efforts. I was looking forward to using your plugin so it would be easy to change the menu every season. Maybe next time.
Best Regards!!!!
Your welcome, but that’s not my plugin.
Paul, thank you for sharing your time with me. I really appreciate your efforts.
I figured my issue out!!! All I had to do was make sure all my images had the same height! I was making images that were larger for the hover, smaller for the active and smaller still for the default. I just put all my images on the same sized transparent background. Presto! Everything worked well.
So, the plugin is very good, does work and provides a great menu!
Thank you, Milan Dinić. I’m off to give your plugin a 5 star rating at WordPress.Org…
Hi,
I have a theme which has a mobile option, but when I use nav menu images they appear as blank. Is there a way to turn off nav menu images for certain resolution css themes?
Thanks,
Ben
I think you need to preload images for hover and add sprites support.
im useing something similiar to this
http://stackoverflow.com/questions/11381673/javascript-solution-to-detect-mobile-browser
to detect mobile browsers and change site from
http://mywordpressexamplesite.com
to
http://m.mywordpressexamplesite.com with custom theme and smaller images ( for navmenu example)
both sites use same db and something like this to switch themes.
Or you can use this
http://wordpress.org/plugins/wp-mobile-theme-switcher/screenshots/
Is your Nav Menu Images plugin WP 3.6 ready yet? Seems to me it is not. There are a lot of changes to WP Menus in 3.6.
I’ll try to update it as soon as possible.
Awesome, thanks!
I just upgraded to WordPress 3.6 – and all my nav-menu stuff has disappeared. Existing menus with images are okay, but the option to add new custom items has gone !! :[
~AS.
@Andrew, @Trout: I have updated this plugin, please update your installation and follow instructions that I’ve written. If there are still issues with old images (added before latest release), delete them and try again.
Other people have asked about the menu items not displaying on mobile devices, and I must say that your response that these questions don’t fall into the category of “free support” is unsatisfactory. You built a plugin that doesn’t work in mobile, straight up. And because it doesn’t work in mobile, I won’t be using it. I would imagine that other people will abandon it as well, given that mobile users account for a large portion of web users.
Becca, my plugin WORKS on mobile, it’s been verified that on standard themes there are no problems.
If there are problems with some themes on mobile, that doesn’t mean that my plugin doesn’t work, that probably means that either that theme is not standard compliant or that it has some features that prevent plugin to work as expected.
Until proven that issue is with my plugin, which should be made by explicitly naming a theme or website that doesn’t work, my stand is that issue isn’t with my plugin and doesn’t require free support.
Hey, man. Don’t fret the haters. We all know its a cool plugin.
I just want to know how the URL works… I was hoping that if I supplied it, that’s where you’d go when you click the image – but it seems I have to create page on my site for every menu item… I was hoping to avoid that. I’m using your cool plug-in toe display my client’s suppliers down the right hand side… so we don’t want a page for each on THIS site.
Am I doing something wrong ?
umm, I can’t get hover over images to work correctly. I set one but it appears for the other menu item as well. Is this the intended action ?
PLEASE see my request above…… I realy need to get the URL property working. Can you help please.
I am an experienced graphic designer who is fairly new at building web sites, trying to learn as I go. I try to design first, then figure out the technical part of building the site., so I don’t limit myself to only what I know how to do. In this case, I put an image-based menu in the middle of the page. Your plug-in seemed the perfect solution and I have been able to get it to do exactly what I wanted. However, I am having trouble getting the images to align in the navigation blocks. I am not sure if this is a theme issue (using Headway) or if there is some code I need to add to get it right.
Hi, I am using wordpress 4.5 and created a custom menu under the design options. But the link ‘Upload Menu Item Image’ doesn’t show up anywhere. The Plugin is activated and theres no error anywhere (not in the console, not in the frontend).
Is this plugin working for wp 4.5?
Best regards,
Tim
Tim, have you saved menu before looking for this link, as is noticed in instruction?
Yes I did. But I can’t see the point “Menu” in the “Appearance” Dropdown menu (only Themes, Customize and Editor) in the main backend view of wordpress. I can only create menus when clicking on “Appearance->Customize”.
I managed to have the Menu point in the Appearance Menu. Its because I am developing a custome theme. Therefore another question: which functions does the plugin need in order to work correctly?
Thanks and regards!
Ok it works now, it was just the menu registration in the function.php which was missing.
Hi
I would like to have both the images AND the text.
You mentioned the following solution :
OR — have image appear BEFORE text in functions.php:
add_filter( ‘nmi_menu_item_content’, ‘nmi_custom’);
function nmi_custom( $content) { return $content; }
I have added the code in functions.php of my child theme, but I see only the images.
Can you help me please?
Kind regards
Albert
Albert, you saw comment that is not mine. Check first code sample here and just swap places.
how can we edit width and height of the picture we upload?
Yucheng, it is imagined that it uses full width and height and that you make appropriate image before uploading. You might one to try WP’s built in image editor, but I have not tested this so I am unsure about results.
Sorry for the poor English.Suddenly Active and Hover the image does not change . Do you have any measures.
Try development version if this works for you: https://github.com/dimadin/nav-menu-images
Hi, apart from installing and activating the plugin, is there anything else I have to do? i am not getting the option to “upload menu item image”
When you activate plugin, you should have option to upload image to any saved menu item as described on this page. If you don’t have links there, you have a conflict with some other plugin or theme.
hi, thanks..turns out another plugin (ultimate member) is messing it up. is there a work around it?
I wasn’t aware of conflict with that plugin so I must look what is its nature.
Hello:
Thank you for creating the plugin!
I am having some problems getting it to work, however.
I added a custom menu item, entered the URL and a title, then saved. Went back in and was able to add an image and set it as featured. It doesn’t appear so I went back in and checked and it wasn’t there, even if I hovered. Removed the title which removed the entire menu item. Added it again a few times and make sure hover and active were both selected. Still can’t get it to work. What am I doing wrong?
I want the image to appear all the time – regardless of whether it’s active or hovered over or not.
The site is http://www.mpslakers.com. It should be appearing to the right of the last item labeled ‘Giving’.
Can you help please?
Thanks!
I understood that you see image in administration but not on frontend, public face of site. If so, there is some conflict with your theme (or maybe plugin, though I doubt that), it probably use some different way of showing menu. There is nothing I can do with my plugin in this situation, the only way is to look at theme code and to try to make a workaround.
I followed the installation process and saved the custom menu. However I am not see the ‘upload images’ link in the menu editor. Do you have a list of plugins that could be causing problems? Any other ideas?
I don’t have list of conflicting plugins but this is good idea. The only way you can solve this is by deactivating other plugins one by one to see which one causes. You can also upload your images when you find conflict if you don’t change your menu often.
Same Problem as the last comment.
The problem is what i have to write in the CSS field? If you can do it for me, because i am beginner 🙂 thanks
If you meant on Kristin’s comment, please see my reply there.
can you do it for me.. of course i will pay for the help
You can use my contact form for that types of inquiries.
hi! how is possible to define the image size? for me the images are too big.
Thank You
You can use built-in image editor in WordPress or you can edit it in external program and upload the size you need.
Tank you!
The Plugin “Nav Menu Images” appears to be abandoned (updated 11 September 2016, tested to WP 4.6.13).
🙁
Actually, this plugin works with newer WP versions as well. Reason I didn’t mark it as compatible is because for each plugin I manually verify with couple of test cases that it is indeed compatible. I plan to do that when time allows me.