Content Design System Manager (CDSM) Configuring Layout Grid

Configuring Layout Grid

What is a Layout Grid

Layout Grid creates a unified and recognizable style for your publication by organizing your content in an effective way.

Setka Editor uses column grids — the basic grids in graphic design. These are often supplemented with horizontal rows constructed depending on your font size. Their configuration depends on the number of columns, margins, and gutters.

Column grids help to develop a design for a variety of devices: computers, tablets, and mobiles. Columns provide necessary limitations that enable you to arrange the content efficiently and coherently.

Setka Editor provides 4 layout grids by default: with 6, 8, 10, and 12 columns.

 

How to add a Layout Grid

You can add as many of your own layout grid as you like. To do it, click Add Layout Grid. Then specify the number of base columns, the gutter between them and the side margins (horizontal margins):

 

How to disable a Layout Grid

In order to disable the grid, click on the arrow, and select Disable. The chosen grid will be removed from the Layout Grid section, but posts that use this Layout Grid, will not lose their appearance.

Delete this layout grid option will remove it completely.

You are not able to delete all layout grids as at least one layout grid is required for any post. 

mceclip2.png

 

How to edit a Layout Grid

All settings of the Layout Grid, except the number of columns, can be changed:

mceclip3.png

 

The number of columns cannot be changed — otherwise, posts that are using this Layout Grid will be losing their appearance.

Changes made, will automatically apply to all posts that use this Layout Grid.

  

Auto and Limited content width

You are prompted to select either Auto or Limited widths when adding a new layout Grid. This option is located under the Advanced spoiler.

Auto width fits 100% of your content container. The margin width remains constant, container size stays unchanged on window resize.

Limited width lets you set an exact maximum content width limit in pixels. Margins are fluid and fill all the available space between the container and post content's width, which keeps content in the center. Select a Limited Layout Grid when your images overhanging the post width.