Teaser and Multiteaser
Teaser sind eine Kombination aus Bild und Text, die einen kurzen Einblick in das verlinkte Thema bieten und so das Interesse der Lesenden wecken. Somit sollte der Text möglichst kurz gehalten werden und nur die wichtigsten Informationen beinhalten. Das Bild sollte ebenfalls möglichst aussagekräftig sein.
A teaser is a combination of an image and text that attracts readers to a linked topic by giving them a quick glimpse of it. The text should be short and contain just the essential information. The image should provide the appropriate visual context for the content.
JS behaviour: Mit dem data Attribut data-add-clickable-area="smart"
werden das Bild und der Titel des Teasers klickbar gemacht. Mit dem data Attribut data-add-clickable-area="full"
wird der komplette Teaser klickbar gemacht. Das Linkziel bestimmt das href des Links mit dem Attribute data-mainlink
.
JS behaviour: With the data attribut data-add-clickable-area="smart"
the image and the title of the teaser will be clickable. With the data attribut data-add-clickable-area="full"
the full teaser will be clickable. The linktarget is defined by the href of the mainlink with the attribute data-mainlink
.
Single Teaser
.modul-teaser
Caption is considered a science but it is difficult to say.
@copyright
This is a single Teaser
Philosophy is considered a Link science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
Mehr
<article class="modul-teaser" data-add-clickable-area="smart">
<div class="image">
<div class="image__image">
<img src="../../dummy/placeholder_4x3.jpg" alt="Alternative Bildbeschreibung" >
</div>
<p class="image__caption">
Caption is considered a science but it is difficult to say.
</p>
<p class="image__copyright">
@copyright
</p>
</div>
<h3 class="title">This is a single Teaser</h3>
<div class="teaser__meta">
<p class="text--meta">Kategorie: optional</p>
</div>
<div class="inner">
<p class="text">
Philosophy is considered a <a href="#">Link</a> science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
<a href="#random9244" class="more" data-mainlink="true" aria-label="This is a single Teaser" title="This is a single Teaser">Mehr</a>
</p>
</div>
</article>
Multiteaser
Es können bis zu vier Teaser in einer Reihe angezeigt werden indem ein Flexgrid mit den Teasern kombiniert wird.
By combining a Flexgrid with the teasers, you can display up to four teasers in a row.
.modul-multiteaser
Multiteaser (1)
-
Caption is considered a science but it is difficult to say.
@copyright
Teaser
Philosophy is considered a Link science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
Mehr
<section class="modul-multiteaser">
<h2 class="title">Multiteaser (1)</h2>
<ul class="flexgrid grid--1">
<li>
<!-- Teaser 1 --> </li>
</ul></section>
Multiteaser (2)
-
Caption is considered a science but it is difficult to say.
@copyright
Teaser
Philosophy is considered a Link science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
Mehr
-
Caption is considered a science but it is difficult to say.
@copyright
Teaser
Philosophy is considered a Link science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
Mehr
<section class="modul-multiteaser">
<h2 class="title">Multiteaser (2)</h2>
<ul class="flexgrid grid--2">
<li>
<!-- Teaser 1 --> </li>
<li>
<!-- Teaser 2 --> </li>
</ul></section>
Multiteaser (3)
-
Caption is considered a science but it is difficult to say.
@copyright
Teaser
Philosophy is considered a Link science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
Mehr
-
Caption is considered a science but it is difficult to say.
@copyright
Teaser
Philosophy is considered a Link science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
Mehr
-
Caption is considered a science but it is difficult to say.
@copyright
Teaser
Philosophy is considered a Link science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
Mehr
<section class="modul-multiteaser">
<h2 class="title">Multiteaser (3)</h2>
<ul class="flexgrid grid--3">
<li>
<!-- Teaser 1 --> </li>
<li>
<!-- Teaser 2 --> </li>
<li>
<!-- Teaser 3 --> </li>
</ul></section>
Multiteaser (4)
-
Caption is considered a science but it is difficult to say.
@copyright
Teaser
Philosophy is considered a Link science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
Mehr
-
Caption is considered a science but it is difficult to say.
@copyright
Teaser
Philosophy is considered a Link science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
Mehr
-
Caption is considered a science but it is difficult to say.
@copyright
Teaser
Philosophy is considered a Link science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
Mehr
-
Caption is considered a science but it is difficult to say.
@copyright
Teaser
Philosophy is considered a Link science but it is difficult to say, when one has to compare with an ordinary science, for example biology, or chemistry. This is a question that turns into a burning problem among the scientists and linguists all over the world. Can philosophy be a science? What does philosophy operate with? It operates with categories, which can be as wide and as interchangeable as one can only imagine. Ordinary science operates with definitions, which are quite limited in their field of research.
Mehr
<section class="modul-multiteaser">
<h2 class="title">Multiteaser (4)</h2>
<ul class="flexgrid grid--4">
<li>
<!-- Teaser 1 --> </li>
<li>
<!-- Teaser 2 --> </li>
<li>
<!-- Teaser 3 --> </li>
<li>
<!-- Teaser 4 --> </li>
</ul></section>