Change the background colour behind MetaSlider

  • baker_girl

    (@baker_girl)


    10 years, 6 months ago

    Hi,

    I want to change the site layout to full width but not stretch the home slider to fit. This is because it bumps up my image on large screens and makes some of the text over the image unreadable.

    If I unselect ‘stretch’ the metaSlider has a dark grey background color.

    I’ve tried to see about changing this in the themes css styles and also the metaSlider php but can’t see any reference of a background colour.

    I also tried changing the secondary menu in the customise settings but this didn’t do anything.

    Thanks for your help.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Greg Priday

    (@gpriday)

    10 years, 6 months ago

    You could do this with a little custom CSS.

    #main-slider {
   background-color: #333333;
}

    You can set any hex colour you like.

    I also noticed a bug with the centring of the main slider when it’s not stretched. It’s off to the left when it should be centered. The following CSS fixes it.

    #main-slider .metaslider {
    margin: 0 auto;
}

    I’ll fix this in the next update.

    You can add custom CSS either using Jetpack’s custom CSS feature or the one that comes with the Premium version of Vantage if you’re using that (Appearance > Custom CSS).

    If you need help with the customizer, can you please send a message to SiteOrigin support. This is a premium only feature so I can’t help you with that in the free forums.

    Thread Starter baker_girl

    (@baker_girl)

    10 years, 6 months ago

    Hi Greg,

    I actually was playing around with this while waiting for the support reply. I got the hex code of the colour I wanted to change and then searched for it in the style.css. I found it in the ‘body.layout-full’ class and changed it to #ffffff here.

    I’m not sure if this is advised to do and as far as I could tell it didn’t effect any other background colours?

    I too noticed the bug with the centring of the main image and used the above code to centre it. Although I omitted the #main-slider class.

    Thanks.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Change the background colour behind MetaSlider’ is closed to new replies.