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.

How can i make the site wider?

Resolved 12 replies theme theme-vantage

Gerald Ahlswede

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

Hey,

i´m working with the pro version. How can ich change the site-width? My target is 95% like here: https://www.babingtonhouse.co.uk/

Thanks for your help.

Gerald

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

Need fast email support? Get SiteOrigin Premium

Replies

Daniel Staff 10 years, 11 months ago
Hi Gerald
You could try as suggested in this guide:
Link: https://siteorigin.com/vantage-documentation/theme-settings/layout/
then add the following custom CSS via Appearance > Custom CSS
```
body.layout-full {
  padding: 30px !important
}
```
Cheers
Gerald Ahlswede 10 years, 11 months ago
Hola,
the full screen was and is activated like in your Description. I have the css code added (plus a semicolon to be safe), but nothing happens. The Theme is ignoring my Choice “full width”. Any other ideas?
best regards
Gerald
Andrew Misplon Staff 10 years, 11 months ago
Hey Gerald, give the following a try under Appearance > Custom CSS:
```
/* Vantage: Full width adjustment */
body.responsive.layout-full #page-wrapper header#masthead .full-container {
max-width: 95%;
}
```
Vantage Responsive Layout and Full Width Layout must be enabled under Appearance > Theme Settings.
Hope that helps.

Gerald Ahlswede 10 years, 11 months ago

Hey Andrew,
Thank you. The Nav changed wider, the main content is as the beginning a block. I have therefore expanded your code to the additives .content and #main, unfortunately without visible success.
Here is my custom.css:

.entry-content h1 {
 font-family: 'Francois One', sans-serif, cursive, Arial;  
  font-size: 100px;
  font-weight: 300;
  color: #fff;
  text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.75);
  -webkit-font-smoothing: antialiased;
  line-height: 100%;
  margin:0;
 }
.entry-content h2 {
  font-family: 'Signika Negative', sans-serif;
    font-size: 40px;
  color: #fff;
  text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.75);
  -webkit-font-smoothing: antialiased;
  line-height: 100%;
 }
.entry-content h3 {
  font-family: 'Signika Negative', sans-serif;  
  font-size: 30px;
color: #53301e;
  font-weight: 400;
  line-height: 110%;
}
.entry-content h4, .entry-content h5, .entry-content h6 {
    color: #fff;
    font-weight: 500;
    margin: 1em 0;
}
.main-navigation {
    font-size: 16px;
  font-family: 'Signika Negative', sans-serif;
  margin: 0 auto;
   }
.main-navigation.sticky {   
  background: rgba(255,255,255,0.8);
   }
.main-navigation a {
    font-weight: normal;
}
header#masthead.masthead-logo-in-menu .logo > img {
    max-height: 35px;
    width: auto;
  margin-right: 25px;
  }
/* Vantage: Full width adjustment */
body.responsive.layout-full #page-wrapper header#masthead .full-container {
max-width: 95% !important;
margin: 0 auto;
}
.layout-full #colophon {
    margin-bottom: 0;
    margin-top: 0;
    padding-bottom: 10px;
    padding-top: 0px;
}

The URL is http://einfachgeri.de

Thanks for your fast answers!

BR
Gerald

Daniel Staff 10 years, 11 months ago
Hi Gerald
That’s odd
Would it be possible for you to create a temporary admin account for us so we can log in and take a look? You can create the account with the following email address:
[email protected]
Just navigate to Users > Add New in your WordPress admin. Enter siteorigin for the username and [email protected] for the email address. Make sure you’ve selected Administrator for the role and enabled the “Send Password” field so we receive the details.
Once we’re finished taking a look, you can delete this account. We’ll let you know when to do that.
WordPress Private 10 years, 11 months ago
This is a private message.
Andrew Misplon Staff 10 years, 11 months ago
Sorry about that! It should have been:
```
/* Vantage: Full width adjustment */
body.responsive.layout-full #page-wrapper .full-container {
max-width: 95%;
}
```
My bad. Try removing the initial selector I sent for this and try the above.
Gerald Ahlswede 10 years, 11 months ago
Hey Andrew,
thanks for the code. It works better but: why is on the left/right side these big Gap? I´ve changed it to 98%, but nothing changed. Some ideas?
A funny note: the code that you sent me is changed each time. From
```
/ * Vantage: Full width adjustment * /
```
to
```
/ * Vantage: Full width adjustment / *
```
Andrew Misplon Staff 10 years, 11 months ago
Sorry about that, another mistake! I edited my earlier CSS when I last commented.
```
/* This is a correct CSS comment */
```
The incorrect comment ending would have caused problems below it in the CSS.
Andrew Misplon Staff 10 years, 11 months ago
The gap on either side is the padding from the main div. You can adjust it as follows:
```
#main {
padding: 35px 35px 35px 35px;
}
```
Each value represents a side, top, right, bottom, left.
Gerald Ahlswede 10 years, 11 months ago
Hey Andrew,
thanks for your help!
I´ve changed it to
```
#main {
padding: 17px 0;
}
```
and now is everything fine.
Have nice WE!
Andrew Misplon Staff 10 years, 11 months ago
Awesome, glad to hear that did the trick.
All the best :)

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