> For the complete documentation index, see [llms.txt](https://one-loop.gitbook.io/help/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://one-loop.gitbook.io/help/plattform/one-loop-plattform/websites-und-leadgewinnung/websites-und-funnels/kundenstimmen-mit-dem-testimonial-element-auf-seiten-darstellen.md).

# Kundenstimmen mit dem Testimonial-Element auf Seiten darstellen

Stelle echte, freigegebene Rückmeldungen als übersichtliche Karten auf einer Website oder in einem Funnel dar. Das **Testimonial-Element** wird vollständig von dir gepflegt: Text, Reihenfolge und Gestaltung bleiben in deiner Hand.

## Was das Element für dich erledigt

Eine Kundenstimme kann Besuchern helfen, eine Leistung oder ein Angebot besser einzuordnen. Mit dem Testimonial-Element fasst du mehrere Rückmeldungen an einer Stelle zusammen und entscheidest selbst, welche Angaben auf den Karten sichtbar sind.

Das Element ruft **keine** Bewertungen aus externen Quellen ab und aktualisiert sich nicht automatisch. Es ist ein manuell gepflegter, statischer Seitenbereich. Wenn sich eine Aussage ändert, eine Freigabe zurückgezogen wird oder ein Bild ersetzt werden soll, passt du den Eintrag direkt im Element an.

> Verwende nur Aussagen, Namen, Bilder und Logos, die du veröffentlichen darfst. Prüfe die Inhalte vor jeder Veröffentlichung noch einmal auf Richtigkeit und Aktualität.

## Bevor du beginnst

Bereite pro Kundenstimme am besten diese Informationen vor:

| Angabe              | Wofür sie verwendet wird                       | Worauf du achten solltest                                         |
| ------------------- | ---------------------------------------------- | ----------------------------------------------------------------- |
| Aussage             | Der eigentliche Text der Rückmeldung           | Kürze nur, ohne die Aussage zu verfälschen.                       |
| Name                | Macht die Stimme nachvollziehbar               | Verwende nur den vereinbarten Namen.                              |
| Zusatzzeile         | Zum Beispiel Rolle, Tätigkeit oder Unternehmen | Lass sie weg, wenn sie nicht nötig oder nicht freigegeben ist.    |
| Datum               | Ordnet die Rückmeldung zeitlich ein            | Prüfe, ob es zum Veröffentlichungszeitpunkt noch passend ist.     |
| Sternebewertung     | Zeigt eine Bewertung von 1 bis 5 Sternen       | Nutze sie nur, wenn sie der tatsächlichen Rückmeldung entspricht. |
| Profilbild und Logo | Ergänzen die Karte optisch                     | Verwende nur freigegebene, gut erkennbare Dateien.                |

Überlege außerdem, ob Besucher die Stimmen in einer festen Reihenfolge lesen sollen. Bei wenigen, besonders wichtigen Aussagen ist eine einfache Reihenfolge meist verständlicher als viele ähnlich aussehende Karten.

## Element auf einer Seite einfügen

1. Öffne die gewünschte Website oder den gewünschten Funnel und starte den Seiteneditor.
2. Öffne links **Schnell hinzufügen** über das Pluszeichen.
3. Wechsle zu den Elementen und suche nach **Testimonials**.
4. Ziehe das Element an die Stelle, an der die Kundenstimmen erscheinen sollen.
5. Klicke das eingefügte Element an. Rechts öffnet sich sein Einstellungsbereich.
6. Speichere die Seite, bevor du mit der inhaltlichen Pflege beginnst.

Das Element hat im Editor eine eigene Markierung. Erst wenn du es auswählst, siehst du rechts die Bereiche **Kundenstimmen**, **Testimonial-Einstellungen**, **Layout**, **Kartenstil**, **Größe** und **Farbe**.

## Erste Kundenstimme anlegen

1. Wähle im rechten Bereich **Kundenstimmen**.
2. Klicke auf **Testimonial hinzufügen**.
3. Öffne den neuen Eintrag über das Stiftsymbol.
4. Fülle die verfügbaren Felder aus.
5. Wähle **Fertig**, wenn die Angaben geprüft sind.
6. Speichere und kontrolliere die Karte direkt im Seiteneditor.

Im Bearbeitungsfenster können folgende Angaben sichtbar sein:

| Feld                 | Bedeutung                                        | Praktische Empfehlung                                                            |
| -------------------- | ------------------------------------------------ | -------------------------------------------------------------------------------- |
| **Inhalt**           | Der Text der Kundenstimme                        | Beginne mit der konkreten Erfahrung, nicht mit einer allgemeinen Werbeaussage.   |
| **Sternebewertung**  | Bewertung von 1 bis 5 Sternen                    | Übernimm nur die tatsächlich gegebene Bewertung.                                 |
| **Name**             | Name der Person hinter der Aussage               | Halte Schreibweise und Freigabe ein.                                             |
| **Zusatzzeile**      | Ergänzende Einordnung, etwa Rolle oder Tätigkeit | Hilft beim Kontext, ist aber nicht zwingend.                                     |
| **Datum**            | Datum der Kundenstimme                           | Nutze es nur, wenn die zeitliche Einordnung nützlich ist.                        |
| **Profilbild**       | Bild der Person                                  | Prüfe Bildrechte und ob das Bild auch auf kleinen Bildschirmen erkennbar bleibt. |
| **Profil-URL**       | Verweis auf ein öffentliches Profil              | Hinterlege nur eine erreichbare, freigegebene Adresse.                           |
| **Unternehmens-URL** | Verweis auf eine Unternehmensseite               | Prüfe Zieladresse und Einwilligung.                                              |
| **Logo**             | Logo auf der Karte                               | Verwende ein gut lesbares, freigegebenes Logo.                                   |

Beim Profilbild kann die Option **Bild optimieren** sichtbar sein. Prüfe nach dem Speichern in der Vorschau, ob der Bildausschnitt die Person noch sinnvoll zeigt.

## Einträge bearbeiten, sortieren oder entfernen

Im Bereich **Kundenstimmen** siehst du alle angelegten Einträge untereinander.

* Über den **Ziehgriff** links an einem Eintrag änderst du seine Reihenfolge.
* Über das **Stiftsymbol** öffnest du die Bearbeitung.
* Über das **Papierkorb-Symbol** entfernst du einen Eintrag.

Sortiere nicht nur nach dem neuesten Datum. Platziere zuerst die Kundenstimme, die das wichtigste Thema der Seite verständlich ergänzt. Prüfe nach jeder Umordnung die Vorschau: Bei einem Karussell ist die Reihenfolge besonders wichtig, weil Besucher zunächst nur eine Karte sehen.

## Sichtbare Angaben gezielt ein- oder ausblenden

Unter **Testimonial-Einstellungen** steuerst du, welche Informationen auf allen Karten dieses Elements angezeigt werden.

| Schalter                     | Wirkung auf die Karte                    | Wann sinnvoll                                                         |
| ---------------------------- | ---------------------------------------- | --------------------------------------------------------------------- |
| **Profilbild anzeigen**      | Blendet das Bild der Person ein oder aus | Einblenden, wenn ein freigegebenes und gut erkennbares Bild vorliegt. |
| **Name anzeigen**            | Zeigt oder verbirgt den Namen            | Ausblenden, wenn eine Aussage nur anonym veröffentlicht werden darf.  |
| **Zusatzzeile anzeigen**     | Zeigt oder verbirgt Rolle oder Tätigkeit | Hilfreich, wenn sie der Aussage Glaubwürdigkeit und Kontext gibt.     |
| **Logo anzeigen**            | Zeigt oder verbirgt das zugeordnete Logo | Nur einsetzen, wenn die Verwendung ausdrücklich erlaubt ist.          |
| **Datum anzeigen**           | Zeigt oder verbirgt das Datum            | Sinnvoll bei aktuellen, zeitlich einzuordnenden Rückmeldungen.        |
| **Sternebewertung anzeigen** | Zeigt oder verbirgt die Bewertung        | Nur sichtbar lassen, wenn sie den Inhalt nicht überbetont.            |

Diese Schalter ändern die Darstellung des ausgewählten Elements. Sie löschen die hinterlegten Daten nicht. Schalte eine Angabe erst aus, wenn du geprüft hast, ob die Karte ohne sie noch verständlich und glaubwürdig wirkt.

## Passendes Layout wählen

Unter **Layout** stehen drei Anordnungen zur Verfügung:

| Layout                   | Darstellung                                                   | Gut geeignet für                                                                     |
| ------------------------ | ------------------------------------------------------------- | ------------------------------------------------------------------------------------ |
| **Raster**               | Gleichmäßig angeordnete Karten                                | Kurze bis mittel lange Aussagen, die schnell vergleichbar sein sollen.               |
| **Vertikales Mauerwerk** | Karten werden abhängig von ihrer Texthöhe versetzt angeordnet | Unterschiedlich lange Aussagen, bei denen keine großen Leerflächen entstehen sollen. |
| **Karussell**            | Mehrere Karten wechseln innerhalb eines Bereichs              | Wenige ausgewählte Stimmen, wenn auf der Seite wenig Platz zur Verfügung steht.      |

Zusätzlich kannst du die **Spalten** und den **Abstand** zwischen Karten einstellen. Die sichtbare Spaltenauswahl reicht von 0 bis 4. Welche Darstellung ein bestimmter Wert auf deiner Seite erzeugt, prüfst du direkt in der Vorschau; die Quelle beschreibt keine besondere Bedeutung des Werts 0.

Wähle ein Raster, wenn Besucher mehrere Aussagen auf einen Blick vergleichen sollen. Wähle ein Karussell nur, wenn die Bedienung auf dem Smartphone gut verständlich bleibt. Sehr lange Texte passen meist besser in ein vertikales Mauerwerk oder in weniger, breitere Karten.

## Kartenstil, Größe und Farbe einstellen

Unter **Kartenstil** wählst du die Grundanordnung innerhalb jeder Karte:

| Kartenstil          | Anordnung                                     |
| ------------------- | --------------------------------------------- |
| **Standard**        | Inhalt oben, Profilbild oder Bild darunter.   |
| **Reverse Center**  | Bild zentriert oberhalb des Textes.           |
| **Vertical Center** | Bild zentriert unterhalb des Textes.          |
| **Horizontal**      | Profilbereich und Kundenstimme nebeneinander. |

Die sichtbaren Stiloptionen umfassen außerdem:

* **Eckenradius** für rundere oder kantigere Karten,
* **Größe der Sternebewertung**,
* **Schriftgröße des Inhalts** und der Autorenangabe,
* **kursiver Inhalt**,
* **Schriftfamilie für Inhalt** und **Schriftfamilie für die Autorenangabe**,
* **Größe** und **Farbe** als zusätzliche Bereiche im rechten Einstellungsfenster.

Gestalte die Karten zurückhaltend. Ein Stil mit sehr vielen Farben, großen Sternen und mehreren Logos konkurriert mit der eigentlichen Aussage. Prüfe insbesondere Kontrast, Lesbarkeit und genügend Abstand zwischen den Karten.

## Lange Kundenstimmen verständlich halten

Lange Einträge können auf der Karte gekürzt erscheinen und über einen Link zum Weiterlesen geöffnet werden. Es gibt laut Quelle keine feste Zeichenbegrenzung. Das bedeutet nicht, dass unbegrenzt lange Texte sinnvoll sind.

Schreibe oder kürze eine Kundenstimme so, dass der erste sichtbare Satz bereits die wichtigste Erfahrung vermittelt. Prüfe anschließend, ob die Karte mit einem möglichen Weiterlesen-Link auf Desktop und Smartphone noch ruhig und nachvollziehbar wirkt.

## Darstellung auf verschiedenen Geräten prüfen

1. Speichere die Seite.
2. Wechsle im Editor nacheinander in die Ansicht für Desktop, Tablet und Smartphone.
3. Prüfe, ob Karten, Bilder, Sterne und Texte ohne Abschneiden sichtbar sind.
4. Kontrolliere bei einem Raster die Spaltenzahl und den Kartenabstand.
5. Kontrolliere bei einem Karussell, ob Besucher die weiteren Karten erkennen und erreichen können.
6. Öffne die Vorschau oder die veröffentlichte Seite zusätzlich in einem privaten Browserfenster.

Achte besonders darauf, dass lange Zusatzzeilen, Profilbilder und Logos auf kleinen Bildschirmen nicht wichtiger wirken als die Kundenstimme selbst.

## Praxisbeispiel: Drei Rückmeldungen auf einer Terminseite

Eine Beratungsseite soll vor der Terminbuchung Vertrauen schaffen.

1. Das Team sammelt drei freigegebene Rückmeldungen und prüft zu jeder die Aussage, Namensform, Sterne, das Datum und das Profilbild.
2. Im Seiteneditor fügt es unterhalb der Leistungsbeschreibung ein Testimonial-Element ein.
3. Es legt die drei Einträge an und sortiert zuerst die Aussage, die am besten zur angebotenen Beratung passt.
4. Für alle Karten werden Name, Zusatzzeile und Sterne sichtbar gelassen; Datum und Logo bleiben ausgeblendet, weil sie in diesem Fall keinen zusätzlichen Nutzen bringen.
5. Das Team wählt **Raster** mit drei Karten und einem gut erkennbaren Abstand.
6. Anschließend prüft es die Smartphone-Ansicht. Dort werden die Karten lesbar angezeigt und die längste Aussage lässt sich bei Bedarf über **Mehr lesen** öffnen.
7. Erst nach der letzten Freigabe veröffentlicht das Team die Seite.

Das Ergebnis ist ein klarer, manuell kontrollierter Bereich mit Kundenstimmen, ohne dass sich Inhalte aus einer externen Quelle unbemerkt verändern.

## Häufige Fragen und Fehler

### Werden Kundenstimmen automatisch übernommen?

Nein. Dieses Element arbeitet nur mit manuell angelegten Einträgen. Aktualisiere oder entferne jede Änderung selbst im Seiteneditor.

### Die Reihenfolge der Karten passt nicht

Öffne **Kundenstimmen** und ziehe den betroffenen Eintrag am Ziehgriff an die gewünschte Position. Prüfe danach die Vorschau, besonders bei einem Karussell.

### Eine Karte wirkt unruhig oder überladen

Blende nicht notwendige Angaben aus. Beginne mit Logo, Datum oder Sternebewertung, wenn sie für die konkrete Aussage keinen Mehrwert bringen. Reduziere anschließend Farben und prüfe die Schriftgröße.

### Ein langes Zitat ist auf dem Smartphone schwer lesbar

Kürze die Aussage inhaltlich sauber, wähle weniger Spalten oder teste ein anderes Layout. Prüfe außerdem, ob der Link zum Weiterlesen sichtbar und verständlich bleibt.

### Ein Profilbild oder Logo sieht falsch aus

Öffne den Eintrag über das Stiftsymbol, prüfe die hinterlegte Datei oder Adresse und speichere erneut. Kontrolliere anschließend den Bildausschnitt in der Vorschau.

## Kurzcheck vor der Veröffentlichung

* [ ] Für jede Aussage liegt eine Freigabe für Text, Name, Bild und Logo vor.
* [ ] Inhalt, Sternebewertung und Datum entsprechen der tatsächlichen Rückmeldung.
* [ ] Die Reihenfolge der Karten unterstützt den Seiteninhalt.
* [ ] Sichtbare Angaben sind bewusst gewählt und nicht nur vollständig eingeblendet.
* [ ] Layout, Spalten und Abstand sind auf Desktop, Tablet und Smartphone geprüft.
* [ ] Lange Aussagen bleiben auch mit Weiterlesen-Funktion verständlich.
* [ ] Die veröffentlichte oder Vorschau-Seite wurde in einem privaten Browserfenster kontrolliert.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://one-loop.gitbook.io/help/plattform/one-loop-plattform/websites-und-leadgewinnung/websites-und-funnels/kundenstimmen-mit-dem-testimonial-element-auf-seiten-darstellen.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.