display logo on mobile nav

Hello,

Yes, there is a way to display the logo …

@media screen and (max-width: 767px) {
.navigation-top .custom-logo-link {
display: block;
}
}

… which is used on this website.

You can add this into “Customizer – Additional CSS”.

However, it probably won’t do exactly what you want, I’d need to see your website in order to help you specifically with your site.

Oliver

Hey Oliver –

The site is not live yet so even if I share the site URL you will not be able to see the site. Is there another way for me to share this with you? i can provide a screenshot of the current state and the desired.

Thanks in advance!

Sorry, just picking this up again.

I’m afraid that without seeing the site and being able to inspect the HTML / CSS it’s a bit like feeling around in the dark.

Did you add the above CSS and did that show the logo on the mobile nav?

If so, just describe if there are any further design modifications you’d like and we’ll amend the CSS accordingly.

Oliver

Hi Oliver –

I did add that code. Unfortunately it did not result in my desired outcome.

By adding that line of CSS, it displayed the logo but it is only visible when you open the menu.

What I was looking for is the similar behavior that occurs if you have the logo aligned to the left/right on desktop view, then when it is reduced to mobile size (via desktop or by viewing on mobile directly) the logo is displayed in that top menu bar adjacent to the menu toggle logo.

I was able to add some screenshots to a Google Drive for you to see. Let me know if this makes sense.
https://drive.google.com/drive/folders/1PLiMSLr4Gj6wVapdZ23pnbXMt3g1Cxr4?usp=sharing

Thank you again for your continued assistance!

OK, that’s interesting, I’m going to try to re-create what you are seeing to try to work this out for you.

I’ll keep you posted.

Oliver

OK, I’ve looked into this now and I know what’s going on. So in order to show the logo in the middle (on large screens) the plugin injects the logo into the middle of the menu items.

So unfortunately, this is not going to work for smaller screens because it means the logo is not where it needs to be (in the structure of the nav) in order to be shown where you want it to be.

On the latest update we’ve added an option to show the logo on the mobile nav but it’s really only going to look right if it’s aligned to the left or the right as you have found.

Sorry this wasn’t better news.

Oliver