- English
- Deutsch
- Français
- Nederlands
Container and Editor Block Examples with background
This is an editorial block with the "text-gray" class applied to the text using the formats drop down in the editorial block.
The background colour for this section is applied by using a container block and setting your selected hex colour code in the "Background Custom Colour" section under the Background tab.
Grid Block Example
Grid Item 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Grid Item 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Grid Item 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Grid Item 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
This is a banner block example
Using the included content area and by selecting the BlackThirtyPercent overlay option, and text-white format option in the Main Content editorial section
This is another banner block example
This time we are aligning the text to the left under the Content Horizontal Alignment drop down on the options tab.
To decrease the footprint of this text, I have changed the Content Width to half under the options tab.
We are also using WhiteSeventyPercent and the normal text formatting.
Use accordions to arrange lots of different of information into bite size chunks
You could even contain an image in the accordion as you can with an editorial block.
You can also apply formatting.
You can achieve this by ticking the Open On Load checkbox when making an accordion block
Below is a carousel block that is used to contain multiple Banner Blocks, by changing the settings of the carousel you can change how many banners to show at one time depending on device size. Try resizing your browser window to see how it affects the carousel below.
This is a content navigation block, it is used to show an image, a header and some text. A content navigation block requires an image, if you don't need an image, use the pixel.png image found on the first page when selecting an image.
Below are a few more examples how you can use the Content Navigation Block.
