Container Modules

Frost 2.0 provides a module type called "Container". Unlike lists, Containers provide a way to create page grids with different modules in each column. For some Container selections, there is also an option for uneven column widths. Containers come in 1, 2, 3 and 4 row options. The 2 Column Container option has three grid layouts: 50% / 50% split, 30% / 70% split, and 70% / 30% split. Additional options include: module dividers (a horizontal line between) and a narrow-width, meaning the margin of the page will be smaller than the default. See the Container options below.

Container Title: One Column (Default / Full-Width)

Container Description. The One Column Container acts as a row for a full-width module, or a list that already fills up the width of the page. Containers have titles and descriptions, so if the list style doesn't come with those fields, they can be added here. Here is an example of a One-Column Container with horizontal rule and full-width options enabled.
NOTE: The narrow and full-width options only apply to the One-Column Container option.
Promoted content description
Promoted content description
Promoted content description
Promoted content description
Promoted content description
Promoted content description
Promoted content description
Promoted content description

Container Title: One Column (Narrow-Width)

Container Description. The One Column Container acts as a row for a full-width module, or a list that already fills up the width of the page. Containers have titles and descriptions, so if the list style doesn't come with those fields, they can be added here. Here is an example of a One-Column Container with no horizontal rule and narrow-width options enabled. Notice the side margins of the page are much bigger with the narrow-width.
NOTE: The narrow and full-width options only apply to the One-Column Container option.
Promoted content description
Promoted content description
Promoted content description
Promoted content description
Promoted content description
Promoted content description
Promoted content description
Promoted content description

Container Title: Two Column (50 / 50 split)

Container Description. The Two Column Container acts as a separator for a modules, and will define the width of a module based on the style. The styles that come with a two-column option are 50 / 50 split, 30 / 70 split, or a 70 / 30 split. Here is an example of a Two-Column Container, 50 / 50 split - with two different styles of lists published.
October 14, 2020
Promoted content description
1 Min Read
October 14, 2020
Promoted content description
1 Min Read
Promoted content description
1 Min Read
October 14, 2020
Promoted content description
1 Min Read
October 14, 2020

Container Title: Two Column (70 / 30 split)

Container Description. The Two Column Container acts as a separator for a modules, and will define the width of a module based on the style. The styles that come with a two-column option are 50 / 50 split, 30 / 70 split, or a 70 / 30 split. Here is an example of a Two-Column Container, 70/ 30 split—so the left column is wider, with two different styles of lists published.
October 14, 2020
Promoted content description
1 Min Read
October 14, 2020
Promoted content description
1 Min Read
Promoted content description
1 Min Read
October 14, 2020
Promoted content description
1 Min Read
October 14, 2020

Container Title: Two Column (30 / 70 split)

Container Description. The Two Column Container acts as a separator for a modules, and will define the width of a module based on the style. The styles that come with a two-column option are 50 / 50 split, 30 / 70 split, or a 70 / 30 split. Here is an example of a Two-Column Container, 30/ 70 split—so the right column is wider, with two different styles of lists published.
October 14, 2020
Promoted content description
1 Min Read
October 14, 2020
Promoted content description
1 Min Read
Promoted content description
1 Min Read
October 14, 2020
Promoted content description
1 Min Read
October 14, 2020

Container Title: Three Column

Container Description. The Three Column Container acts as a separator for a modules, and will define the width of a module based on the style. The Three-Column Container acts a lot like the 3 Across Grid List style, except in the container, editors can program different promos in each column. Here is an example of a Three Column Container.

clipart-man-head-8.png
By Author
October 14, 2020
This card style is called "Card: Image on Top". The image is always on the top of the card, and editors can display or hide the drop shadow around the card.
1 Min Read
clipart-man-head-8.png
By Author
October 14, 2020
This card style is called "Card: Image on Top". The image is always on the top of the card, and editors can display or hide the drop shadow around the card.
1 Min Read
clipart-man-head-8.png
By Author
October 14, 2020
This card style is called "Card: Image on Top". The image is always on the top of the card, and editors can display or hide the drop shadow around the card.
1 Min Read

Book your personalized walk-through today!

Frost is powered by the Brightspot content business platform. Learn more about how Brightspot can move your business forward.