- This topic has 9 replies, 3 voices, and was last updated 4 months, 2 weeks ago by
David.
-
AuthorPosts
-
October 7, 2020 at 8:17 pm #1477696
ch1800
What is the recommendation for sites already using Lightweight Grid Columns with new version 3.0 of the theme?
In my case I’m not using blocks and not planning to, so my question does not relate to Generateblocks.– keep them as they are and leave customizer settings set for Floats?
– convert sections using “lgc_column grid” to flex?For the latter, is there any guide for converting those shortcodes to Flex?
October 7, 2020 at 9:20 pm #1477730Elvin
StaffCustomer SupportHi,
Lightweight Grid Columns is pretty much obsolete so there’s no future versions that will easily allow users to convert it to flex.
The actual recommendation is to use GenerateBlocks as it is literally the direct successor of LGC but since you’ve mentioned you don’t want to use it. Let’s skip that.
I’m afraid the only way to convert Lightweight Grid Columns to flex is to use custom CSS codes on it.
There’s no official guide to converting those to flex. But we can help in providing the CSS code if you link us to your page. 🙂
A wise man once said:
"Have you cleared your cache?"October 7, 2020 at 9:32 pm #1477737ch1800
Thanks Elvin,
Yes, that’s what I thought also.
I have several sites using 2 or 3 columns with those typical shortcodes:[lgc_column grid="25" tablet_grid="25" mobile_grid="100" last="false"] [/lgc_column] [lgc_column grid="50" tablet_grid="50" mobile_grid="100" last="false"] [/lgc_column]
I added here a URL of one of those that has both 2 and 3 columns at homepage.
What would be the equivalent with CSS?October 7, 2020 at 9:48 pm #1477749Elvin
StaffCustomer SupportYou can convert its parents to flex by doing something like this.
#generate-section1 .grid-container.grid-parent.generate-sections-inside-container, #generate-section2 .grid-container.grid-parent.generate-sections-inside-container { display: flex; flex-direction: row; }
And you can convert the actual column to be a flexbox too by using its selector
.lgc-column
Something like this:
.lgc-column{ display:flex; }
A wise man once said:
"Have you cleared your cache?"October 7, 2020 at 10:11 pm #1477770ch1800
Sorry, I don’t get it.
What “parents” mean please?
What does it mean to “convert” the column to be a flexbox? Is this a global CSS or specific to a page using grids?Can you give me an example for something like this?
[lgc_column grid=”50″ tablet_grid=”50″ mobile_grid=”100″ last=”false”]
first column text here
[/lgc_column][lgc_column grid=”50″ tablet_grid=”50″ mobile_grid=”100″ last=”true”]
second column text here
[/lgc_column]October 7, 2020 at 10:24 pm #1477779Elvin
StaffCustomer SupportMy apologies. I should’ve been more concise.
– keep them as they are and leave customizer settings set for Floats?
– convert sections using “lgc_column grid” to flex?After re-reading your questions, perhaps I went too far ahead. Were you just asking if its necessary to convert LGC to flex? If so, the answer is no. You can keep it as is.
Using flex has its advantages in formatting. But if you’re happy with your current layout, you really don’t have to convert things to flex.
What “parents” mean please?
What I meant with “parents” is the container HTML element your LGC shortcode is placed on.
It is somewhat necessary to apply
display:flex;
on them if you want their child(the columns) to be able to use flexbox properties.What does it mean to “convert” the column to be a flexbox? Is this a global CSS or specific to a page using grids?
Converting a column into a flexbox means changing its css display property to flex. More in-depth explanation provided here. https://css-tricks.com/snippets/css/a-guide-to-flexbox/
A wise man once said:
"Have you cleared your cache?"October 7, 2020 at 10:40 pm #1477796ch1800
OK, here we are then.
From your answer I understand there is no point in converting anything and this was my initial guess but wanted a confirmation.The whole interest seems to be for new sites only. Thanks for the link, I’ll check this further.
One more:
I have other sections using this (with additional CSS on that page):<div class="grid-container"> <div class="grid-100 mobile-grid-100 tablet-grid-100">
Is this also considered as “float” and can I also leave it as is?
October 8, 2020 at 1:38 am #1477996David
StaffCustomer SupportHi there,
yes thats correct – they would also require the Float method.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/October 8, 2020 at 2:14 am #1478050ch1800
Thanks David.
October 8, 2020 at 3:30 am #1478144David
StaffCustomer SupportYou’re welcome
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.