Vantage premium – margins – I am trying to reduce the width of my text on the full width page. I added some code from another post I found on this site – #main {
padding-right: 35px !important;
padding-left: 35px !important;
}
I did make a few changes by slipping in <p style="margin-left: 50px;" but I know that is not the right way to do it and it doesn’t always work. so I tried your code and nothing happened.
margins
This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.
Hi Bremmer
Try the following under Appearance > Custom CSS:
.page-template-templatestemplate-full-php .entry-main { max-width: 760px; }To make this work though please change the page in question: http://www.hubbardnelson.org/climate from the Default page template to the Full Width page template.
Hope that helps.
Thank you so much for responding. I love Vantage and the premium option is great. Only I am new to WordPress so all of the html and css I am used to looks different and when I want to change things I am not always sure where to go. For instance I chose the boxed layout and didn’t want the wide gray but I now can’t find where you want me to change from default to full width except on the main page for everything. The problem with that is it messes with my home page design which is better served by the boxed layout. Sorry if this is one of those easy answers I should know – But where do I make that change?
No problem.
All you need to do with my code snippet is paste it into Appearance > Custom CSS and hit Save.
To change this page: http://www.hubbardnelson.org/climate from the Default page template to the Full Width Page page template, navigate to Pages, edit the Climate page, look down the right column and find the Page Template drop down menu, there you’ll see the Full Width page template, select that.
Wide Grey is a Page Builder row style. To select Wide Grey, edit a page, click on the Page Builder tab, on the far right of any row are three buttons, the second button is Visual Style, that’s where you select Wide Grey – for a row.
Hope this helps.
I will try that – I tried adding code where they Tiny MCE has written code – it worked to make my margins look perfect on the page – BUT on the small screen it is letter by letter. Opps – help!
It is the same url – http”//www.hubbardnelson.org – if you look at it on a phone you will see what I mean
Not quite with you there. Site looks fine on my phone. What code are you referring to?
Have you set the page template on the Climate page to Full Width?
That doesn’t show up on my page – on the right I have the update/ststus/visibility/revisions
What am I missing? Please…..
If you see the page as it is on the internet – it looks like I want it to – http://www.hubbardnelson.org/climate but adding to the code within Tiny MCE seems like maybe that means it won’t read on a small screen?
When I saw you code it seemed to set the page width. However I am looking to control the column and photo margins/padding
Thank you for your reply
Thank you for replying so quickly! Here is a sample of what I put in…. – I added that into the HTML so that each margin ended up sitting where I want it to be. If that is ok and means that it will still work. I would be fine doing just that. I have tried the child page idea but my skill level is not high enough to understand how to do it. I am sorry to say i can’t find the drop down menu on my climate page? At the beginning of the whole thing I set everything to boxed as I really like the way it looks.
I am now working on – -http://www.hubbardnelson.org/music – and am having the same issues with margins and padding. I would like everything to line up ….I could switch to using page builder only the inside margins were so wide between blocks – is there a way to control them? Some code perhaps?
Thank you for your help
Let me start right from the beginning.
The CSS snippet I provided must be inserted under Appearance > Custom CSS. There you’ll see a blank space. Insert it there and hit save. It shouldn’t be inserted anywhere else.
When you edit a page, if you’re not seeing the Page Template drop down menu in the right column then you need to click Screen Options top right and ensure Page Attributes is checked.
The CSS snippet I sent is specifically to reduce the width of the Full Width Page template. Your original request was to: I am trying to reduce the width of my text on the full width page.
The CSS snippet I sent won’t help in increasing padding for columns or images.
one more question: How can I have a side bar on one page and not the same side bar show up on all the pages?
If you elect to align an image to the left it gets assigned a class. If you insert the following under Appearance > Custom CSS you can adjust the margins being used:
.entry-content .alignleft { margin: 0 1.5em 1.5em 0; }The same goes for when you align an image right:
.entry-content .alignright { margin: 0 1.5em 1.5em 0; }Inserting both these selectors under Appearance > Custom CSS will allow you to customise the image padding being used for left and right align images. The margin property being used there has four values, they are in order, top, right, bottom, left. So for alignright you can see there 1.5em margin right and 1.5em margin bottom.
(ems is a unit of measurement. The base unit is 16px so 1.5em = 24px).
Let me know how you come along with this and we’ll take it from there.
Good question. For variable sidebars you have two plugin choices.
1. Install Jetpack and use the Widget Visibility module: http://jetpack.me/support/widget-visibility/
or
2. Use WooSidebars: http://www.woothemes.com/woosidebars/
thank you I shall try that. I redid a page with Page builder and the margins seems less of a problem – not sure why. Is there anyway to control the size of H1? It looks okay but I would like it to be bigger. I will try what you suggested now.
Thank you for your patience!
For sure.
Your page title h1’s can be controlled from Appearance > Customize > Fonts: Page Title Size and Page Title Color.
Hope that helps.