Design

The arrangement and appearance from content elements can be defined on different areas. The coarse structure is defined with the page layout where grid elements might further organize the content in columns, registers, and the like. Fine tuning can be done on a content element basis by altering the frame, attributes and background.

Page layout

Flexible content width

To create content spanning the entire page width (see example) a “Full width” page layout in conjunction with the “Bootstrap fix container” and “Full with container” grid elements might be used:

"Full width" page layouts

“Full width” page layouts

Container grid element

Container grid element

Tip

To further customize the containers css-classes, attributes and a wrapping container might be defined in the “Plugin Options” section from the “General”-tab:

Container grid element plugin options

Container grid element plugin options

Grid elements

Grid elements are used to further structure the content. Typically columns, accordions and registers are used for this purpose. The available grid elements can be found in the new content element wizard or the content properties form under the “Grid Elements” tab:

"Grid Elements"-tab in new content element wizard

“Grid Elements”-tab in new content element wizard

Content element

Custom frames

Additional frames can be selected for content elements (see example):

Custom frames for content elements

Custom frames for content elements

As for the time being the custom animations (Custom animation 1..3) aren’t implemented yet.

Attributes and background for content elements

Sometimes it would be handy to directly alter attributes and assign a background image to content elements.

This functionality has been added by introducing additional fields to the content element table and adapting the rendering accordingly. The new fields are available under the appearance tab in the “Attributes” and “Background” palette.

Palette "Attributes" and "Background" under the appearance tab in the content element form

Palette “Attributes” and “Background” under the appearance tab in the content element form