Google-Bewertungen auf der Website einbinden

Google Bewertungen

Was sind Google-Bewertungen?

Google-Bewertungen sind Beurteilungen, die Google-Nutzer auf Google fĂŒr dich bzw. dein Yogastudio abgegeben haben. Diese bestehen aus einer Sternebewertung (1 – 5 Sterne) und optional auch einem Beurteilungstext. Da so gut wie jeder Smartphonenutzer (Android) auch einen  Google-Account hat, sind diese Bewertungen sehr verbreitet. 

Wie kann man Google-Bewertungen erhalten?

Um bei Google bewertet werden zu können, sollte man sein Yogastudio bei Google registrieren. Das Ganze ist kostenlos und erhöht mit Sicherheit auch deine Reichweite. NĂ€here Informationen dazu wird es in einem spĂ€teren Artikel geben. Bis dahin könnt ihr euch aber schon bspw. ĂŒber folgenden Link informieren: Google My Business

Google-Bewertungen auf der eigenen Website einbinden

Wenn du ein paar Bewertungen gesammelt hast und diese auf deiner Website einbinden möchtest, hast du verschiedene Möglichkeiten. Ich werde eine davon vorstellen und genau erklĂ€ren, wie die Einbindung funktioniert. Dies ist leider nicht ganz einfach, aber mit etwas Geduld kommt man ins Ziel 😉

Datenschutz

Es gibt diverse WordPress-Plugins, die die Daten in Echtzeit von Google abrufen. Oftmals werden dabei aber die Daten der BesucherInnen an Google ĂŒbertragen. In meiner Anleitung zeige ich einen Weg auf, wie die Bewertungen DSGVO-konform – also Datenschutz-freundlich – eingebunden werden können. Das Ganze funktioniert so, dass das Plugin die Bewertungen in einem festgelegten Intervall (stĂŒndlich, tĂ€glich, wöchentlich, etc.) von Google abruft und diese dann in einer eigenen Datenbank auf deiner Webspace speichert. So werden beim Aufruf deiner Website die Daten aus deiner Datenbank geladen und nicht direkt von Google abgerufen.

Anleitung zum Einbinden der Google-Bewertungen

Google Bewertung - Beispiel

Auf dem Beispielbild siehst du, wie das Ganze auf deiner Website aussehen könnte. Es gibt natĂŒrlich auch andere Möglichkeiten, bspw. mit Anzeige der Bewertungstexte.

Nun aber zum Vorgehen:

Plugin installieren

Ich habe mich fĂŒr das kostenlose Plugin Reviews and Rating – Google My Business entschieden. Es ist einfach einzurichten, bietet etliche verschiedene Designs an und ĂŒbermittelt die IP-Adresse der Websitebesucher nicht an fremde Server.

Installiere das Plugin ganz normal in WordPress. Rufe anschließend die Einstellungsseite unter „Einstellungen“ -> „Reviews and Rating – Google My Business“ auf. Diese benötigst du spĂ€ter.

Bei Google registrieren

Wenn du noch keinen Google-Account hast, lege diesen kostenfrei an: Google-Konto einrichten

Projekt anlegen

Rufe die Entwicklerkonsole auf: Entwicklerkonsole

Klicke dann oben links auf das NavigationsmenĂŒ und klicke auf „Abrechnung“.

Hier musst du ein Abrechnungskonto erstellen. Das ist kostenlos, zur Verifizierung musst du aber deine Bankkartendaten hinterlegen. 

Wenn du damit durch bist, gehe wieder in die Entwicklerkonsole und klicke auf den Button „Projekt erstellen“.

Hier musst du nichts weiter eintragen, sondern brauchst nur auf den Button „Erstellen“ klicken.

SicherheitsschlĂŒssel anlegen

Klicke wieder oben links auf das NavigationsmenĂŒ und wĂ€hle den Punkt „Marketplace“ aus. Suche dort nach „Places API“:

 

Klicke auf das Ergebnis und anschließend auf den Button „Aktivieren“.

WĂ€hle dann im NavigationsmenĂŒ oben links den Punkt „APIs & Dienste“ -> „Anmeldedaten“ aus.

Klicke auf den Button „Anmeldedaten erstellen“ -> „API-SchlĂŒssel“.

Es öffnet sich ein Popup. Klicke dort auf „SchlĂŒssel einschrĂ€nken“:

Klicke unter dem Bereich „AnwendungsbeschrĂ€nkungen“ auf den Punkt „IP-Adressen (Webserver, Cronjobs usw.)“.

Es öffnet sich der Bereich“Anfragen von diesen Server-IP-Adressen annehmen“ klicke dort auf den Button „HinzufĂŒgen“ und trage die IP-Adresse ein, die dir auf deiner Website unter den Plugineinstellungen angegeben wird.

Unter dem Punkt „API-EinschrĂ€nkungen“ musst du dann „SchlĂŒssel einschrĂ€nken“ aktivieren und „Places API“ auswĂ€hlen.

Dann auf „Speichern“ klicken.

Anschließend musst du den SchlĂŒssel, der dir angezeigt wird, kopieren und in WordPress unter den Einstellungen des Plugins hinterlegen:

Google Place-ID ermitteln

Damit das Plugin weiß, von welchem Unternehmen die Bewertungen eingebunden werden sollen, benötigst du noch die Place-ID. DafĂŒr auf der Seite Google Place ID Finder die Adresse deines Studios eingeben und die ermittelte Place-ID kopieren und auf der Einstellungsseite des Plugins (siehe Screenshot oben) eingeben.

Shortcode einbinden

Jetzt kannst du dir einen Shortcode aussuchen und bspw. in Elementor ĂŒber das Shortcode-Element einbinden.

Die Übersicht der möglichen Shortcodes findest du hier:

Shortcode-Übersicht (Tipp: Oben sind mehrere Bereiche, z.B. „Bubbles, outlined“ – diese Buttons fĂŒhren zu unterschiedlichen Beispielen)

Im Plugin selbst habe ich dann keine weiteren Einstellungen vorgenommen.

Beispiel 1 (mit Farbhintergrund)

Google Bewertung einbinden - Beispiel

Um diese Anzeige bei dir auf der Seite einzubauen, benötigst du folgenden Shortcode:

[reviews_rating theme="badge tiny narrow" class="fill stripe contrast" place_id="ChIJeRbAZb31pUcRIWcHFGgAfPM" name="Bewertungen" summary="name, rating, stars" html_tags="h3" limit=0 reviews_link="Bewertungen anzeigen" write_review_link="Eine Bewertung schreiben"]

Die place_id musst du natĂŒrlich durch deine eigene Place-ID ersetzen. Mit Elementor habe ich dann noch den folgenden CSS-Code direkt am Element hinterlegt:

.google-business-reviews-rating.stripe.contrast > *:nth-child(2n-1) {
background-color: #B23C33;
}

.menu-toggle, button, .ast-button, .ast-custom-button, .button, input#submit, input[type="button"], input[type="submit"], input[type="reset"] {
border-color: #b23c33;
background-color: #54595F;
white-space: pre;
line-height: 3;
}

.google-business-reviews-rating.stripe.badge.tiny > *:last-child {
padding-top: 20px;
}

Beispiel 2 (transparenter Hintergrund)

Google Bewertung - Beispiel

Mit diesem Code kannst du eine Box einfĂŒgen, die transparent mit einem leichten dunklen Ton ist. So hebt sie sich etwas vom Hintergrund ab, fĂŒgt sich aber charmant in das Gesamtbild ein.

FĂŒr dieses Beispiel benötigst du ebenfalls den Shortcode aus dem ersten Beispiel.

Damit die folgenden CSS-Einstellungen sich nicht auf deine gesamte Seite auswirken, sondern nur auf den Shortcode, musst du eine CSS-Klasse hinterlegen. In Elementor geht das ganz einfach ĂŒber die Erweiterten Shortcode-Einstellungen. Hinterlege dort „reviewboxa“:

Anschließend kannst du folgenden CSS-Code fĂŒr den Shortcode hinterlegen:

.google-business-reviews-rating.stripe.contrast > *:nth-child(2n-1) {
background-color: hsla(0, 0%, 0%, 0.1);
}
.google-business-reviews-rating.fill {
background-color: rgba(255, 255, 255, 0.1);
}

.menu-toggle, button, .ast-button, .ast-custom-button, .button, input#submit, input[type=“button“], input[type=“submit“], input[type=“reset“] {
background-color: rgba(0,0,0,0.05);
white-space: pre;
line-height: 3;
}

.google-business-reviews-rating.stripe.badge.tiny > *:last-child {
padding-top: 20px;
}

.reviewboxa a {
color: #ffffff;
padding: 8px;
font-size: 16px;
}

.reviewboxa a:hover {
background-color: #93C500);
}

Möchtest du zusĂ€tzlich noch die Schriftart anpassen, fĂŒge nnoch folgenden CSS-Code hinzu und Ă€ndere den Namen „Karla“ auf den Namen deiner verwendeten Schriftart:

.google-business-reviews-rating.stripe.badge.tiny > *:first-child {
font-family: 'Karla';
}

.reviewboxa a {
font-family: 'Karla';
}

Einfachere Möglichkeiten?

Kennst du eine einfachere Möglichkeit, um Google-Bewertungen DSGVO-konform auf einer WordPress-Seite einzubinden? Dann schreibe gern einen Kommentar 😉

Schreibe einen Kommentar

Abonnieren
Benachrichtige mich bei
3 Kommentare
Älteste oben
Neueste oben
Inline Feedbacks
View all comments

Hallo,
vielen Dank fĂŒr die Anleitung, ich war noch auf der Suche nach einer Möglichkeit, ohne dass jedes Mal zu Google verbunden wird, wenn die Webseite aufgerufen wird.
Viele GrĂŒĂŸe
Jan

Eine ganz tolle ErklĂ€rung und Anleitung – dennoch unfassbar kompliziert, gerade was Google API und Co. angeht. Ich habe es nun einmal ausprobiert und bin grandios gescheitert – obwohl ich mich recht gut in WordPress und Google auskenne.
Was hĂ€ltst du von dem Plugin „Widgets fĂŒr Google Review“ (https://de.wordpress.org/plugins/wp-reviews-plugin-for-google/)? Ich konnte leider noch nicht rausfinden, ob es DSGVO-konform ist, bzw. ob und was ich bei Borlabs Cookie dort hinzufĂŒgen muss ggf…

Die mit Sternchen (*) gekennzeichneten Verweise sind sogenannte Provision-Links. Wenn du auf so einen Verweislink klickst und ĂŒber diesen Link einkaufst, bekomme ich von deinem Einkauf eine Provision. FĂŒr dich verĂ€ndert sich der Preis nicht. 

3
0
Hast du Fragen? Dann schreibe einen Kommentar ;-)x
()
x
Newsletter abonnieren

Erhalte regelmĂ€ĂŸig Informationen zu neuen Tipps und Tutorials.