Skip to main content
MediaBeacon University

Layouts

Layouts are the basic frames into which widgets can be arranged. Standard layouts include a one-, two- and three-column layout, as well as others supporting more complex custom arrangements.

Layouts are flexible and expand to fill unused space when not in Admin mode. This ensures the most efficient use of screen real estate.

For example: Selecting the Layout, "DefaultHeaderFooter," allows widgets to be placed in any of the layout zones shown in the gray boxes below.

Layout_Dropzones.png

Admin Mode shows the different layout zones. Upon exiting Admin mode, the chosen widgets and layout will expand to make the most efficient use of screen space.

Layout_Stretch_Example.png

Default Layout (Three-Column):

Layout_Three-Column.png

Default Layout (Three-Column) with Header/Footer:

Layout_Three-Column_Header_Footer.png

Two-Column Layout:

Layout_Two-Column.png

Two-Column Layout with Header/Footer:

Layout_Two-Column_Header_Footer.png

Three-By-Two Layout:

Layout_Three-by-Two.png

Single-Column Layout (no View widget):

Layout_Single_Column_No_View_Widget.png

Single-Column Layout (View widget only)

Layout_Single_Column_View_Widget.png

Vertical Columns Layout (with View widget):

Layout_Vertical_Columns.png

Layout Zone Settings

In the top right of every layout zone, there is a gear icon that opens the Layout Zone Settings dialog for that zone.

Layout_Zone_Settings.png

Styling Options

  • Background Color: Set the background color of the Layout Zone with a hex value (example #3B9233).

Toggleable Widgets

  • When a widget's box is checked, the widget will display as an accordion menu even when not in Admin Mode. This allows the widget to be collapsed and opened, providing a cleaner experience.
  • Was this article helpful?