This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Vantage Theme Home Slider Widescreen problem

11 years ago · Last reply by Andrew Misplon 11 years ago

Hi there, firstly I’d like to say I love your page builder plug in, and am also enjoying using the vantage theme.
My one issue is problem with how the metaslider shows images on a widescreen…

I am using the free metaslider plug in, and have resized my images in photoshop to 1080 by 420. They look good on my 13 inch laptop and my mobile phone but on my wider screen desktop computer the images get cropped so don’t show fully.
I’ve tried various things, including disabling the image crop in the advanced meta slider settings, using default instead of vantage flex, using the code I found in another thread…

body.responsive.layout-full #page-wrapper .metaslider .full-container,
.layout-full #page-wrapper .metaslider .full-container {
max-width: none;
}

Whilst that improved the image it meant the slider images take up the whole screen and you can’t see the vantage headline etc unless you know to scroll down. I don’t know a lot about coding….
If I can I would love the home page to look as it is now, but be able to see the images without the cropping on a widescreen.. I hope this makes sense :)

URL: http://www.thewoodenshedco.co.nz

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

3
  1. Andrew Misplon Staff 11 years, 13 days ago

    Hi k600

    Thanks for your support.

    As you’ve hinted above, there isn’t really a solution here. You can either have the slider at fixed height by removing the Custom CSS snippet you added. Unfortunately to do this some of your image is cut off. Alternatively, by adding that Custom CSS snippet in, you remove the max-height constraint, and your image will display without any cropping. 100% width is hard to get right. Another option would be to redo your images at 1905px and remove the Custom CSS. That would take care of the 23″ monitor I’m on now.

  2. k600 11 years, 13 days ago

    Hi, Thanks for your quick response.

    I have ended up not stretching the slider, but changing the slider background colour after finding some code in another thread to match the page background. All in all I am happy with how that looks.

    Thanks again
    Katrina

  3. Andrew Misplon Staff 11 years, 12 days ago

    Super, glad to hear you made some progress there.

    If anyone else is looking for that, you can set the Meta Slider background color by inserting the following under Appearance > Custom CSS (Vantage Premium):

    /* Meta Slider Background Color */
    #main-slider {
    background: #fff;
    }

    Edit #fff as required.

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.

Have a different question or issue?

Start New Thread