Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #902770

    Grid row in combination with columns is a nice thing to have more layout options. But i don’t like it always to have the fullscreen mode for grid layout.

    i would like to have this f.e.
    click to enlarge

    and frontend is:

    so i gave to the grid alb element a class : grid-notfull

    with this class i can wrap the whole grid with a container via functions.php of child-theme:
    and to have the correct behavior of that surrounding container i do insert the css too:

    function grid_layout_notfull(){
    ?>
    <script>
    (function($){
    		$('.av-layout-grid-container.grid-notfull' ).wrap( '<div class="main_color notfullsize"></div>');
    		$('.notfullsize').css({"clear": "both", "width": "100%" , "float": "left" , "position": "static" , "min-height": "100px" });
    		$('.grid-notfull').css({"max-width": "1310px", "margin": "0 auto" , "padding": "0 20px"});
    })(jQuery);
    </script>
    <?php
    }
    add_action('wp_footer', 'grid_layout_notfull');

    1) the notfullsize class added to the surrounding container gets the same settings as avia-section and the class main_color to have the same background-color
    2) and the grid-notfullsize gets the setting of “container”

    you have to adjust the paddings and width to your enfold settings

    see here a working example: https://webers-testseite.de/weber/aaaa/

    #902774

    next trial will be to have it with sidebars – maybe this will work too …

    #904179

    Hi,

    Great tip, thank you very much once again for sharing it!

    Best regards,
    Basilis

    #1030059

    Hi. Just checking in to say thank you for this! I had exactly this problem with a site this morning that I had partially solved through CSS, but I could not address the background color issue. Your solution is perfect. Thanks for sharing.

    #1030125

    Sorry -for the missing example images and lost pages – but these tips are from January 18 – so test page is gone.
    And some image hosters i used on that time are lost in space :lol
    But i hope description is good enough to get the things to work

    These nested layout is a nice thing – that is the reason for code above
    PS the imagehoster changed to a different TLD from org to cc

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.