[Resolved] Adjusting Logo Size

[Howard]

Hi Tom,

Just upgraded to premium and i’m really liking the theme. I’ve got a slight problem with my logo i’m trying to fix.

My previous theme had a slider to control the logo height/size. Can i do something similar with GP?

I want to have a double sized logo for retina displays. My optimized png is 11kb 1132×248, so normal display is around 600px. If i upload the fullsize logo as is it’s way too big. If i crop the logo and resize it looks ok, but i lose the size for retina displays.

Is there a way to set the logo in the header area so it will look good on all devices at the size i want?

example logo at top of post:

https://www.celebrityhealthcritic.com/test-post-1/

Thanks

Marty

[Howard]

Think i fixed it for desktop using:

.site-logo {
width: 50%;
height: auto;
}

Will try to adjust accordingly using media queries for mobile devices.

Is this an acceptable workaround?

[Tom]

Absolutely!

I find setting the actual width and height works best, but if using a percentage works for you then that’s awesome.

Here’s an example: https://generatepress.com/forums/topic/retina-logo-e-button-creation/#post-228348

[Howard]

Thanks

[Tom]

No problem 🙂

[Josh]

Is there a way to use

.site-logo {
width: 50%;
height: auto;
}

to adjust the size of the navigation logo?

[Leo]

Hi Josh,

Try it with:

.navigation-logo {
    width: 50%;
    height: auto;
}

[Author]

Posts