You are using Internet Explorer 11 or earlier, this browser is no longer supported by this website. We suggest to use a modern browser.

Banner Teaser (ucp002)

Banner Teasers are used as a standalone element on top of an article website to point out specific topics or “breaking news”. They can be used anywhere and several times.

The teasers are constrained in size, meaning you can only feature a limired amount of content here. They consist of an icon, a headline and a short teaser text, as well as a link.

Depending on communication objective, one of three different icons can be chosen, which also has an effect on the corresponding color of the banner:

  • Information: Banner teasers are kept in tk blue and show the information icon.
  • Bookmark: Banner teasers are in grey and serve to refer to and link to certain pages.
  • Attention: Banner teasers are red. They should be used for particularly important notices or warnings.

Banner teasers must be embedded via the "dynamic teaser collection" module, i.e. they are not available as a separate module.

If desired, a series of teasers can be shown on one page – they can be scrolled with a slider then.

Banner Teaser in intranet setting

Banner Teaser in intranet setting

This is how the module works:

Creating a banner teaser:
1. Type of teaser Select "banner teaser" ("Display news teaser in newsroom" is irrelevant here)
2. Icon selection Determines the type of teaser: “Attention”, “Bookmark” or “Information”
3. Headline Text input of a headline (max. 75 characters)
4. Subheadline Text shown in the middle of the teaser (max. 240 characters)
5. Publisher date Selection of the publication date (won't be shown, only relevant for filter purposes)
6. Select publisher Selection of the “sender” of the message (won't be shown, only relevant for filter purposes)
7. Link to further information Link text can be edited after selecting a link type (max. 16 characters)

This is how the module works:

Creating a banner teaser:
1. Type of teaser Select "banner teaser" ("Display news teaser in newsroom" is irrelevant here)
2. Icon selection Determines the type of teaser: “Attention”, “Bookmark” or “Information”
3. Headline Text input of a headline (max. 75 characters)
4. Subheadline Text shown in the middle of the teaser (max. 240 characters)
5. Publisher date Selection of the publication date (won't be shown, only relevant for filter purposes)
6. Select publisher Selection of the “sender” of the message (won't be shown, only relevant for filter purposes)
7. Link to further information Link text can be edited after selecting a link type (max. 16 characters)
Publishing a banner teaser via “dynamic teaser collection”:
The teasers are published via the dynamic teaser collection and are shown depending on the filters set there. There are these options:
1. Title of the teaser collection
2. Name of the data source Options
3. Type of the teaser The banner teaser can be selected at this point
4. Selection of topics Selection of categories the teasers should be filtered by (e.g. BA/BU/OU)
5. Filter by start of URL An alternative filter option – teasers will be shown only if the pages have the URL fragment defined here (e.g. “en/our-department/”)
Publishing a banner teaser via “dynamic teaser collection”:
The teasers are published via the dynamic teaser collection and are shown depending on the filters set there. There are these options:
1. Title of the teaser collection
2. Name of the data source Options
3. Type of the teaser The banner teaser can be selected at this point
4. Selection of topics Selection of categories the teasers should be filtered by (e.g. BA/BU/OU)
5. Filter by start of URL An alternative filter option – teasers will be shown only if the pages have the URL fragment defined here (e.g. “en/our-department/”)

The module can be used in the following templates and page areas:

Stage

The blue area indicates that the module is applicable.

Screenshots

ucp002 Banner Teaser (Desktop)
Desktop
ucp002 Banner Teaser (Desktop)
Desktop (Placement in Stage)
ucp002 Banner Teaser (Tablet)
Tablet
ucp002 Banner Teaser (Mobile)
Mobile