How to display a different Logo Image for the mobile menu.

[Marc]

When the screen shrinks down and displays the mobile menu, our current logo is too large, and we would like to cut off the tag line. Is there a way to upload two images. One of the logo for standard viewing, and a smaller version for the mobile menu?

Cheers,

Marc

[Rui Guerreiro – SUPPORT]

Hi,

Will forward to the Developer to check what can be done.

Thanks.
-Rui

[Swift Ideas – Ed]

Hi Marc,

Not possible as standard, but something you could do with custom css if you have the knowledge.

We’ll see what we can do about adding an option in an update.

– Ed

[renata_lampert]

I am also interesting on this update as the mobile version of my website looks quiet “poor”because of the big logo!

[Kyle – SUPPORT]

Ok no problem, will hopefully get this included

– Kyle

[Swift Ideas – Ed]

@renata_lampert – we can provide custom css to resize the image size on mobile, just provide a link to your site 🙂

– Ed

[hgregorio]

Hi,

is there any workaround for displaying a different logo on mobile headers?

[Swift Ideas – Ed]

Could be possible with some custom css, not possible as standard. It would be a bigger customisation than we can provide via support, but we may provide the option to do so within the theme options in the future.

– Ed

[Levelbreak]

Hi,

I am also interested in this.
I have a logo that is 675px x 150px, logo1.jpg
When the screen size is below 675px, OR in mobile version, I want it to show logo2.jpg that is 119px x 150px

I just don’t understand this new thing with @media, if that has to do anything with this.

Thanks in advance!

[Swift Ideas – Ed]

You can use the following media query to override the css only for displays 767px and less:

@media only screen and (max-width: 767px) {

}

There is where you would add the code to adjust the logo. Unfortunately we can’t provide support for this as it is a customisation outside the standard scope of the theme. We will consider the option for an update.

– Ed