- This topic has 5 replies, 2 voices, and was last updated 5 years, 2 months ago by Tom.
-
AuthorPosts
-
January 19, 2019 at 3:21 pm #786612Silvio
Hi,
I am interested in creating a website with:
– narrow container, say 600px
– special landing page with full width for images and contained wide width, say 1000px, for textI am wondering if I can use sections with a specific class for those sections I want to have a different container width.
Could you help telling how to define the specific class?
I mean, should I write some like
body .specificclass .grid-container {max-width:1000px}
Or
body .specificclass .grid-container {padding: 3% 10%}
Or, would it be better to use a specific page template? How to write it?
January 19, 2019 at 4:54 pm #786648TomLead DeveloperLead DeveloperHi 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 🙂
January 20, 2019 at 1:57 pm #787353SilvioHi Tom,
Yes I did, but here I have three options:
– default, aka contained with padding for the container
– full width
– contained, aka container without paddingIf 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
January 20, 2019 at 5:50 pm #787444TomLead DeveloperLead DeveloperYou 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.January 21, 2019 at 4:59 am #787736Silvioit’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?
January 21, 2019 at 9:23 am #788100TomLead DeveloperLead DeveloperThat’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/ -
AuthorPosts
- You must be logged in to reply to this topic.