Archived topic
I want a separate logo for mobile but NOT in the nav
5 replies · Started by Jim on April 29, 2021
I really searched and tried before asking.
This used to be easy simple CSS but I'm stumped.
I want a separate logo for mobile but NOT in the nav
Full size accross the screen. What do I need to know.
Jim
YALGP (Yet Another Genrate Presser)
Hi Jim,
Sorry, reading your topic I can't imagine how it's gonna be looking like on mobile.
Do you have a mockup to help us understand better?
And could you link us to the site in question, you can use the private info field.
I want the Logo to be like this
But with a different Header Graphic on Mobile
https://howesoundpharmacy.ca/
Hi there,
Can you provide us any mock-up image of how you want it to be laid out on desktop and on mobile?
If you look at the site
https://howesoundpharmacy.ca/
In mobile view
I want it to look EXACTLY how it looks now
I just want to use a DIFFERENT IMAGE
It used to be I just had to do a media query in CSS to switch it but I cannot seem to get it to work
Again I do not want the logo to go up into the nav bar
I just want to switch the image on small screens
This should be simple
Ah I see.
In that case, you should have Mobile Header enabled on Appearance > Customize > Layout > Header as shown here.
https://share.getcloudapp.com/xQubNP0w
We then change how it looks with CSS to match how you want it to look.
This way you can set a different logo for the mobile viewport.
Else, you'll have to do a custom script that changes the site logo's img src when on different viewport. And this kind of customization is outside of our scope of support.