SeedProd-Dokumentation

Dokumentation, Referenzmaterialien und Tutorials für SeedProd

Sternbewertungsblock

Mit dem Block „Sternbewertung“ können Sie auf jeder SeedProd-Seite eine visuelle Sternbewertung anzeigen. Ganz gleich, ob Sie ein Produkt bewerten, eine Dienstleistung benoten oder einem Testimonial mehr Glaubwürdigkeit verleihen möchten – der Block rendert eine Reihe gefüllter Sternsymbole neben einer optionalen Textbeschriftung und vermittelt Besuchern so auf einen Blick ein sofort erkennbares Qualitätssignal.

Sie haben die volle Kontrolle über die Skala (0–5 oder 0–10), den genauen Bewertungswert und die Größe und den Abstand der Sterne. In Kombination mit Typografie- und Farboptionen lässt sich der Block „Sternbewertung“ nahtlos an jedes Designsystem anpassen, von auffälligen Marketingseiten bis hin zu minimalistischen Bewertungslayouts.

Sternbewertungsblock mit fünf ausgefüllten goldenen Sternen und einer Beschriftung auf einer SeedProd-Seite

Anforderungen: Der Star Rating Block ist in allen unseren Lizenzplänen verfügbar.


Hinzufügen des Sternbewertungsblocks zu Ihren Seiten

Befolgen Sie diese Schritte, um einen Sternbewertungsblock zu Ihrer SeedProd-Seite hinzuzufügen:

Schritt 1: Block hinzufügen

Ziehen Sie unter „Design“ > „Blöcke“ den Block „Sternbewertung“ per Drag & Drop in den gewünschten Abschnitt Ihrer Seite.

Den Block „Sternbewertung“ auf eine SeedProd-Seite ziehen

Schritt 2: Inhaltseinstellungen konfigurieren

Klicken Sie nach dem Hinzufügen auf den Block „Sternbewertung“, um dessen Einstellungen zu öffnen. Konfigurieren Sie auf der Registerkarte „Inhalt“ die Anzeige der Bewertung im Abschnitt „Sternbewertung “:

  • Skala: Wählen Sie aus dem Dropdown-Menü zwischen einer Bewertungsskala von 0–5 oder 0–10.
  • Bewertung: Stellen Sie den genauen Bewertungswert mit dem Schieberegler ein. Der verfügbare Bereich passt sich entsprechend der von Ihnen gewählten Skala an – bis zu 5 oder bis zu 10 in Schritten von 0,5.
  • Bezeichnung: Geben Sie eine optionale Textbezeichnung ein, die neben den Sternen angezeigt werden soll, z. B. die Anzahl der Bewertungen oder eine kurze Beschreibung (z. B. „4,5 von 5“).
  • Ausrichtung: Legen Sie die horizontale Ausrichtung der Sternreihe fest – links, mittig oder rechts – mit gerätespezifischer Steuerung für Desktop, Tablet und Mobilgeräte.
  • Größe: Passen Sie die Symbolgröße mit dem Schieberegler (0–100 px) an, um Ihre Sterne größer oder kleiner zu machen.
  • Abstand zwischen: Steuern Sie den Abstand zwischen den einzelnen Sternsymbolen mit dem Schieberegler (1–100 px).
Einstellungen der Registerkarte „Inhalt“ des Blocks „Sternebewertung“ mit Steuerelementen für Skala, Bewertung, Beschriftung, Größe und Abstand

Schritt 3: Design anpassen

Auf der Registerkarte „Erweitert“ können Sie das Erscheinungsbild Ihres Sternbewertungsblocks anpassen. Der Abschnitt „Stile“ enthält die folgenden Optionen:

  • Typografie: Legen Sie die Schriftart, Größe, Schriftstärke, den Stil, die Zeilenhöhe, den Zeichenabstand und die Groß-/Kleinschreibung für den Beschriftungstext fest.
  • Sternfarbe: Wählen Sie die Füllfarbe für die Sternsymbole (Standard ist Gold).
  • Textfarbe: Legen Sie die Farbe des neben den Sternen angezeigten Beschriftungstextes fest.

Die Registerkarte „Erweitert“ enthält außerdem Steuerelemente für Abstände (Rand und Innenabstand), benutzerdefinierte CSS-Attribute, Gerätesichtbarkeit und Eintrittsanimationen.

Block „Sternebewertung“ Registerkarte „Erweitert“ mit Abschnitt „Stile“ und Optionen für Typografie, Sternfarbe und Textfarbe

Schritt 4: Speichern Sie Ihre Änderungen

Wenn Sie die Konfiguration des Sternbewertungsblocks und die Anpassung seines Erscheinungsbilds abgeschlossen haben, speichern Sie Ihre Arbeit.


Sie haben erfolgreich einen Sternbewertungsblock zu Ihrer Seite hinzugefügt! Verwenden Sie ihn in Erfahrungsberichten, Produktbewertungen, Fallstudien oder überall dort, wo Sie Qualität und Glaubwürdigkeit auf einen Blick vermitteln möchten. Experimentieren Sie mit verschiedenen Größen, Farben und Beschriftungstexten, um eine Sternbewertung zu erstellen, die sich natürlich in Ihr Seitendesign einfügt.

Verwandte Artikel