Hi,
I’m developing a site using the vantage theme and I am using stretched hero images at the top of each page but the hero image covers the sidebar widgets. How do I uncover the widgets, do I add a margin to the sidebar?
Also I’ve tried reducing the marging between the menu and the page content by adding this css code:
.site-main {
padding-top: 0 !important;
}
It works great on full width page templates and the home page, but the standard page template still shows a margin. How do I make sure all pages have the same zero margin between the menu and the body?
Last question is about going pro:
I am currently developing the site on my own server and will move everything to the final server when done. I want to buy the pro version but can I buy a pro version of vantage and use it on the developing site first and then move the pro version to the final server?
Thanks in advance.
Hi Sam,
Unfortunately, you can’t. Full Width Stretched ignores all other elements by design. Basically here’s a quick run down of the row layout types:
Default – Standard theme width
Full Width – Full width of container
Full Width Stretched – Full Width of page
Does this make sense?
Regarding the spacing issue you’re experiencing; Based on your description of your pages, being a hero widget at the top of the page, this is a padding issue with the row. Please open the first row of the affected pages by clicking the wrench above the row and then head over to the row styles sidebar and open the Layout settings group. Set the padding to 0.
Regarding Premium. Yes. A Vantage premium license will entitle you to unlimited development sites but only one production site.
Hi Alex,
Thanks for the help but I’m afraid I still have some problems:
The issue I am having is that for pages set up with the standard page template (which allows a sidebar) there is a space between the menu bar and the top hero image, however if I change the page to the full width no title template or the page builder home page template the space between the hero image and the menu bar dissapears. Changing the padding doesn’t seem to change anything, the space remains. It seems that the code I used to get rid of the padding works for some page templates but not for all.
See: http://dscrdnt.com/stiposite/
What I want is all pages with a hero image on top that is flush with the menu bar, at the moment some pages (home) are flush but most pages using the standard template are not.
I am not sure I understand the unlimited development vs only one production site. I am developing online, not locally, but once the site is set up I’ll transfer the site to the final destination. So I am guessing that if I go pro now, I can’t move the premium license to another server, right?
Thanks,
Sam.
Hi Sam,
You can fix this with some custom CSS. If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Just add the following code.
.page .entry-header { margin-bottom: 0 !important; } .page .entry-title { margin-bottom: 20px; }You might also need to install the SiteOrigin CSS Editor.
Regarding premium, no – that’s not the correct. A development site isn’t limited to locally developed sites. A production site is as the name implies, a “live” (as in not in the development state) website. As such, you’re completely allowed to do what you’re suggesting you want to do as the site would be considered a development site until you complete the transfer.