[Resolved] How to create different site widths for pages and blog posts?

Home Forums Support [Resolved] How to create different site widths for pages and blog posts?

Home Forums Support How to create different site widths for pages and blog posts?

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #476080
    Cecilia

    Hi!
    First of all, thanks for a great theme and plugin!

    I’m trying to figure out how to create the design I want.
    I have looked through the documentation and forum but I have not found the answer.

    What I want to do is this:
    1.
    I want the default page width to be 1100px.
    Cuztomize > Layout > Container > Container width – check.
    https://docs.generatepress.com/article/container-width/

    When opening a blog post I would like the content to be 700px to increase readability.

    If I add 200px padding left and right for content, it affects the whole site, making my 1100px-site narrow down to 700px.
    https://docs.generatepress.com/article/content-padding/

    2.
    Also, I wonder if it’s possible to affect the blog archive page to show for example a signup form at the very top of the page. I tried the sections plugin but I didn’t manage to make it work. Perhaps it’s not possible due to standard functionality in WordPress?

    /Cecilia

    PS My site is under construction, so you will not be able to see it. Let me know if you need to, and I’ll let you in.

    #476237
    Leo
    Staff
    Customer Support
    #476245
    Cecilia

    Thanks!
    I don’t really “use” container/one container in that sense since I’m still playing around trying to figure things out, so I’m flexible. I’ve tried both. Is one to prefer over the other, considering what I want to do?

    Thanks for the links, I’ll check it out.

    /Cecilia

    #476432
    Cecilia

    I’ve looked into hooks but I don’t quite see how to do what I want.

    I would like single blog posts to have a container width of 700px.
    Other pages to be 850px.

    Content width is set to 850px.
    Content layout is set to separate containers.
    What can I add with hooks making the content width for posts to be max 700px?

    /Cecilia

    #476632
    Leo
    Staff
    Customer Support

    This CSS should work to make the single posts 700px in width:

    body.single .grid-container {
        max-width: 700px;
    }

    Hooks is for your second question to add the signup form as you labeled.

    #476743
    Cecilia

    Ah, ok. I see. Sorry for the mixup.
    Thank you!

    #477008
    Leo
    Staff
    Customer Support

    No problem!

    #791414
    Uwe

    Hey, I just tried this but, for some reason, it also changes the width of the menu to 700px which is something I don’t want.

    Do you know how I can fix this?

    #791534
    Leo
    Staff
    Customer Support

    Try this instead:

    body.single .site.grid-container {
        max-width: 700px;
    }
    #791684
    Uwe

    It worked, thanks!

    #791697
    Uwe

    Just one more question on this topic: How can I only apply the 700px width to posts that don’t have a sidebar?

    #791821
    David
    Staff
    Customer Support

    Hi there,

    update the CSS to this:

    body.single.no-sidebar .site.grid-container {
        max-width: 700px;
    }
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.