[Resolved] Set different query loop logic for desktop and mobile

Home Forums Support [Resolved] Set different query loop logic for desktop and mobile

Home Forums Support Set different query loop logic for desktop and mobile

  • This topic has 4 replies, 2 voices, and was last updated 1 month ago by David.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #2271663
    Dmitrii

    I’m using GenerateBlocks to display posts from different categories on my homepage, but I want to set different query loop logic depending on what device a user is on.

    On desktop, I want a user to see 4 posts in a row (from a specific category).
    On mobile, I want a user to see 3 posts in a row (from the same category).

    I’ve tried switching to mobile mode but it seems the query loop function applies to all device types.

    Any suggestions or workarounds?

    Thanks!

    #2271668
    Dmitrii

    The only solution that came to mind was to build everything separately for desktop/tablet/mobile and just hide the containers depending on the device type.

    But not sure if there’s an easier way…

    #2271689
    David
    Staff
    Customer Support

    Hi there,

    the Query Loop has the same behaviour as GB Grid Block, you can set the grid item Container and set its % width to what you require. eg. 25% ( 4 columns ) Desktop and 33% ( 3 columns ) mobile:

    2022-07-03_12-37-54

    What you cannot do is change the Query loop parameters for different device sizes.

    If you want a query loop that shows only 4 posts on Desktop and only 3 on mobile then you would need multiple query loops

    #2275596
    Dmitrii

    Multiple query loops worked perfectly, thanks.

    #2275859
    David
    Staff
    Customer Support

    Glad to hear that works for you

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