How To Add A Logo Image To Any Nav Menu

In this post, i’ll show you how to add a logo image to either your primary or secondary navigation menu.

You’ll also be able to float your logo to the left or right of your menu items.

On top of this, you can easily change the position your image sits in your menu.

logo menu genesis

Here’s the PHP & CSS code you need to add at the end of your child themes functions.php & style.css files.

PHP Code

Change the primary theme location to secondary if you want to add your logo in your secondary nav menu.

You’ll also need to upload your image to your media library in WordPress and change the url in the code to your own.

CSS Code

Change the float: left; declaration to float right to display your logo to the right of your nav menu items.

If your image is smaller than the height of the nav bar, you can center it by adding some margin-top:

.nav-logo {
float: left;
margin-right: 20px;
margin-top: 20px;
}

Works equally as well in the Twenty Twelve & Twenty Thirteen default themes for WordPress.

twenty thirteen theme logo nav menu

2012 image in menu

Using Logo From Images Folder

If you prefer to add your logo to your child themes images folder, you can use this code as another alternative:

Link Your Logo From Images Directory

You might also want to link your image which you can do by using this code as another alternative.

The advantage of using this code is that you can easily change the home_url to any other url template tag and even include a path relative to the home url.

Another Option

You can also use this code to add an image to any nav menu in any WordPress theme.

Note: You will also need to add the sample CSS included in this post which may need modifying depending on which theme you’re using.

Other Cool Stuff You Can Do With Your Logo

Register To Get Full Access & Support

Also get instant access to all premium content & downloads.

Members of WP Sites get:

  • Answers to questions relating to all PHP code & tutorials
  • Step by step instructions & support for installation of PHP code
  • One on one assistance given to you directly via email

$65 $27/month (Early bird rate for limited time)

1 Start Here: Enter Your Details
2 Submit PayPal Payment