Step by step instructions to Add a Logo to Additional's Optional Menu

Posted on January 10, 2017 by Nathan B. Weller in Divi Assets 28 Remarks
Step by step instructions to Add a Logo to Additional's Optional Menu
Blog/Divi Assets/How to Add a Logo to Additional's Optional Menu

Not very far in the past I made and offered our most memorable Free Additional Class Design Pack. The reaction was perfect thus I've started work on my next one: an Additional Classification Design for a video blog. During the time spent making it I understood that something I did on the demo site may be something the local area might likewise want to know how to do. Instructions to add a logo to Additional's optional menu (and conceal the essential menu through and through).
Idea and Motivation

hulu-motivation

I got the thought while searching for fascinating video sites to draw on for motivation. I truly enjoyed how the hulu site had a truly unpretentious, negligible menu at the highest point of their page and afterward got guests directly into their substance which is what everybody needs at any rate!

I immediately understood that with only a tad fiddling I could have a fundamentally the same as look on Extra. This is the way!
Setting up Your Plan Components

For this instructional exercise you will probably require a more modest variant of your logo. The aspects I have utilized in my model are 190px by 25px. You might try and decide to go more modest than that relying upon your logo and what it resembles at various scales.

Whenever you've made this rendition of your logo you will need to transfer it to your site so you have simple admittance to it later.
Instructions to Add a Logo to Additional's Optional Menu

The main thing you will believe that should do is conceal your essential menu. Explore in your WordPress administrator to Extra > Subject Choices and look down the overall tab until you get to the custom CSS board.

Reorder the accompanying css there:
01
02
03
04
05
06
07

#fundamental header {
show: none;
}

#fundamental header-covering {
show: none;
}

Click the green "Save Changes" button and revive the frontend of your site. On the off chance that your different settings are all actually set to default, your header will currently probable seem to be this.

extra-auxiliary menu-logo-previously

Then, go to Subject Customizer > Header and Route Settings > Header Components Settings and un-check the crate close to "show moving bar". Click the blue "Save and Distribute" button prior to leaving the Subject Customizer.

It's currently time to make your real menu by going to Appearance > Menus. To get everything rolling, click the blue connection text "make another menu".

Name the menu anything you would like and make certain to tick the actually look at box at the lower part of the screen under "Menu Settings" so this menu will be shown as the optional menu.

Presently you can populate your menu with every one of the connections you need to show there. In my model I have added every one of my classes there.

At long last, add a custom connection.

In the URL field just put the landing page area of your site. This will, all things considered, become your "home" button. Then, in the Route Name field place the accompanying line of HTML.
01

<span><img src="YOUR LOGO Picture LINK"></span>

Supplant the text "YOUR LOGO Picture Connection" with the connection to your logo picture document from the media library. Assuming you're uncertain how to get that connection, go to Media > Library and snap on your logo picture.

logo-picture interface

At the point when the Connection Subtleties modular springs up you will see the URL in the URL field. Duplicate it and glue it into the demonstrated space in the HTML code above.

At the point when your custom connection is finished, save your menu and invigorate the frontend of your site. You ought to now have a thin, negligible header with your logo set inside Additional's optional menu.

extra-optional menu-logo-last
What Other Additional Instructional exercises Would you say you are Keen on?

I realize that there are a lot of energetic Additional clients locally with a wide range of Additional particular instructional exercise and gift demands. This is your opportunity to ask and have them added to our substance creation line! Tell us in the remarks underneath what you'd like us to cover from here on out and I'd be glad to get it on paper and afterward review it in a future post.