[Resolved] Change order (photo and image) on mobile.

Home Forums Support [Resolved] Change order (photo and image) on mobile.

Home Forums Support Change order (photo and image) on mobile.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #2158686


    For the mobile version, Im trying to display the title h2 before the image.
    Desktop version: I use the grid system (2 columns). Left side is the image. Right side is h2 + Text + list.
    Since my second container have more than the h2, I can’t use the order value option.

    Is there any CSS that will work?

    Thanks a lot!

    Customer Support

    Hi Brian,

    Can you specify which part of the site do you want this applied on? Sharing a screenshot of the section with indicator would help a lot.

    I’ll inspect the site to check if perhaps it can actually be done with just CSS. 🙂

    If it’s the image and description within the GB Grid Block, you can change the order of things on mobile as shown here –

    You basically have to select the Container block within the Grid block and click on it’s “Mobile” tab.

    You should see an “Order” text field. This allows you to set what displays first.

    A wise man once said:
    "Have you cleared your cache?"


    Hi Elvin,

    Thanks for you quick answer.
    Here is a screenshot of the desktop view: https://share.getcloudapp.com/mXuYmLzW
    The section is on the home page.
    I only want to have the title on first position (and then the image). With the mobile order option, the order will also affect the headline and the rest of the container, which I don’t want.
    I looked for a CSS solution, tried a few things but nothing worked so far.

    Thanks again for you help!

    Customer Support

    Hi there,

    you can’t move blocks between grid columns – instead you need to:

    1. Above the Image Block add a duplicate of the H2 Headline.
    2. Now with your.2 x Headline blocks, select each one and in Advanced > Additional CSS Classes you can add the relevant GP hide-on-* classes see here:


    For example the new duplicate headline you could add:

    hide-on-desktop hide-on-tablet

    and on your original Headline add:



    Hi David!

    Thanks for you super quick answer! This is exactly what I was looking for, these built-in classes works very well.

    Have a good day!

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