Optimale Sterne-Bewertung in Elementor für WordPress

Die Sterne-Bewertung ist ein wertvolles Tool, um die Meinung deiner Nutzer zu deinen Produkten oder Dienstleistungen visuell darzustellen. Sie steigert die Glaubwürdigkeit und kann potenziellen Kunden helfen, eine fundierte Entscheidung zu treffen. In dieser Anleitung lernst du, wie du die Sterne-Bewertung in Elementor einfach implementieren und gestalten kannst.

Wichtigste Erkenntnisse

• Die Sterne-Bewertung kann mit der Iconbox oder Bilderbox kombiniert werden.
• Du kannst die Skala der Bewertung sowie das Aussehen der Sterne anpassen.
• Die Sterne können auch halbe Werte darstellen, um präzisere Bewertungen anzuzeigen.
• Verlinkung und ansprechende Gestaltung sind entscheidend für die Nutzererfahrung.

Schritt 1: Auswahl der Sterne-Bewertung

Um die Sternebewertung in Elementor hinzuzufügen, wähle zunächst das passende Widget. Gehe im Elementor-Editor auf „Widgets“ und suche nach „Sternebewertung“. Sobald du das Widget gefunden hast, kannst du es einfach per Drag-and-Drop an die gewünschte Stelle auf deiner Seite ziehen.

Schritt 2: Bewertungsskala festlegen

Im Einstellungsbereich der Sterne-Bewertung kannst du entscheiden, welche Skala du verwenden möchtest. Standardmäßig stehen dir zwei Optionen zur Verfügung: eine Skala von 0 bis 5 oder von 0 bis 10. Wähle die für deine Seite passende Skala aus. Für diese Anleitung entscheiden wir uns für die 5-Sterne-Skala und geben eine Bewertung von 3 ein.

Schritt 3: Sterne-Design anpassen

Im nächsten Schritt kannst du das Design der Sterne anpassen. Wähle zwischen verschiedenen Icon-Stilen, wie „Font Awesome“ oder „Unicode“. Je nach deinem Seitendesign kannst du die Icons auswählen, die am besten passen. In dieser Anleitung verwenden wir „Font Awesome“ für eine modernere Darstellung.

Schritt 4: Füllung der Sterne konfigurieren

Du hast die Möglichkeit, die Füllung der Sterne anzupassen. Hier kannst du entscheiden, ob die Sterne voll ausgefüllt oder nur mit Konturen angezeigt werden. Wenn du beispielsweise zwei Sterne voll abdecken möchtest, kannst du die Einstellung so anpassen, dass weniger als die Hälfte oder nur die Kontur ausgefüllt ist. Für diese Demo wählen wir voll ausgefüllte Sterne.

Schritt 5: Titel und Ausrichtung hinzufügen

Nun ist es wichtig, der Bewertung einen Titel und eine Ausrichtung zu geben. Wähle einen ansprechenden Titel wie „Mega gut“ aus, um den Nutzern eine klare Vorstellung von der Bewertung zu geben. Stelle die Ausrichtung des Textes auf „zentriert“, um ein ausgewogenes Erscheinungsbild zu erzielen.

Schritt 6: Stil und Typografie anpassen

Im nächsten Schritt kannst du das Schriftbild anpassen, um es deinem Design anzupassen. Zum Beispiel kannst du die Textfarbe, den Schriftschnitt (normal, fett oder kursiv) und sogar den Zeilenabstand zwischen dem Text und der Bewertung festlegen. Für diese Anleitung setzen wir den Schriftschnitt auf fett und erhöhen den Abstand auf 6 Pixel.

Schritt 7: Verlinkung der Sternebewertung

Um der Sternebewertung einen Kontext zu geben, ist das Hinzufügen einer Verlinkung und eines Bildes von großem Nutzen. Du kannst eine Bilderbox unterhalb der Sternebewertung einfügen, die ein relevantes Bild darstellt. Ziehe das Bilderbox-Widget in den Editor und lade ein geeignetes Bild hoch.

Schritt 8: Bild- und Textinhalt anpassen

Nachdem du das Bild hochgeladen hast, kannst du den Text dazu hinzufügen. Schreibe beispielsweise „Tobias 21“ und ergänze einen kurzen Text, der die Bewertung näher erklärt, wie „Das Buch hat mir die Augen geöffnet.“ Dies verleiht deiner Bewertung persönlichen und emotionalen Bezug.

Schritt 9: Trennlinie hinzufügen

Eine Trennlinie kann hilfreich sein, um die Bewertung visuell vom Rest des Inhalts abzugrenzen. Ziehe eine Trennlinie in deinen Editor und positioniere sie strategisch, statt direkt zwischen dem Text und der Bewertung. Passe die Größe der Trennlinie an, um einen harmonischen Abstand zu schaffen.

Zusammenfassung – Tipps zur Gestaltung der Sterne-Bewertung in Elementor

Du hast nun alle nötigen Schritte durchlaufen, um eine ansprechende Sternebewertung in Elementor hinzuzufügen. Sie steigert nicht nur die Authentizität deiner Seite, sondern hilft auch, das Nutzerengagement zu erhöhen. Achte darauf, die Bewertungen regelmäßig zu aktualisieren und Relevanz zu gewährleisten. Nutze halbe Sterne, um präzisere Bewertungen zu ermöglichen und schaffe ein ästhetisches Gesamtbild durch ansprechendes Design.