Add logo to top of off canvas panel

Hi Ian,

Can you provide a mockup image of how you want it to be laid out? To have a clearer idea for the CSS writeup (or PHP snippet if necessary)

Sure

Probably just add the logo down the bottom, like this.

There are multiple ways of doing this but they all involve the use of generate_after_slideout_navigation hook.

If you simply want to use the logo assigned on the customizer settings, try this PHP snippet:

add_action('generate_after_slideout_navigation', 'generate_construct_logo' );

Or if you want to design how the logo is laid out, you can create a Block Element, add your logo image on an image block, design your layout, and then hook the Block element to generate_after_slideout_navigation.

I added this snippet

If you simply want to use the logo assigned on the customizer settings, try this PHP snippet:

Checked the off canvas menu and I can't see it yet.

Do I have to assign in somehow in the customiser?

It's actually there, we just need to fix it with CSS.

Try this:

nav#generate-slideout-menu .site-logo{
    display: block !important;
}

nav#generate-slideout-menu .site-logo img {
    width: 100%;
    height: auto;
}

Excellent, thanks.

So is there any way of changing its size? It's really small. Or do I have to use the other method of creating a block to do that?

Hi there,

change Elvins CSS for this:

nav#generate-slideout-menu .site-logo {
    display: block !important;
    padding: 10px;
}

nav#generate-slideout-menu .site-logo img {
    width: 250px;
    height: auto;
}

It adds some padding, and you set an explicit width to the img

Thanks David

You're welcome

I have the same problem. But i want the logo before the Navigation.
?

Hi there,

try using this PHP Snippet:

add_action('generate_before_slideout_navigation', 'generate_construct_logo' );

Or if you want to design how the logo is laid out, you can create a Block Element, add your logo image on an image block, design your layout, and then hook the Block element to generate_after_slideout_navigation.

I'm trying the same - adding a logo (as home button) to the off canvas menu. An Element seems to be the easiest way to me (unless you would say it slows the page more then another solution).
So i tried to create an element, block type with hook, added a gb container with background image and show on whole page.
The "generate_after_slideout_navigation" hook doesnt seem to exist though. "after_slideout_navigation" is there - but so far i couldnt get this to show my element.

Has this solution changed?