Home>Support>Header banner sizeing

Header banner sizeing

Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

I have vantage premium, I am trying to get my banner image to fit withing the heading padding I have selected, Tried all sizes and the image is always not within the height I desire.
And the width when 1080px does not seem to fit.
Heading padding 120
Masthead Background Image Layout:Cover
Layout Bound:Full Width

URL: http://elthamfestival.org.au/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 3 months ago Magus
    Hi, I Work Here

    Hi Aussiehedge.

    An alternative way would be to add the image as your Logo by going to Appearance->Theme Settings and then removing the Custom CSS you have added to make it a background image.

    You could then use this in Custom CSS to give it full width and height.

    /* Full header logo */
    
    header#masthead {
    padding: 0 !important;
    }
    
    header#masthead .hgroup {
    padding: 0 !important;
    max-width: 100% !important;
    }
    
    header#masthead .hgroup .logo img {
    width: 100%;
    }
    
    .main-navigation {
    margin: 0 !important;
    }
    
    body.responsive header#masthead .hgroup .support-text, body.responsive header#masthead .hgroup #header-sidebar {
    display: none !important;
    }
    

    Doing it this way should keep the logo responsive and make it clickable for home page redirection.

    Let us know how you get on

    Magus

  2. 10 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Hi Aussiehedge

    One of the challenges here is that Vantage is restricting the logo image to maximum 1080px wide so if we stretch it further than that it will land up looking a bit distorted.

    Another way to go might be to add your green as a masthead background color and then add your logo, without the stretch CSS.

  3. 10 years, 2 months ago aussiehedge

    Thanks for your assistance it has been great. The banner does look a little stretched at the moment we are going to work with the creator to see if we can make it look o,k. I did read an earlier post on how to fix the css only not being an export I was not sure if this could be undone if it did not work and thinking I had the premium package it would have been a bit easier. Anyway love the theme and grateful for the assistance.

  4. 10 years, 2 months ago Andrew Misplon
    Hi, I Work Here

    Thanks for the long wait. The logo function in Vantage ensures that the logo can’t be larger than 1080px wide. So unfortunately no matter what we do with CSS the logo will look stretched if we try display larger than 1080px wide.

    If you don’t mind your logo not being clickable then you could try adding it to Appearance > Customize > Theme Design > Page > Masthead Background Image. Right below that, set the image to tile. Finally, remove the logo from Appearance > Theme Settings > Logo.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More