[Support request] Container sections padding and full width sections

Home Forums Support [Support request] Container sections padding and full width sections

Home Forums Support Container sections padding and full width sections

Viewing 15 posts - 1 through 15 (of 17 total)
  • Author
    Posts
  • #656486
    Marcos

    Hi there.
    I’m working on the archive.php file in a child theme and can’t get padding applied to sections content (the content padding set in the customizer). I’m getting 0 padding.
    I’m adding the markup directly in archive.php wrapping content in two divs like so:

    <div class="generate-sections-container">
    <div class="grid-container grid-parent generate-sections-inside-container">
    CONTENT HERE
    </div>
    </div>

    Inspecting the code of my home page (which uses sections) I saw this is the way GP generates sections, so used the same markup to take advantage of the CSS applied to them.

    While on my home page I get the following inline CSS included automatically by GP:

    .generate-sections-inside-container {
    padding-left: 40px;
    padding-right: 40px;
    }

    On my archive.php I get 0 padding, .generate-sections-inside-container is not included in the inline CSS.

    A few days ago I was trying to get a full width section in my archive.php and realised that as the option ‘use sections’ is not active (can’t do that because archive.php is not represented by a page in the WP Admin), GP was not loading the CSS I needed for that, so I manually enqueued the following file in the archive page to get that working:
    gp-premium/sections/functions/css/style.min.css

    So my questions are:
    1- How can I get .generate-sections-inside-container with the padding set in the customizer on my archive.php?
    2- Is there a cleaner way to do what I did to get a full width section? i.e. is there a way to get sections functionality on templates as you can for pages created in the WP admin?

    Cheers!
    Marcos

    GeneratePress 2.1.4
    #656488
    Marcos

    oops, sorry I didn’t wrap the HTML markup in ‘code’ tags:

    <div class="generate-sections-container">
    <div class="grid-container grid-parent generate-sections-inside-container">
    CONTENT HERE
    </div>
    </div>
    #656672
    David
    Staff
    Customer Support

    Looks like you found the solution 🙂 Let me know if not

    #656686
    Marcos

    Hi David.
    No, I just ment that I forgot to wrap the HTML in my first comment in ‘code’ tags.
    Thanks.

    #656706
    David
    Staff
    Customer Support

    So just to be clear your archive page will have the standard container width but you want a full width section within that? If so where would the full width section sit and are you able to provide a link to that page?

    #656738
    Marcos

    As I said in my first comment I got the full-width section working.
    This is what I did:

    if( is_archive() ) {
                wp_enqueue_style('generate-sections-styles', site_url() . '/wp-content/plugins/gp-premium/sections/functions/css/style.min.css');
            }

    Regarding this matter I was just asking if there is a better way to get sections CSS included in archive.php.
    I’ve seen in the GP files that this CSS is conditionally included only if it detects that sections are being used (i.e. checked ‘Use Sections’ metabox on a specific page in the WP admin). But how do you get to load this CSS in archive.php? archive.php has no related page in the admin where I can check ‘Use Sections’…

    Apart from this, my problem is that I’m not getting the container padding (set in customizer) in archive.php. Why is the following CSS included automatically in my home page but not in archive.php?

    .generate-sections-inside-container {
    padding-left: 40px;
    padding-right: 40px;
    }

    Sorry, can’t provide a link.

    Thanks.

    #657060
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Adding Sections to archives won’t work, and forcing its markup on archives is likely over-complicating things a bit.

    What if you just did this?:

    .archive .site.container {
        max-width: 100%;
    }

    Let me know 🙂

    #657521
    Marcos

    Hi Tom.
    Thanks for your reply. I’ll try what you suggest for the full width section. I already got that working but this seems cleaner.

    What about not getting padding (set in the customizer) in the container on the archive page?
    Any ideas about that?

    As I mentioned, this CSS is included automatically by GP in my home page but not in my archives:

    .generate-sections-inside-container {
    padding-left: 40px;
    padding-right: 40px;
    }

    Cheers

    #658058
    Tom
    Lead Developer
    Lead Developer

    My solution above will use the padding set in the Customizer.

    That CSS will only be included if Sections are enabled on the page, which isn’t possible in archives.

    #658583
    Marcos

    I added the CSS you suggested but still no padding.

    Could it have anything to do with the fact that I’m wrapping content in two divs with section classes?:

    <div class="generate-sections-container">
    <div class="grid-container grid-parent generate-sections-inside-container">
    </div>
    </div>

    I now understand that this is useless as the sections CSS is not being loaded on archive pages…

    Which would be the correct HTML markup to manually create “section-like” blocks of content in archive pages?

    I have a test online now. If I paste a link here will it be visible to everyone or just admins?

    Thanks

    #658735
    David
    Staff
    Customer Support

    Hi there,

    you can edit your original post in the topic and use the Site URL field for privacy.

    #658791
    Marcos

    Thanks David, edited the post and included the URL.
    Any help would be very much appreciated.
    Cheers

    #659017
    Tom
    Lead Developer
    Lead Developer

    Is there a specific page I should be looking at? I’m not seeing any areas without padding currently?

    Let me know 🙂

    #660849
    Marcos

    Hi, for example the first section of text (just beneath the header) on the page I left in the URL has no padding. If you shrink the browser width, you’ll see how the text that begins with “¿Quieres viajar… ” has no padding, its completely against the left and right of the viewport.

    The same goes for any of the other sections on the page.

    Thanks

    #661344
    Tom
    Lead Developer
    Lead Developer

    That’s just because you’re using Sections markup on a page that doesn’t support Sections, which means the built in CSS isn’t printing.

    You can add some custom CSS like this:

    .archive .generate-sections-inside-container {
        padding-left: 40px;
        padding-right: 40px;
    }
Viewing 15 posts - 1 through 15 (of 17 total)
  • You must be logged in to reply to this topic.