🌟 Help others discover us, star our GitHub repo! 🌟

Mobile Menu

Page Builder Grid Upgrade

Monika ZapryanovaTwitter
May 02, 2023

The upgraded Grid is mind blowing! Using all the new functionalities Webiny has introduced will enable you to create almost any design you can think of, but still keep all elements nicely aligned and the space harmonious. Let’s have a look what the new Grid functionalities can bring to the table.

You can easily add a Grid from the Layout menu in the Page Builder Elements.

In the Grid Size panel you can customise the number of rows and columns and their size.

pb-grid-size.png

In the Grid Settings, one can select the column height and gap between columns.

pb-grid-settings.png

We have used the Grid functionality to create all of these beautiful page elements on our Website.

pb-grid-example1.png pb-grid-example2.png pb-grid-example3.png

Our grid system uses a 12-column grid, which means you can easily create designs with 2-3-4-6-12 columns. If you want to create something which has 5 or 7 columns for example you have to be a bit more creative with the way you use a combination of grids, for example 2+3 columns and the spacing between the columns or you could add 6 columns and then hide one of them. Once you have created your new layout we recommend saving that as a Page Builder Block so that you can reuse it at any time.

In Q2, we are planning on releasing our new Page Builder pre-built Blocks which will enable the content creators and designers to create templates and pages using pre-defined no-code designs.

We hope you like the new Grid functionalities. If you want to find out more about the Page Builder upgrades which we introduced in v5.35 check out this walkthrough video. Let us know what you think about Templates and if you have any ideas for improvements. You can use our Idea board or our Slack channel.

Find more articles on the topic of:cmsenterpriseproduct newspage builderno code

About Webiny

Webiny is an open source serverless CMS that offers you all the enterprise-grade functionalities, while keeping your data within the security perimeter of your own infrastructure.

Learn More

Newsletter

Want to get more great articles like this one in your inbox. We only send one newsletter a week, don't spam, nor share your data with 3rd parties.

Webiny Inc © 2024
Email
  • We send one newsletter a week.
  • Contains only Webiny relevant content.
  • Your email is not shared with any 3rd parties.
Webiny Inc © 2024
By using this website you agree to our privacy policy
Webiny Chat

Find us on Slack

Webiny Community Slack