- This topic has 21 replies, 4 voices, and was last updated 6 years, 5 months ago by Tom.
-
AuthorPosts
-
February 1, 2017 at 1:20 am #272698Lyle
Hi Tom, et al 🙂
As the title states, I would like to reverse the column order of the LGC columns on mobile. I have a homepage with 2 columns and would like the second column to be on top on mobile if that’s possible. It’s a snap to do with a page builder, but for this site, I am avoiding them 🙂
Cheers!
LyleFebruary 1, 2017 at 8:30 am #272868LeoStaffCustomer SupportHi Lyle,
I have no idea how to do it with code but maybe you can make two sets of them and hide one on desktop/tablet and one of mobile?
I guess we will hear it from Tom 🙂
February 1, 2017 at 9:48 am #272908TomLead DeveloperLead DeveloperBest way to do it is to use the push- and pull- classes.
This way, you order your columns for mobile, and then push and pull them to display in a different order on desktop.
More here: http://unsemantic.com/css-documentation#6-push-amp-pull-classes
February 1, 2017 at 10:08 am #272929LyleThanks Tom and Leo,
In my research before posting, I came across these classes but thought that they were only applicable to the Bootstrap framework. Had a look through the unsenmantic docs but obviously, not a good enough one 🙂
That should do it 🙂
February 1, 2017 at 10:19 am #272931TomLead DeveloperLead DeveloperYep – that’s how the sidebars in GP work 🙂
February 1, 2017 at 4:55 pm #273059LyleSorry Tom, I’m in dunce mode today 🙂
Tried various iterations from the unsemantic link you provided and then found this post here, and also no luck.
https://generatepress.com/forums/topic/slider-in-column-issues/
My question is, exactly where and in what format do you put the push pull values within the LGC shortcode?
This is what I have on the page now without any:lgc_column grid=”60″ tablet_grid=”60″ mobile_grid=”100″ last=”false” URL_TO_IMAGE /lgc_column
lgc_column grid=”40″ tablet_grid=”40″ mobile_grid=”100″ last=”true”
all the stuff is up here <i class=”fa fa-bars”></i>/lgc_column
Had to remove shortcode [] s
Cheers!
LyleFebruary 1, 2017 at 7:39 pm #273083TomLead DeveloperLead DeveloperCheck out the class example here: https://wordpress.org/plugins/lightweight-grid-columns/faq/
November 6, 2017 at 10:38 am #417299DanielHi Tom,
it seems i cant get my head around this one. How does push and pull work together with last=”true/false” ?
If i want to change the order of these columns on mobile – how do i do it?
[lgc_column grid=”50″ tablet_grid=”50″ mobile_grid=”100″Â last=”false”]
[/lgc_column][lgc_column grid=”50″ tablet_grid=”50″ mobile_grid=”100″Â last=”true”]
[/lgc_column]Thanks in advance,
DanielNovember 6, 2017 at 10:36 pm #417553TomLead DeveloperLead DeveloperThe order isn’t changed on mobile – the order on mobile follows whatever order the columns are written in.
The order is reversed on desktop, using the push/pull classes which literally push and pull elements into separate horizontal positions.
November 7, 2017 at 12:48 am #417608DanielThanks Tom,
i still can’t get this to work on my website. I tried this:
First on mobile, second on desktop:
lgc_column grid=”50″ tablet_grid=”50″ mobile_grid=”100″ class=”push-50″Second on mobile, first on desktop:
lgc_column grid=”50″ tablet_grid=”50″ mobile_grid=”100″ class=”pull-50 last=”true”Where is my error? Where does the “last”-parameter belong? I also tried it on the first column, which did not work either.
Big thanks in advance,
DanielNovember 7, 2017 at 8:42 am #417881TomLead DeveloperLead DeveloperThat looks like it should work. Can you link me to that page?
November 7, 2017 at 9:11 am #417912DanielSure: http://gritsch.netzspinnerei.at/ (in development)
When you scroll down below the header, the second and fourth row should be in reverse order. Instead they looks broken right now.
(the rows with Innovation „G-Manu“ and Collaboration „Osttirolportal“.)I double checked the shortcodes, could not find an error.
Thanks!
DanielNovember 7, 2017 at 9:03 pm #418186TomLead DeveloperLead DeveloperAh, that plugin needs an update. Can you try the latest files we have on GitHub?: https://github.com/tomusborne/lightweight-grid-columns
November 8, 2017 at 2:07 am #418272DanielHi Tom,
i updated and it changed something, but it still does not work. The “pull-50” columns seem to float on the left side now.
thx for your help,
DanielNovember 8, 2017 at 10:08 am #418637TomLead DeveloperLead DeveloperYour first/last elements need to go like this:
first
lastfirst
lastfirst
lastAnd so on.
Right now you have:
first
lastlast
first -
AuthorPosts
- You must be logged in to reply to this topic.