Shape 5

When scrolling down, I'd like the logo to automatically resize to fit completely in the menu. I thought there was a logo_small suffix but that doesn't seem to work. Can anyone help me with this auto resize code?

Hello,

There's nothing that will make the logo resize only on scroll, do you mean when you scale the window down in width instead? Please also provide a url to your site.

http://109.199.102.38/~sunrisemanor

Thanks

Hello,

Your logo is very tall, the template won't be default change that. Adding the following to custom.css would resize it though:

#s5_menu_wrap.s5_wrap #s5_logo_wrap, #s5_menu_wrap.s5_wrap_fmfullwidth #s5_logo_wrap {
max-width:86px !important;
margin:0px !important;
}

Where would we add that code?

Hello,

You would add it to custom.css in the template's css folder.

Instead of scaling, is there a way to add a different logo, or show only a certain area of the logo? The logo I'm stuck with is very blocky, so when it is scaled, it is unreadable.

Also, it aligns to the top, rather than centered, can I use a tag to center it?

Hello,

Something like that would require custom programming, we don't provide those kinds of services as part of our support. You would basically need to create another logo div on the index.php file and hide/show each logo at specific screen widths with custom css media queries.

Mike:  where does the scroll height come from?  Couldn't that attribute be modified to accommodate larger logos?

Hello,

That's controlled in template.css under:

#s5_menu_wrap.s5_wrap #s5_menu_wrap2, #s5_menu_wrap.s5_wrap_fmfullwidth #s5_menu_wrap2

You could create custom css that shrinks the logo on scroll, but the request above was to replace it with entirely different logo.