[Resolved] Lightweight Grid Columns and version 3.0

Home Forums Support Lightweight Grid Columns and version 3.0

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #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?

    #1477730
    Elvin
    Staff
    Customer Support

    Hi,

    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?"

    #1477737
    ch1800

    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?

    #1477749
    Elvin
    Staff
    Customer Support

    You 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?"

    #1477770
    ch1800

    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]

    #1477779
    Elvin
    Staff
    Customer Support

    My 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?"

    #1477796
    ch1800

    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?

    #1477996
    David
    Staff
    Customer Support

    Hi there,

    yes thats correct – they would also require the Float method.

    #1478050
    ch1800

    Thanks David.

    #1478144
    David
    Staff
    Customer Support
Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.