[Resolved] Custom Header

[Tom]

Hi John,

Might be best to start new topics for stuff like this, just so the other users in here don’t get tons of emails.

Background images aren’t “responsive” by default, so images should be chosen that are ok to not fully display at all times. If you set the size to “Cover” in the options, it will help – but won’t be perfect. You can apply different images specific for mobile if you need:

@media (max-width: 768px) {
    .site-header {
        background-image: url( 'MOBILE IMAGE' );
    }
}

As for the text, you’re better off using the site title in “Customize > Site Identity”. That allows you to customize it using the GP settings (typography, colors etc..).

Hope this helps get you a little closer 🙂

[Ritesh]

Hello GP Team,

I am trying to design a custom header like attached image (ref-site.png or Please visit https://www.fabglassandmirror.com/). Kindly guide me to accomplish the same. Whatever i tried you can check attached image (my-site.png or please visit – 99lmsdesign.com)

[David]

Hi Ritesh, we will respond directly to your support topic.

[Author]

Posts