[Resolved] How to make blog page width wider than actual posts?

Home Forums Support [Resolved] How to make blog page width wider than actual posts?

Home Forums Support How to make blog page width wider than actual posts?

  • This topic has 7 replies, 4 voices, and was last updated 6 years ago by Paul.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #438688
    Chris

    I have 400 padding left and right for the content of my single posts, set in Customizer for a nice reading column. (My site container width is 1500).

    But no matter what I set the Page Builder Container for the blog posts page to: (either Default, Full Width or Contained), my blog posts page still has padding (the narrow easy column width that my posts are).

    How do I make my posts page just act regularly? I have my posts displayed in 4 columns, and I want them to spread out not be small and bunched together.

    I seem to have had it work this way until a recent update took effect. I must be missing something obvious but I have tried for two days!

    thanks,
    Chris
    (I didn’t add my website url b/c its in maintenance mode)

    #438708
    Zesen

    Are you saying that you want the single post page has padding of 400px while keeping the post entries in archive pages unaffected? Maybe you could try putting this in your wp_head hook in Appearance -> GP Hook:

    
    <?php if ( is_archive() || is_home() ) : ?>
    <style>
    .separate-containers .inside-article {
        padding: 40px;
    }
    </style>
    <?php endif; ?>
    

    Untested.

    PS: not quite sure if setting such a large content padding in general is a good idea though.

    #438774
    Chris

    Thanks for the input but I don’t want to mess with css unless as a last resort.

    I basically can’t get my blog posts page (where I have my blog featured images and excerpts displayed on the dedicated blog page) to be full width.

    Ironically I can toggle each post page to be either full width or the DEFAULT (which makes it the narrow read style that is so attractive.. don’t know any other way to make this happen other than to increase padding 400 left and 400 right in the customizer/container width)

    All I want to do is have my individual posts have a wide margin on each side, but have the blog posts display in a 3 or 4 row column with no margin (or a very narrow one) on each side.

    PS: That content padding is only for the blog posts. I use Elementor for my sites regular pages.

    #438779
    Chris

    Zesen,

    The funny thing is that the Page Builder Container meta box toggle says, “both options (“Full Width” or “Contained”) remove the content padding for you”. But it isn’t working. It remains padded.If I want my blog posts display page to be wide, or wide enough, then I must take off that 400 left and 400 right padding off the basic global content width setting, but then my single blog posts are full across which is ugly and difficult to read.

    #438828
    Leo
    Staff
    Customer Support

    I think you are referring to the main blog page where all the posts are displayed?

    If so the metabox won’t work as WordPress ignores metabox values on all index pages (blog, archive etc).

    Try this CSS:

    body.blog .grid-container,
    body.archive .grid-container {
        max-width: 100%;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    #439021
    Chris

    Leo, thanks a lot. That did the trick. Now I know how to add CSS too! Piece of cake really- thanks to you now I’m expert (far from it). In any case you made it easy with the right info.

    Did GPP always need this CSS to do this? Somehow I remember it working without that a few months ago before the latest few WP updates.

    #439073
    Leo
    Staff
    Customer Support

    For a lot of elements on the main blog page yeah as all metabox are ignored by default.

    This hasn’t changed for sure.

    Let me know if there are other things you would like to change.

    #533193
    Paul

    Just wanted to add that the full-width option using 95% (instead of 100%) with a 3 column width makes for a highly impressive blog archive page. Here’s what our site http://www.sandandsteelfitness.com/blog looks like using this code.

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.