Layout blocks description

Hi,

I’ve been doing some tests with the Layout field in the Pro version and it seems amazing, however in the list of modules it only shows the amount of components it has inside.

Is there a way to make the description more meaningful?
Because when you start having a few modules in there it becomes difficult to identify each one, and I end up having to open a few until I find the content I was looking for.

why do you have a list of layout fields instead of just one layout field containing all components grouped eg in sections? :thinking:

Hi Arthur,

Thank you very much! I hadn’t figured out yet what the section component was for.

One more question, I see the grid has a “Column Width” field, but what if I need to have different widths for each column, or add responsive classes, how can we achieve this? We can’t add css classes to the columns. That would be great. In a grid framework like bootstrap, we could use the following structure:

  • section = .container
  • grid = .row
  • column 1 = .col-12 .col-md-8
  • column 2 = .col-12 .col-md-4

You can add your data fields to meta-json. Or calculate your grid Client-Side. There are so many grid-frameworks, all of them use different namings.

2 Likes

Thanks for the reply.

Calculating the grid on the frontend would work fine if I wanted to have same width columns, if I want the layout to be more diversified, the user needs to be able to define the width of each column according to the framework structure’s possibilities.

I would like to understand how the Meta field you mentioned works, but I haven’t found any information about it on the documentation. Do you have a working example I can look at, please?

Thank you,

Hi everyone,

I really to figure out how to add CSS classes to columns inside a grid (using the Layout component). Currently it’s possible to add classes to the section and grid components, but not to the columns.

I have a layout with different column widths and offsets, so the only way to achieve that is putting the classes in the specific columns.

Thank you,