[Resolved] Navigation Logo not showing in responsive mode

[Harris]

Hello,
the navigation logo is not showing when menu goes in small screen mode.
Any help?

Thanks
Harris

[Leo]

Hi there,

Try uploading a mobile header logo: https://docs.generatepress.com/article/mobile-header/

Let me know if this helps.

[Harris]

Hello,
I am not using either header or mobile header.
Will it help?

Thanks
Harris

[Leo]

Sorry so you don’t want to use the header or mobile header?

Can you provide a link to your site?

[Harris]

Hello again,
It shows but things are aranged a bit strange.
Logo and search icon are in one line and menu in another (and aligned right)

Thanks
Harris

[Harris]

https://cryomykonos.com/cryo/

[Leo]

Have you tried using the mobile header option? https://docs.generatepress.com/article/mobile-header/

[Harris]

Yes. I did. And it looks as you can see it now.

[Leo]

Ahh Mobile Header logo is suppose to be a small image or an icon (like the C in CRYO).

If you want to use the normal logo then I would suggest to use the normal header on mobile.

So assuming this is the direction you’ve followed:
https://docs.generatepress.com/article/navigation-logo/#navigation-as-header

Change the CSS to

@media (max-width: 768px) {
    .site-header {
        display: none;
    }
}

Then upload a logo in customizer > Site Identity.

[Harris]

Now logo shows in normal mode above the navigation bar and the mobile mode is not fixed either.
By the way, the logo I uploaded in the mobile header is a 100px width logo. It’s not that big.
I think though that for some reason its resized.

[Leo]

Looks like you have this CSS added:

.mobile-header-navigation .mobile-header-logo img {
    height: 90px;
} 

[Harris]

It’s not added by me (via Simple CSS or otherwise).
This should be comming someware from the customizer settings.

[Leo]

Ah you are right sorry.

Try changing the menu item height for Mobile: https://docs.generatepress.com/article/menu-item-height-width/

[Harris]

I removed the media css you gave me and I left the mobile header logo. It looks better now.

Is there any way to enlarge (i.e. double or even more) the logo? There’s plenty of space there for that.

[Harris]

I increased the menu item height for mobile to 50 and it looks more decent now.
But isn’t there any way to increase the mobile header logo size without having to increase the menu item height?

[Author]

Posts