All Our Content Blocks

The purpose of this page is to show how our blocks can be used on a page. They are sorted below a number of different topics, which you can see in the jumplink menu below.

Content blocks
Animation blocks
Form blocks
Map blocks
Script block

Different types of normal content blocks.

Hotspot block

A specific block that allows you to add + icons on top of a Epi-picture (not available in Qbank) which opens up small blocks in a pop-up with picture, text and link.

Large block full width (4 columns)

Possibility to use a heading (H1-H3)

Large block example 1

In this example;

A H2 heading is used
A H3 subheading is used
The splitter layout is set to 50 % (the other option is 33 % which makes the image smaller)
The image is placed on the right side
One red CTA button is added with a link (White is the other option)
Padding is not enabled, so there is no space between this block and the block below

CTA button 1

Test

Large block example 2

Here is a large block with only a subheading in H3, and the image on the left side.

No CTA buttons, but a text link directly in the text editor.

Padding is enabled, so see the difference between white space above and below this block.

The optimal number of characters to get the text as the same height as the image is 1000 characters when using the H3 subheading.
Without a subheading, it's about 1300 characters.

And the definition of characters, copied from Wikipedia is: letters, numerical digits, common punctuation marks (such as "." or "-"), and whitespace.

White button

Large block example 3

In this example, we are using 33 % splitter layout to shrink the block height.

Just plain text and a small image.

The optimal amount of characters with subheading is 600, and without subheading it is around 1000 characters.

Small block (1 or 2 columns)

You can use an overline

Small block example 1

In this example:

No image
A H3 subheading
Some text and bullets

Could be used as an introduction if you have three Small blocks, but want to create a whole row of four small blocks.

Small block example 2

In this example we have set up the most common settings:

Q-bank image is used, with media placement Top
A H3 subheading is used
Some text and bullets in the text area
Link shown as text

Link shown as text >

Overline

Small block example 3

In this example:

Q-bank image is used, with media placement Bottom
A H2 heading is used (A bit too big maybe, subheading is enough)
A H3 subheading is used (This is most used, and using both headings is not a good way to go)
Some text and bullets in text area
No link

You can use an overline

Small block example 4

In this example:

A youtube video
An H3 subheading
Some text and bullets

The optimal number of characters is hard to say. The most important thing is to have equal number of the small blocks next to eachother, so they align.

So these four are not a great example for that purpose. This is just for showing the different options.

Link shown as button

Wrapper block

This a wrapper block that 1) clean up your content area by keeping all small blocks in one place 2) gives you the chance to choose if a set of small blocks should have a boarder or not on this page without sabotaging the layout of other pages.

You can use an overline