[Resolved] Query Loop

Home Forums Support [Resolved] Query Loop

Home Forums Support Query Loop

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #2355212
    Sebastian

    I have two concerns.

    Please have a look at the homepage of my website (link below). There is a query loop at the bottom showing the latest blog posts.

    I would like:

    1. that all boxes have the same height
    2. that the hyperlinks in the boxes are not underlined

    How can I do this?

    Thanks πŸ™‚

    #2355870
    Fernando
    Customer Support

    Hi Sebastian,

    Can you first add a class to the class list of the Grid Block inside the Query Loop Block?

    Then, set the Background color and the border radius to the Container Block holding the Image and the child container Block instead.

    We’ll then go from there.

    #2355906
    Sebastian

    Sorry, but why do I need background color for this`And border radius?

    #2355983
    Fernando
    Customer Support

    You’re current Loop has an Off-white/gray background and some border-radius. See: https://share.getcloudapp.com/bLu5qQ2Q

    It’s added through the child Container Block. Try adding it to the Parent Container so when we fix it, the background color reaches the bottom.

    #2356015
    Sebastian

    Ah, ok. I understand. Fixed it πŸ™‚

    What’s next?

    #2356042
    Fernando
    Customer Support

    Try adding this CSS in Appearance > Customize > Additional CSS:

    .gb-grid-wrapper.gb-grid-wrapper-2c3810fb.gb-query-loop-wrapper > .gb-grid-column > .gb-container > .gb-inside-container {
        height: 100%;
        display: flex;
        flex-direction: column;
    }
    
    .gb-grid-wrapper.gb-grid-wrapper-2c3810fb.gb-query-loop-wrapper > .gb-grid-column > .gb-container > .gb-inside-container > .gb-container {
        flex-grow: 1;
    }
    
    .gb-grid-wrapper.gb-grid-wrapper-2c3810fb.gb-query-loop-wrapper > .gb-grid-column > .gb-container > .gb-inside-container > .gb-container > .gb-inside-container {
        display: flex;
        flex-direction: column;
        height: 100%;
    }
    
    .gb-grid-wrapper.gb-grid-wrapper-2c3810fb.gb-query-loop-wrapper > .gb-grid-column > .gb-container > .gb-inside-container > .gb-container > .gb-inside-container > .gb-button-wrapper {
        margin-top: auto;
    }
    #2356069
    Sebastian

    Looks awesome!

    One little problem: I want to show 6 entries. Now there is no space between the first and second line…

    #2356079
    Fernando
    Customer Support

    There should be Gap settings in the Grid Block Settings within the Query Loop. Can you try that?

    Example: https://share.getcloudapp.com/p9uQkoRX

    #2356095
    Sebastian

    Thank you very much! Once again you have helped perfectly. I am happy as can be πŸ™‚

    #2356995
    Fernando
    Customer Support

    You’re welcome Sebastian! πŸ™‚

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.