Home>Support>Vantage theme different width with blog and pages

Vantage theme different width with blog and pages

By Petri Rahikkala, 10 years ago. Last reply by Andrew Misplon, 10 years ago.
Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

Hey

I have your premium Vantage and I love it so far. I have one issue. I have full width site everywhere but I want to use boxed layout for blog section. What should I put to custom CSS so that it affect only the blog?

I have currently following code in Custom CSS but that affects only specific entry, not the blog entry listing or blog main page if you can call it.

/* Single */

article.post .entry-header h1.entry-title, article.page .entry-header h1.entry-title {
text-align: center;
}

article.post .entry-header .entry-meta, article.page .entry-header .entry-meta {
text-align: center;
}

.single .entry-content p {
margin-right: auto;
margin-left: auto;
max-width: 540px;
}

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 11 months ago Andrew Misplon
    Hi, I Work Here

    Hi Petri

    Thanks for your positive feedback.

    There isn’t much that changes between full width and boxed in terms of the content area. Do you want to have a boxed header and footer on the blog as well?

  2. 10 years, 11 months ago Petri Rahikkala

    I want to use full width at the site but the blog portion is moved to it’s own section. If I change .entry-content with custom css it works fine BUT it narrows the elements like widget area etc.

    I don’t know if I made myself clear (non english speaker)

  3. 10 years, 11 months ago Andrew Misplon
    Hi, I Work Here

    Placing the following under Appearance >Custom CSS would be one way to do this:

    body.blog.layout-full {
max-width: 1080px;
margin: 0 auto;
}

body.single.layout-full {
max-width: 1080px;
margin: 0 auto;
}
  4. 10 years, 11 months ago Petri Rahikkala

    Thanks for the fix. This makes the boxed layout in blog section as whole, almost there =)

    I would like to keep the header, menu etc. as wide as the site is elsewhere but only the blog entry would be narrow.

  5. 10 years, 11 months ago Andrew Misplon
    Hi, I Work Here

    If you just want to restrict the center container you can try this:

    .blog #main .full-container {
	max-width: 960px !important;
}

.single #main .full-container {
	max-width: 960px !important;
}
  6. 10 years, 10 months ago Tara

    Hi Andrew, is there a way to make the blog posts 60% of the width of the screen and in the center of the screen? Right now I can do it with Page Builder but I lose the ability to edit formatting in the same way as with a standard blog post.

    Thanks

    • 10 years, 10 months ago Andrew Misplon
      Hi, I Work Here

      Hi Tara

      Assuming there is no sidebar that might look as follows:

      .single .site-content,
.blog .site-content,
.archive .site-content {
width: 600px;
margin: 0 auto;
}

      Please open a new support thread for any follow-ups. Thanks.

      https://siteorigin.com/new-thread/

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.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More