Basic information

The content of pages is divided into „Sections“. Those sections can have different background colors and contain all single elements, called „Blocks“. The margin between blocks within a section is always the same and smaller than the margin between different sections.

There are basically 2 different types of section, each one with a style variation. So we have 4 different types of sections. See how they look like on the sections page.

For every section there are the following content blocks to choose from:

1. Heading
2. Lead
3. Heading with lead
4. Text
5. Quote
6. Fact box
7. Shortcode
8. Form
9. Image
10. Image slider
11. Teaser columns
12. Button
13. Social sharing
14. Petition: Last supporters
15. Accordion

Heading

This element is simply a headline. It can be styled in three different ways:

Text

This block is a WYSIWYG-editor and should be used for text.

This is the element „Text (extendable with sidebar), but without a sidebar. Lorem ipsum dolor sit amet, this is bold consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. This is italic and duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur linked text to first section sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

This is a video embedded within the textfield:

Commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

This is an H2 heading and now comes an unordered list:

• This is an unordered list
• Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.
• Third item
• Fourth

Commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

This is an H3 heading and now comes an ordered list:

1. This is an ordered list
2. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.
3. Third item
4. Fourth

Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Quote

The text for quote itself is the only mandatory field, but the block can also have an image, a name and a position.

Fact box

This block shows multiple facts with predefined icons, that can be chosen. It can be used as full-width-element and in the sidebar of some blocks. Find out more about the sidebar version on the sidebar page.

Shortcode

The shortcode element can be used to show all types of registered shortcodes, like the audio-player-shortcode:

The form element can be used to show a specific Gravity form. It can be extended by a sidebar – find out more about the sidebar version on the sidebar page.

Image

Shows an image with or without a caption. Height is variable.

Image slider

Shows images with or without captions in a slider format:

It can also be used to present only one image without a slider:

Teaser columns

Teaser columns show multiple items with image, title and text. They can be linked and there are two grids available:

Button

Buttons can link to internal pages, external websites or anchors and are available in two different styles:

Social sharing

Adds social sharing buttons to the page (WhatsApp, Twitter, Facebook, E-Mail):

Petition: Last Supporters

This block shows the most recent supporters from a petition.

ACCordIon

This block shows an accordion