- This topic has 10 replies, 3 voices, and was last updated 8 months, 2 weeks ago by Scott.
March 25, 2020 at 12:35 pm #1210009Teresa
We’ve been using GeneratePress for almost a year now and are really happy with how Sections and Elements make our lives easier.
Yesterday I started playing with the new GenerateBlocks plugin. I’ve been able to recreate a lot of what I’ve been able to do with Sections, etc except for one thing: How to get the order of images and text right on desktop vs mobile.
On my site I have the standard:
image – text
text – image
image – text
On mobile, however (and of course) I get
What’s the best way using GenerateBlocks (without duplicating images and having them show/hide on mobile) to get
I’m good with editing CSS and HTML to make this work.
Thanks in advanceMarch 25, 2020 at 4:39 pm #1210175TomLead DeveloperLead Developer
Check out the “Order” option in the Container block under “Advanced”. You can order each container block on all devices. Negative orders are possible as well.
We do this on the GenerateBlocks homepage right now 🙂March 25, 2020 at 5:01 pm #1210198Teresa
Thanks Tom! I found that option about 30 mins after I asked. Thank you for confirming I was on the right track.
I found to keep things controlled right I put each grid its own container. Doing the “add grid” into the same container had very unexpected results. Unless I had to number order each thing. If I did that would order 1 be top and order n+1 be next in line?March 26, 2020 at 3:28 am #1210453DavidStaffCustomer Support
yes 1 would place the item at the top in a mobile stack, as long as you then give every other grid item a higher order value as well.
However, with the order value – it is the lowest value that comes first which includes negative numbers. Example:
if you have a two column grid. And you want the right hand column to appear first on mobile give it an order value of
You don’t need to give the left hand column a value as it has an implied ( automatic ) value of 1.March 26, 2020 at 8:30 am #1210900Teresa
Awesome! Thank you.March 27, 2020 at 4:02 am #1211668DavidStaffCustomer SupportSeptember 30, 2020 at 5:20 am #1465108eduard sans
Hi there, I can’t find the “Order” option under advanced options in the Container block. All I see are the options for the element tag, ID, class and z-index. Am I missing something?September 30, 2020 at 5:50 am #1465146DavidStaffCustomer SupportSeptember 30, 2020 at 6:28 am #1465212eduard sans
Finally! For whatever reason that wasn’t easy to find xD. Thanks a lot David.September 30, 2020 at 6:37 am #1465227DavidStaffCustomer SupportJanuary 10, 2021 at 2:52 pm #1613627Scott
This just answered my same question.
- You must be logged in to reply to this topic.