Listing Teaser Headline The headline’s size, HTML tag, and link attributes can be customized via props. Important Notes: While any size can be used, large and xlarge are recommended. Based on the structure of a particular page, the proper HTML tag should be defined via the tag prop. When using the link_attributes prop, an <a> element is wrapped around the headline text. The prop allows you to pass common link attributes such as href and target. A subheadline can be created with the subheadline prop. The prop accepts anything, even plain text. An eyebrow can be created with the eyebrow_items prop. The prop accepts an array, each eyebrow item will be separated with a solid seperator. Demo
{% include '@bolt-components-listing-teaser/listing-teaser.twig' with { eyebrow_items: [ eyebrow_1, eyebrow_2, ], headline: { text: 'This listing has an xlarge headline', tag: 'h3', size: 'xlarge', link_attributes: { href: '' }, }, subheadline: 'This is a subheadline', meta_items: [ 'Posted 8 hours 15 minutes ago', 'Last activity: 2 minutes ago', ], } only %}
Not available in plain HTML. Please use Twig.