Layout Properties

From unroole CMS wiki
Jump to: navigation, search


Layout Properties.png

Highlighting of the update properties panel in the layout editor.

Each layout consists af a few simple properties which govern its overall appearance and structure. These properties are:

  • Width (default 960px): This is the default width of the layout (unless overridden by the theme) which is used to compute the size of widgets and boxes.
  • Columns (default 12 columns): The number of columns to divide the page into. Column widths are computed using the page width for maximum compatibility.

Depending on the type of item using the layout these, properties may have different impacts. For example a channel layout should have a width spanning the minimum size of the page you wish to support. It can be as many or as few columns as you wish to hold its content. Any layouts which are displayed within a channel layout content box would need to have a smaller layout width to be able to fit within the channel layout. Column numbers between layouts do not need to be the same as the system uses different css per layout to draw the appropriate column size.

12 column grid with highlighted box selection.png

Box column options highlighted.

Whenever you change a width or column property of a layout, the system will check to make sure that the number of columns divides into the width evenly for proper support with older browsers. To keep things simply you may want to use common widths such as 1368, 1280, 1024 and 960 though odd numbered widths will work as long as the number of columns divide without remainder into the width. Below is an example of combinations of widths and columns which are acceptable:

  • 960/4
  • 960/12
  • 1280/8
  • 1280/10
  • 1368/9
  • 1368/12

More esoteric examples that still work:

  • 999/3
  • 1000/100
  • xxx/1

Notes:

  • The maximum number of columns for a layout is capped at 100. If you find you need that granularity of column sizes we suggest using a Static Layout Design approach.
  • Whenever the column parameter of a layout is changed the system will automatically attempt to convert box of similar ratios. Therefore moving from a 5 to 10 column grid will result in an identical looking page.