Introducing Solo Pine Mods | An affordable & reliable way to customize your theme

Okay
  Print

How to add a little logo image to menu


If you'd like to add a little logo image to your menu, we recommend installing & activating the plugin called Nav Menu Images. This plugin allows you to insert an image as a menu item within your top-bar navigation menu. We'll go through the steps below.


Menu Image Screenshot #1


After installing & activating the plugin, navigate to Appearance > Menus.
For a refresher on your primary menu, please refer to: How do I set up my navigation menu?

Select the "Links" or "Custom Links" drop-down menu on the left and enter whatever URL you'd like to have your image link to. For example, you could enter your site's URL to return the user to your homepage. If you'd like a title to appear next to the image, feel free to enter it within the "Link text" form. 

When you're finished, click "Add to Menu".
Drag and drop the new menu item to wherever you'd like it to display within your menu.
Click the "Save Menu" button. 


Menu Image Screenshot #2


Next, click the menu item to reveal its settings box.
The plugin has added a new option in the settings box titled "Upload menu item image". 

Click this "Upload menu item image" and choose your desired image. 

We've created a little image with a set height to best fit our top-bar and added it to our WordPress Media Library. Many of our themes have different top-bar heights, so you'll want to take this into consideration when creating your little image. 

I've noted the various top-bar heights below.  


Hemlock top-bar height: 48px
Florence top-bar height: 50px
Rosemary top-bar height: 51px
Redwood top-bar height: 50px
Oleander nav menu height: 55px
Sprout & Spoon nav menu height: 60px
Laurel nav menu height: 94px
Alder top-bar height: 54px 


Save changes to your menu when finished. 

You should be all set!

Please note: When your site is viewed on smaller devices, the top-bar menu is replaced with a mobile-menu. The menu image will be shown within this mobile menu and not beside it.