Hey there,
I am currently building my website with Vantage Premium, and I am really enjoying all the features and what appears to be a very powerful wordpress theme for somebody like me with absolutely NO expertise in coding or website building.
The home page is sort of coming together, but the home page slider is giving me a bit of grief. I have the meta slider plugin installed and have built a 3 slide slideshow for the homepage. Within the meta slider settings I have set it as a flex slider with dimensions of 700 px width and 300 px height, and I have uploaded 3 images, all of which are scaled at 700×300 px. As it stands, the images are dramatically cropped, and the slider is fully stretched right across the width of the homepage.
Here is the website homepage to give you a look: www.wordonthecurb.co.uk/wp (Still very much in the development stages-unfinished)
Now I believe that the vantage masthead is cutting into the meta slider, but I have edited the theme’s CSS to pad the masthead in order for it to have a greater height…in order for the tagline ‘Why not me?’ not to be cropped out of the masthead; here is the code:
header#masthead hgroup{
zoom:1;
position:relative;
padding-top:70px; /* CHANGED HEADER PADDING HERE */
padding-bottom:70px;
}
I have also put in some custom CSS to stop the masthead repeating, though I don’t see why that should be having any impact on the slider.
Is there any way of shifting the meta slider further down the page, so that the top is not being cut off? Additionally, is there a way of perhaps stopping the slider from stretching the whole way across? Perhaps pushing it in on the sides so that it’s contained within certain parameters?
Many thanks,
Jack
Hi Jack
Thanks for your support.
You can add header padding from Appearance > Customize > General: Header Padding so that Custom CSS shouldn’t be necessary. Just a heads up, from Vantage 2.2.2 hgroup needs to be changed to .hgroup in any Custom CSS. All I did there was add a period in front.
Please try the following under Appearance > Custom CSS:
/* Vantage Theme, remove max width/layer centering. Usage: Copy and paste this code into Appearance > Custom CSS or your own Custom CSS module. */ body.responsive.layout-full #page-wrapper .metaslider .full-container, .layout-full #page-wrapper .metaslider .full-container { max-width: none; }To remove the full-width aspect head to Appearance > Theme Settings > Home and un-check the slider stretch option.
Hope that helps.
Hey Andrew,
Thank you for the timely response…I completely forgot I had opted to stretch it.
I put the custom CSS above and it made no difference to the layout at all on the homepage. I haven’t updated to vantage 2.2.2 yet so that shouldn’t be a problem.
My main concern is with pushing the meta slider down the page, as I need my masthead to be padded by 70px at the top and bottom in order for the whole logo and title to fit in…is there a kind of custom CSS coding to push it down the page?
Many thanks
No problem. The CSS I sent through changes the way the slider crops images but not the overall page layout.
To push your logo down you can head to Appearance > Customize > General: Header Padding and increase the padding there.