Lorem ipsum

Lorem ipsum dolor sit

Amet, consetetur sadipscing elitr

" Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat. "


Lorem ipsum

Lorem ipsum

Dolor sit amet

" Consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. "


Consetetur sadipscing

Consetetur sadipscing

Elitr, sed diam

" At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. "


At vero eos

At vero eos

Et accusam et justo

Testimonials

Kundenstimmen

Die Testimonials-Komponente zeigt Kundenbewertungen und Erfahrungsberichte in einem ansprechenden Layout an. Die Testimonial-Cards haben einen halbtransparenten weißen Hintergrund im Light Mode, um sich farblich abzuheben.

Codebeispiel

<Testimonials
title="Lorem ipsum dolor sit"
subtitle="Amet, consetetur sadipscing elitr"
tagline="Lorem ipsum"
callToAction={{ text: 'Lorem ipsum', href: '/' }}
testimonials={[
{
testimonial: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat.',
name: 'Lorem ipsum',
job: 'Dolor sit amet',
image: { src: '~/assets/images/default.png', alt: 'Lorem ipsum' }
},
{
testimonial: 'Consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.',
name: 'Consetetur sadipscing',
job: 'Elitr, sed diam',
image: { src: '~/assets/images/default.png', alt: 'Consetetur sadipscing' }
},
{
testimonial: 'At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.',
name: 'At vero eos',
job: 'Et accusam et justo',
image: { src: '~/assets/images/default.png', alt: 'At vero eos' }
}
]}
>
<Fragment slot="bg">
<div class="absolute inset-0 bg-slate-100 dark:bg-slate-900"></div>
</Fragment>
</Testimonials>

Parameter

BezeichnerTypBeschreibungDefault
titlestringHauptüberschrift-
subtitlestringUntertitel-
taglinestringTagline über dem Titel-
callToActionobjectCall-to-Action Button-
testimonialsarrayListe der Testimonials[]
countnumberAnzahl der anzuzeigenden Testimonials3
idstringWidget-ID für Anchors-
isDarkbooleanDunkles Theme aktivierenfalse
classesobjectCSS-Klassen-Overrides{}

Fragments

BezeichnerBeschreibungDefault
defaultStandardinhalt
bgBenutzerdefinierter Hintergrund (Slot)