How to create a page template with a different container width?

Hi there,

Have you looked at using the Page Builder Container section in the Layout Metabox?: https://docs.generatepress.com/article/page-builder-container/

That should allow you to set a full width content layout on specific pages while maintaining your container width elsewhere.

Let me know :)

Hi Tom,

Yes I did, but here I have three options:

- default, aka contained with padding for the container
- full width
- contained, aka container without padding

If I have a container of 600 px with a 20px of padding, there's no way to have a container larger than 640 px. So, I am considering changing the default container width with a class to add to every specific element of the page, build with sections.

Alternatively, and It seems even simpler, I should create a page template that make use of a body class to set the container to a larger widht, say 1000px.

Which is, in your opinion, the best alternative?
How can I put that in pratice?

Thanks in advance

You could use a custom field to add that body class.

For example:

add_filter( 'body_class', function( $classes ) {
    if ( is_singular() ) {
        $template = get_post_meta( get_the_ID(), 'your_custom_field_name', true );

        if ( $template ) {
            $classes[] = 'my-special-template';
        }
    }

    return $classes;
} );

Then you could use the .my-special-template class without needing to create a page template.

it's not perfectly clear to me how do you do.

so, I add a custom field to the page / post I want to have a different template, for example your_custom_field_name and value true

that way, the class my-special-template is added to the list of the body class?

then, how do I adjust the width of the post / page?

will this rule work?

my-special-template .grid-container {max-width:1000px}

to be honest, to have a page template that uses a different page width seems to me the simplest way to get there. could you point to a guide to create a custom page template for generatepress, so to evaluate which is the simplest way?

That's right, you'd do this:

body.my-special-template .site.grid-container {
    max-width:1000px;
}

Creating a page template just for a different content width is likely overkill, but if you need to you could copy the theme page.php template and then turn it into a page template in your child theme: https://developer.wordpress.org/themes/template-files-section/page-template-files/