Page 1 of 1

Layout Grid Column Order.

Posted: Mon Apr 15, 2019 11:08 pm
by 44MLB
Example.

I have a layout grid with two columns. The left-hand column has text and the right-hand column has a photo. At the break point by default the text will be at the top. Is there any way to swap this to have the photo at the top.

Re: Layout Grid Column Order.

Posted: Tue Apr 16, 2019 1:15 am
by crispy68
Unfortunately no.

However, it can be achieved with flexgrid.

Re: Layout Grid Column Order.

Posted: Tue Apr 16, 2019 6:26 am
by 44MLB
I have kept away from Flex Grids as the don't work in older browsers. I presume Layout Grids do?

Re: Layout Grid Column Order.

Posted: Tue Apr 16, 2019 6:53 am
by Pablo
Correct, Layout grids do work with older browsers.

Re: Layout Grid Column Order.

Posted: Wed Apr 17, 2019 12:32 pm
by gofrank
There is an alternative that I have used that works.

Make a copy of the layout grid with text and photo. In the copy, swap the positions so the photo is in column 1 and the text in column 2. Then, hide the grid.

At the point where the design breaks, switch the original grid to hidden and display the second grid (with the photo in column 1).

While this does add to the page weight, it gives you the flexibility to achieve the design you want using layout grids.

Re: Layout Grid Column Order.

Posted: Wed Apr 17, 2019 12:56 pm
by 44MLB
Many thanks gofrank :-)

Re: Layout Grid Column Order.

Posted: Sat Apr 20, 2019 10:49 am
by Lasa
I like the option!
Lasa

Re: Layout Grid Column Order.

Posted: Thu Nov 30, 2023 9:49 pm
by Lasa
I wonder if this gofrank workaround is still needed... I've been using it for years does layergrid / flexbox option allow the change within the breakpoint?
(Default Layergrid to show two columns order 1 and 2, then at 480 show 2 and 1?) That way the order shows picture-text, picture-text at the breakpoint.
Cheers,
Lasa

Re: Layout Grid Column Order.

Posted: Thu Nov 30, 2023 10:45 pm
by alan_sh
There was some code I used ages ago to do this, but I can't remember what it was. I think I got it from Crispy.

I'll see if I can find it in the next day or so

Alan

Re: Layout Grid Column Order.

Posted: Thu Nov 30, 2023 11:37 pm
by Lasa
Thanks Alan. The GoFrank solution works for sure, not knocking it at all, but since Web Builder does everything else I wouldn't be surprised it its figure this out as well!

Lasa

Re: Layout Grid Column Order.

Posted: Fri Dec 01, 2023 12:14 am
by crispy68
Since version 16, this is now possible with layout grids. No need to add extra grids and hide them.

I created a video sometime back about this here: https://www.youtube.com/watch?v=o5-Wk8_7yFo

Re: Layout Grid Column Order.

Posted: Fri Dec 01, 2023 4:16 am
by Lasa
Thanks Crispy68,
I was almost doing it right ... but hidden is big time!
Thanks a ton for the excellent tutorial.
Lasa