WP SITES

Log in

Add Logo In Menu of Magazine Pro Theme

—

by

Brad Dalton

The solution in this tutorial enables you to display your logo inline with your nav menu items like you see in the following screenshot :

  • Coded to display in the primary nav menu of the Magazine Pro child theme by StudioPress.
  • Your image is added using the Site Identity setting in the WordPress customizer which is the recommended method used to add your logo in WordPress & Genesis.
  • Displays perfectly inline with your nav menu items and doesn’t increase the default height of your menu.
  • Can be used with any other menu and also displayed to the right of the menu items.

Installation Steps

There’s 2 steps you need to take to get the job done.

  1. # Copy & paste the PHP code from the file named functions-1.php to the end of the Magazine Pro themes functions file.

    2.  
    Solution 1 Step 1

  2. # Copy & paste the CSS rules for solution 1 from the style-1.css file to the end of the Magazine Pro child themes style.css file and clear caching.

    3.  
    Solution 1 Step 2

Note : You may need to modify the CSS if you modify the values in the custom-logo function for the width & height of the logo.

Not Using Custom Logo – Solution 2

If you prefer not to use the custom logo and want to use a image from your child themes images folder, follow these steps :

  1. # Copy & paste the PHP code from the file named functions-2.php to the end of the Magazine Pro themes functions file and upload a image named logo.png to your child themes images folder.

    2.  
    Solution 2 Step 1

  2. # Copy & paste the CSS rules for solution 2 from the style-2.css file to the end of the Magazine Pro child themes style.css file and clear caching.

    3.  
    Solution 2 Step 2

Download Folder

Related Tutorials

Comments

2 responses to “Add Logo In Menu of Magazine Pro Theme”

  1. Alvaro Guevara Avatar
    Alvaro Guevara

    Not working on my site Brad. Added and removed, and added 3 times, to make sure.

    site: https://staging.samhughes.org/

    1. Brad Dalton Avatar
      Brad Dalton

      Just tested and it works fine. Which menu are you wanting to add the logo in? Primary or Secondary? Also, are you using the custom logo setting to add the menu in the header also?

      I also updated the tutorial to include code which enables you to use a image from your child themes images folder rather than the custom logo which is added using customize > site identity.

      You can send me FTP/cPanel access and i’ll install the code. By default, its coded to work with the primary menu.

Leave a Reply

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.