[Support request] How to increase the width of the single page

[Paul]

Hi

how are you

how to increase the width of the single page?

pls check the screenshot shot about my issue https://prnt.sc/lqCgx7L0ER4B

pls guide, thanks

[David]

Hi there,

the width the page container is set in the Customizer > Layout > Container.
If you want to change that for a specific page ( or ALL Pages or Posts ) then you can use a Layout Element:

https://docs.generatepress.com/article/layout-element-overview/

1. In Appearance > Elements -> New –> Layout Element
2. On the Content tab set a new Width.
3. Set the Display Rules to where you want it applied.

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

[Paul]

Thanks for all helps

[David]

You’re welcome

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

[Paul]

Hi, Sorry to come back.

https://prnt.sc/83X9rlVoCbEH and https://prnt.sc/PFpJdaIlOTs5

Then update,

come back to check that page, and the width of the page stay same, where is problem? pls guide thanks

[David]

Aah.. ok. With the Layout Element you can only make the Container smaller then the size you have in the Customizer.

You would need to:

1. Set the Customizer > Layout > Container width to the larger size eg. 1500px
2. Use the Layout Element to set the width to the smaller size eg. 1200px
And set its Location to: Entire Site.
And set its Excludions for the pages you want to be wider.

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

[Paul]

hello david
thanks for your quick response.

1. Container Width is the default width of all Pages and all Posts and want to change this default withd of page from https://prnt.sc/srpzKmpTBf1C

2. generally speaking, What’s the bese or better width that fits the user’s point of view on the computer ?

Thanks

[Leo]

Would this CSS work?

body.page-id-874 .grid-container {
    max-width: 1600px;
}

2. generally speaking, What’s the bese or better width that fits the user’s point of view on the computer ?

I don’t think there is a correct answer for this question – everything is responsive and set with the max-width property.

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

[Paul]

hi，leo

thanks for your help.
why still use the CSS code?

1. Set the Customizer > Layout > Container width to the larger size eg. 1500px
2. Use the Layout Element

The options from David. they can not solve the issue of the width of customized post page or all pages perfectly?

[David]

Both options are perfectly valid options.

The one that Leo provided with CSS is good if you’re selecting only one or a few pages. For every page you want to apply the change to, you need to edit the CSS.

The method i proposed would be better if you wanted to apply the change to many pages. As you can edit Display Rules locations.

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

[Author]

Posts