New Feature Alert - Grid Experience

Update: The new features are now available to all users

I’m excited to share that we are gradually releasing a bunch of new features for the Grid in Editor X.
Only a part of you will get these features at first, so it’s a great opportunity to share your feedback before it will be available for all users.
The Grids in your sites will remain the same but the experience will be much better!

What’s new?

We improved the experience for applying, editing, and adjusting grids on any breakpoint and added some features that will make it much quicker for creators who start from applying layout or content first:

Set Grid Layouts

From now on, all sections will come with a built-in grid, with the 1x1 layout being applied by default. Instead of “Applying” a Grid, now you can just change the container layout or add more columns and rows to it.

Select a container or a section and quickly change the Grid Layout on any breakpoint from the dropdown in the floating panel. You can also choose the ‘Other’ option and add as many columns and rows as you need. The amount of grid cells can be different in any breakpoint so you can place your content in the right grid layout for every screen size.

You can reset the grid in various ways, select the 1x1 option in the layout dropdown, or click ‘Reset Grid’ in the Inspector Display section or the right click menu.

Manage Grid in Inspector

Control grid settings via the Inspector panel to intuitively manage responsive layouts and easily edit row and column definitions. In the Inspector Display section, you can use the Grid Layout dropdown to set the grid, adjust the columns and rows sizing options and add gaps for spacing.

Customize Grid on Canvas
In the floating panel, next to the layouts dropdown you will find a new option to ‘Customize Grid on Canvas’. This new mode allows to place grids on top of content and update layouts without disrupting your design - add, edit and delete grid lines directly on the canvas.

Grid Measurements View
To quickly edit your grid click on the column/row to easily adjust its size in the Inspector panel.

You can turn on/off the Grid Measurements from the ‘View’ menu at the top bar or use the keyboard shortcut.

Enjoy and please feel free to share your feedback! :gift_heart:

9 Likes

This update to the grid is very exciting news for many Editor X users. This new feature will make working with Editor X easier and faster. Thanks to the developers of Editor X for making this possible.

The new experience is now available to all users :butterfly:

can i change it to the old layout ?

How do I delete a grid now?

I’m overjoyed, since the grid improvement is good news for many Editor X users. With this new feature, working with Editor X will be easier and faster. Thank you to the Editor X developers who made this possible.:sunglasses:

You can right click on the container/section and select ‘reset grid’ or just switch back to 1X1 from the layout dropdown

Our designers and developers at our agency prefer the old grid experience. General feedback from the team is that editing lots of columns and rows inside dropdowns in the sidebar is clunky, and the on stage editing of grid position is not precise nor best practice. We’d love to see a focus on real issues like the inconsistent style sidebar UI for many components, docking bugs, the addition of horizontal stacking, and editor stability instead of redesigning features (like grid) that were previously solid.

appreciate your feedback, it will be forwarded to our product team

Achei legal a opção, manter todas as questões de edição num painel só é bom, mas realmente é desajeitado, acredito que a opção anterior apenas porém sem ter que entrar num ambiente separado seria interessante, assim só de clicar no elemento já poderia na própria area de trabalho configurar a grid.

is there any videos about the new set up?
Most of the ones i looked at are old ones.
Being in australia the time to view your live presentations is unfavourable

https://www.editorx.com/academy/lessons/grid
this lesson was already updated, as I can see

Hey :wave:
If you missed the first part of our site structure webinar series - Working With Grid: When, Why and How
The VOD is now up so you can watch it here:

Hi Jaiden,
We are constantly working on improving Editor X and your feedback is very important for us. Editor stability and bug fixing are at the top of our focus these days and we put a lot of effort into it. I really hope you feel the improvement. Please feel free to reach out with any specific issues or concerns and I will do my best to help.
Thanks for your feedback!
Liron

Hi Liron. That is good to hear that stability is a focus. It continues to pain our agency that new features are released while other existing features remain incomplete or buggy, some examples:

  • The new grid feature has bugs in a lot of ways, some examples listed out here

  • The editor frequently freezes and crashes… in fact this happened to you on your most recent webinar while making basic changes using the new grid tools if I recall correctly:

  • Lots of wix apps such as wix bookings still don’t have all of the widgets and functionality that they do on the normal editor.

  • It isn’t possible to link a container - meaning you have to add silly work arounds like wrapping an invisible vector shape or image over the entire content of a container when trying to link an entire card or area of design - there should be the basic ability to turn a container into a “link block” as is standard in html

  • Our agency ran into a major SSR timeout issues that has been verified by your rendering team which causes pages with custom code to not render at all on occasion, but it has taken months now and that is still not resolved…

  • Docking frequently does weird behaviours - like moving an item from one grid to another will suddenly have random docking values changed with negative margins or different item width applied - this happens frequently during the build process

  • New styled buttons still don’t have a “max content” width option despite this being a responsive editor… in fact all items should have an inline block option, or horizontal stack feature with width set to auto

  • No access to proper CSS stylesheets or reusable component styles that share CSS to lower code bloat causes QA issues, inconsistencies etc

  • Inconsistent or missing to hover/active/disabled states in the design panel - this should be standard across the board for all items being designed

  • Missing text scale from the styles panel

There are many more bugs and issues but those are a few that are top of mind! Thanks for hearing me out :slight_smile: