Mobile logo best practice

Hi there,

There isn't a recommended size as it's all personal preference.

Try increasing the menu item height with the mobile toggle to increase the logo size:
https://docs.generatepress.com/article/menu-item-height-width/

If you want the logo to be above the mobile navigation, then turn off the mobile header option.

You can see the differences here:
https://docs.generatepress.com/article/mobile-header/

Thanks, but if I turn off the mobile header option, how do I use a different image for the mobile header and keep it above the navigation? Does that have to be done using a CSS @media selector?

Charles

Yeah you will need this solution here:
https://generatepress.com/forums/topic/top-of-mobile-header-not-visible/#post-1080672

Turning off the mobile image puts the desktop image in as default and that CSS doesn't replace it. Do I have to move the original image off stage?

Not quite sure if I understand the issue.

Can you implement the method above so I can see what's going on?

Let me know :)

I've turned off mobile image in the customizer as directed. If you check the site on mobile it is automatically using the same header image (above the menu) as desktop. I want a different image on the mobile version. In mobile only, how do I remove the desktop image and use my custom mobile image as a header graphic above the menu bar? I hope that explains it.

To use different logo images for desktop and mobile, you would need every step as I detailed in this post:
https://generatepress.com/forums/topic/top-of-mobile-header-not-visible/#post-1080672

I currently don't see the method implemented at all, can you make sure that every step is done?

Let me know if any of the steps are unclear.