<div class="o-teaser-collection teaser-collection--content-gallery teaser-collection--content-gallery-with-half-headline js-teaser-targeting-init">
<h3 class="teaser-collection__headline teaser-collection__headline--h2">Entspannung, Abwechslung und Inspiration - mit unseren digitalen Angeboten</h3>
<div class="teaser-collection__teaser-wrapper">
<div class="o-teaser ">
<div class="teaser__image">
<picture class="a-picture ">
<source media="(max-width: 640px)" srcset="../../images/1x1/eltern-baby-tablet-1000x1000.jpg">
<source media="(min-width: 641px)" srcset="../../images/1x1/eltern-baby-tablet-1000x1000.jpg">
<img src="../../images/1x1/eltern-baby-tablet-1000x1000.jpg" alt="Dies ist ein alternativ Text" loading="lazy">
</picture>
</div>
<h4 class="teaser__headline">
<a class="teaser__target" href="http://tagesschau.de">
1 Karies: Nicht das einzige Problem für Kinderzähne (3:4)
</a>
</h4>
<div class="teaser__text">
Etwa 230.000 Sechs- bis Neunjährige waren im Jahr 2019 wegen Kreidezähnen in zahnärztlicher Behandlung. Mindestens acht Prozent aller Heranwachsenden in dieser Altersgruppe wären damit von einem viel zu weichen Zahnschmelz betroffen. Tatsächlich dürfte die Quote sogar noch höher sein. Kreidezähne sind besonders kariesanfällig und bedürfen bei schwerer Ausprägung lebenslang einer Behandlung.
<i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</div>
</div>
<div class="o-teaser ">
<div class="teaser__image">
<picture class="a-picture ">
<source media="(max-width: 640px)" srcset="../../images/1x1/eltern-baby-tablet-1000x1000.jpg">
<source media="(min-width: 641px)" srcset="../../images/1x1/eltern-baby-tablet-1000x1000.jpg">
<img src="../../images/1x1/eltern-baby-tablet-1000x1000.jpg" alt="" loading="lazy">
</picture>
</div>
<h4 class="teaser__headline">
<a class="teaser__target" href="http://tagesschau.de">
3 Selbstständige (1:1)
</a>
</h4>
<div class="teaser__text">
With the foundation in place, it was just a matter of putting it into practice. We started by working with the architects to identify the logical assembly points for the 6 logical locations of the Eventbrite platform
<i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</div>
</div>
</div>
<div class="teaser-collection__teaser-wrapper">
<div class="o-teaser ">
<div class="teaser__image">
<picture class="a-picture ">
<source media="(max-width: 640px)" srcset="../../images/1x1/eltern-baby-tablet-1000x1000.jpg">
<source media="(min-width: 641px)" srcset="../../images/4x3/promenade.jpg">
<img src="../../images/4x3/promenade.jpg" alt="" loading="lazy">
</picture>
</div>
<h4 class="teaser__headline">
<a class="teaser__target" href="http://tagesschau.de">
2 Selbstständige (4:3)
</a>
</h4>
<div class="teaser__text">
With the foundation in place, it was just a matter of putting it into practice. We started by working with the architects to identify the logical assembly points for the 6 logical locations of the Eventbrite platform
<i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</div>
</div>
<div class="o-teaser ">
<div class="teaser__image">
<picture class="a-picture ">
<source media="(max-width: 640px)" srcset="../../images/1x1/eltern-baby-tablet-1000x1000.jpg">
<source media="(min-width: 641px)" srcset="../../images/5x7/eltern-mit-kindern.jpg">
<img src="../../images/5x7/eltern-mit-kindern.jpg" alt="Dies ist ein alternativ Text" loading="lazy">
</picture>
</div>
<h4 class="teaser__headline">
<a class="teaser__target" href="http://tagesschau.de">
4 Selbstständige (5:7)
</a>
</h4>
<div class="teaser__text">
With the foundation in place, it was just a matter of putting it into practice. We started by working with the architects to identify the logical assembly points for the 6 logical locations of the Eventbrite platform
<i class="a-icon icon--chevron-right" aria-hidden="true"></i>
</div>
</div>
</div>
</div>
<div class="o-teaser-collection {{viewtypes.specifier}}" {{#content.id}}id="{{this}}"{{/content.id}}>
{{# switches.hasHeadline }}
<h3 class="teaser-collection__headline {{viewtypes.headlineSpecifier}}">{{ content.headline }}</h3>
{{/switches.hasHeadline}}
{{# switches.hasDetailText }}
<div class="teaser-collection__text">
{{# switches.isPlaintext }}
{{ content.plaintext }}
{{/ switches.isPlaintext }}
{{^ switches.isPlaintext }}
{{ render '@richtext' partials.richtext merge=true }}
{{/ switches.isPlaintext }}
</div>
{{/switches.hasDetailText}}
<div class="teaser-collection__teaser-wrapper" {{{ content.attributes }}}>
{{# each partials.teaserItems }}
{{#ifcond @index '<' ../switches.teaserItemAmount}}
{{#ifcond switches.isColumnPosition '==' 1}}
{{ render (stringToPartial ../partials.includedItemType) this merge=true }}
{{/ifcond}}
{{/ifcond}}
{{/each}}
</div>
{{# switches.hasTwoColumns }}
<div class="teaser-collection__teaser-wrapper" {{{ content.attributes }}}>
{{# each partials.teaserItems }}
{{#ifcond @index '<' ../switches.teaserItemAmount}}
{{#ifcond switches.isColumnPosition '==' 2}}
{{ render (stringToPartial ../partials.includedItemType) this merge=true }}
{{/ifcond}}
{{/ifcond}}
{{/each}}
</div>
{{/switches.hasTwoColumns}}
{{# switches.hasFooter }}
<div class="teaser-collection__footer">
{{content.footertext}}
</div>
{{/switches.hasFooter}}
{{# switches.hasCTA }}
<div class="teaser-collection__cta-row">
{{ render '@button' this.partials.button merge=true }}
</div>
{{/switches.hasCTA}}
</div>
{
"switches": {
"hasHeadline": true,
"hasDetailText": false,
"hasTwoColumns": true,
"isPlaintext": false,
"teaserItemAmount": 8,
"hasCTA": false,
"hasButton": false,
"hasFooter": false,
"columnAmount": 2
},
"viewtypes": {
"specifier": "teaser-collection--content-gallery teaser-collection--content-gallery-with-half-headline js-teaser-targeting-init",
"headlineSpecifier": "teaser-collection__headline--h2"
},
"content": {
"headline": "Entspannung, Abwechslung und Inspiration - mit unseren digitalen Angeboten",
"plaintext": "Dies ist ein bißchen Plaintext",
"badge": "",
"button": "",
"footertext": ""
},
"partials": {
"includedItemType": "teaser",
"teaserItems": [
{
"switches": {
"isLinkable": false,
"hasTeaserText": true,
"hasTeaserHeadlineAsLink": true,
"hasTextChevron": true,
"hasTeaserContentWrapper": false,
"hasPictureWithSrcset": true,
"isColumnPosition": 1
},
"viewtypes": {
"specifier": ""
},
"content": {
"headline": "1 Karies: Nicht das einzige Problem für Kinderzähne (3:4)"
},
"partials": {
"teaserText": {
"content": {
"text": "Etwa 230.000 Sechs- bis Neunjährige waren im Jahr 2019 wegen Kreidezähnen in zahnärztlicher Behandlung. Mindestens acht Prozent aller Heranwachsenden in dieser Altersgruppe wären damit von einem viel zu weichen Zahnschmelz betroffen. Tatsächlich dürfte die Quote sogar noch höher sein. Kreidezähne sind besonders kariesanfällig und bedürfen bei schwerer Ausprägung lebenslang einer Behandlung."
}
},
"picture": {
"content": {
"sources": [
{
"media": "(max-width: 640px)",
"srcset": "../../images/1x1/eltern-baby-tablet-1000x1000.jpg"
},
{
"media": "(min-width: 641px)",
"srcset": "../../images/1x1/eltern-baby-tablet-1000x1000.jpg"
}
],
"img": {
"src": "../../images/1x1/eltern-baby-tablet-1000x1000.jpg",
"alt": "Dies ist ein alternativ Text"
}
}
}
}
},
{
"switches": {
"isLinkable": false,
"hasTeaserText": true,
"hasTeaserHeadlineAsLink": true,
"hasTextChevron": true,
"hasTeaserContentWrapper": false,
"hasPictureWithSrcset": true,
"isColumnPosition": 2
},
"viewtypes": {
"specifier": ""
},
"content": {
"headline": "2 Selbstständige (4:3)"
},
"partials": {
"teaserText": {
"content": {
"text": "With the foundation in place, it was just a matter of putting it into practice. We started by working with the architects to identify the logical assembly points for the 6 logical locations of the Eventbrite platform"
}
},
"picture": {
"content": {
"sources": [
{
"media": "(max-width: 640px)",
"srcset": "../../images/1x1/eltern-baby-tablet-1000x1000.jpg"
},
{
"media": "(min-width: 641px)",
"srcset": "../../images/4x3/promenade.jpg"
}
],
"img": {
"src": "../../images/4x3/promenade.jpg",
"alt": ""
}
}
}
}
},
{
"switches": {
"isLinkable": false,
"hasTeaserText": true,
"hasTeaserHeadlineAsLink": true,
"hasTextChevron": true,
"hasTeaserContentWrapper": false,
"hasPictureWithSrcset": true,
"isColumnPosition": 1
},
"viewtypes": {
"specifier": ""
},
"content": {
"headline": "3 Selbstständige (1:1)"
},
"partials": {
"teaserText": {
"content": {
"text": "With the foundation in place, it was just a matter of putting it into practice. We started by working with the architects to identify the logical assembly points for the 6 logical locations of the Eventbrite platform"
}
},
"picture": {
"content": {
"sources": [
{
"media": "(max-width: 640px)",
"srcset": "../../images/1x1/eltern-baby-tablet-1000x1000.jpg"
},
{
"media": "(min-width: 641px)",
"srcset": "../../images/1x1/eltern-baby-tablet-1000x1000.jpg"
}
],
"img": {
"src": "../../images/1x1/eltern-baby-tablet-1000x1000.jpg",
"alt": ""
}
}
}
}
},
{
"switches": {
"isLinkable": false,
"hasTeaserText": true,
"hasTeaserHeadlineAsLink": true,
"hasTextChevron": true,
"hasTeaserContentWrapper": false,
"hasPictureWithSrcset": true,
"isColumnPosition": 2
},
"viewtypes": {
"specifier": ""
},
"content": {
"headline": "4 Selbstständige (5:7)"
},
"partials": {
"teaserText": {
"content": {
"text": "With the foundation in place, it was just a matter of putting it into practice. We started by working with the architects to identify the logical assembly points for the 6 logical locations of the Eventbrite platform"
}
},
"picture": {
"content": {
"sources": [
{
"media": "(max-width: 640px)",
"srcset": "../../images/1x1/eltern-baby-tablet-1000x1000.jpg"
},
{
"media": "(min-width: 641px)",
"srcset": "../../images/5x7/eltern-mit-kindern.jpg"
}
],
"img": {
"src": "../../images/5x7/eltern-mit-kindern.jpg",
"alt": "Dies ist ein alternativ Text"
}
}
}
}
}
],
"richtext": {
"switches": {
"hasDefaultText": false
},
"content": {
"text": "<p>With the foundation in place, it was just a matter of putting it into practice. We started by working with the architects to identify the logical assembly points for the 6 logical locations of the Eventbrite platform.”</p>"
}
},
"button": {
"switches": {
"asLink": true
},
"viewtypes": {
"specifier": "btn--primary"
},
"content": {
"label": "Hier zu den Neuigkeiten"
}
}
}
}
Headline Tag is default rendered as a H3, but styling is controlled by headlineSpecifier.