Produktbewertungen richtig integrieren

Die Integration der Trusted Shop Produktbewertung funktioniert ganz einfach über das Trustbadge^®. Das Beste daran: Über das Trustbadge^® ist automatisch garantiert, dass die Kunden die Produkte auch wirklich bei Ihnen gekauft haben.

Produktbewertungen integrieren in zwei Schritten:

1. Basis für das Sammeln von Produktbewertungen ist die erfolgte Integration des Trustbadge^®. Falls Sie das Trustbadge^® noch nicht integriert haben, geht es hier zur Trustbadge^®-Anleitung.
2. Für die Produktbewertungen müssen Sie zusätzlich in Schritt 3 der Trustbadge^® Integration die Produktdaten (Produkt-SKU, Produktname und Produkt-URL *) aus dem Warenkorb übergeben.

<div id="trustedShopsCheckout" style="display: none;">
<span id="tsCheckoutOrderNr">2016-05-21-001</span>
<span id="tsCheckoutBuyerEmail">my.customer@mail.com</span>
<span id="tsCheckoutOrderAmount">4005.95</span>
<span id="tsCheckoutOrderCurrency">EUR</span>
<span id="tsCheckoutOrderPaymentType">PREPAYMENT</span>
<span id="tsCheckoutOrderEstDeliveryDate">2016-05-24</span>
<!-- product reviews start -->
<!-- for each product in the basket full set of data is required -->
<span class="tsCheckoutProductItem">
<span class="tsCheckoutProductUrl">http://www.shop.url/product_page.html</span>
<span class="tsCheckoutProductImageUrl">http://www.shop.url/image.png</span>
<span class="tsCheckoutProductName">Product Name</span>
<span class="tsCheckoutProductSKU">0123456789</span>
<span class="tsCheckoutProductGTIN">0123456789</span>
<span class="tsCheckoutProductMPN">0123456789</span>
<span class="tsCheckoutProductBrand">ABCDEFGHIJ</span>
</span>
<!-- product reviews end -->
</div>


Minimal erforderlich sind tsCheckoutProductUrl, tsCheckoutProductName und tsCheckoutProductSKU. Sollten Sie den Transfer zu Google wünschen, um Produktanzeigen zu schalten, so übergeben Sie bitte auch die GTIN.

Sie sind nun startklar, ganz automatisiert Bewertungen für Ihre Produkte zu sammeln!

Zunächst gibt Ihr Kunde über das Bewertungsformular seine Shop-Bewertung mit Kommentar und Sternen ab. Dann gelangt er auf die Bestätigungsseite, wo er zusätzlich seine gekauften Produkte bewerten kann.

Erklärung:

Pflichtfelder

• tsCheckoutProductUrl: Die URL des Artikels (wichtig: korrekt, vollständig und erreichbar)
• tsCheckoutProductName: Der Produktname von der Produkt-Detailseite
• tsCheckoutProductSKU: Ihre shopeigene Produkt-Identifikationsnummer bzw. Artikelnummer (SKU)

Optionale Felder

• tsCheckoutProductImageUrl: Sie können uns hierüber Produktbilder bzw. deren URLs übermitteln
• tsCheckoutProductGTIN: Identifikationsnummer, mit der Produkte und Packstücke weltweit eindeutig identifiziert werden können, entwickelt von GS1. Wenn Sie Google Shopping nutzen und Ihre Bewertungssterne in Shopping und bezahlten Produktanzeigen ausspielen möchten, übermitteln Sie bitte die GTIN.
• tsCheckoutProductMPN: Kennzahl die das Produkt eindeutig einem bestimmten Hersteller zuordnet
• tsCheckoutProductBrand: Markenname des Produkts

Produktbewertungen im Shop anzeigen

Sie möchten Ihre gesammelten Produktbewertungen in Ihrem Shop anzeigen und so Ihre Verkäufe steigern? Dann integrieren Sie einfach unseren Produktsticker.

Der Produktsticker ist vollständig konfigurierbar. Wählen Sie Farbe und Format aus und veröffentlichen Sie Ihre Produktbewertungen direkt auf den Produktdetailseiten. Die Integration erfolgt über Einbindung des folgenden JavaScript-Codes.

<script type="text/javascript">
  _tsProductReviewsConfig = {
	tsid: 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
	sku: ['ART-123'],
	variant: 'productreviews',
        /* optional */
	borderColor: '#0DBEDC',
	backgroundColor: '#ffffff',
	locale: 'en_GB',
	starColor: '#FFDC0F',
	commentBorderColor: '#dad9d5',
	commentHideArrow: 'false',
	richSnippets: 'on',
	starSize: '15px',
	ratingSummary: 'false',
	maxHeight: '1200px',
	hideEmptySticker: 'false',
	filter: 'true',
	introtext: 'What our customers say about us:'
	
  };
  var scripts = document.getElementsByTagName('SCRIPT'),
  me = scripts[scripts.length - 1];
  var _ts = document.createElement('SCRIPT');
  _ts.type = 'text/javascript';
  _ts.async = true;
  _ts.charset = 'utf-8';
  _ts.src ='//widgets.trustedshops.com/reviews/tsSticker/tsProductSticker.js';
  me.parentNode.insertBefore(_ts, me);
  _tsProductReviewsConfig.script = _ts;
</script>

Die Parameter “TS-ID”, “variant”, “sku” und "locale" müssen Sie ausfüllen, die anderen sind optional.

Erklärung:

Pflichtfelder

• tsID: Ihre Trusted Shops ID
• variant "productreviews": Für den Produktsticker
• sku: Die Produkt-Identifikationsnummer bzw. Artikelnummer vom Hersteller (SKU)
• locale: Dieser Parameter bestimmt die Sprache des Produktstickers. Wollen Sie den Sticker in einer anderen Sprache als Deutsch ausspielen, so setzten Sie hier bitte eine andere Sprach-Land Kombination ein, z.B. en_GB für Englisch.

Es ist zudem möglich, Bewertungen für ein Produkt, das es in verschiedenen Varianten wie z.B. Farbe oder Größe gibt, gesammelt anzuzeigen. So fassen Sie die Bewertungen für Artikel in verschiedenen Ausführungen an einer Stelle zusammen. 

Geben Sie einfach die verschiedenen SKUs für den jeweiligen Artikel folgendermaßen im Code ein: ['product1sku','produkt2sku']

Optionale Felder

• borderColor:  Wählen Sie die zu Ihrem Shop passende Rahmenfarbe aus
• backgroundColor: Wählen Sie die Hintergrundfarbe des Sticker aus, z.b. Weiß, für eine generische Lösung.
• starColor: Farbe der Bewertungssterne
• starSize: Größe der Bewertungssterne (in Pixeln)
• ratingSummary: Entscheiden Sie, ob Sie die Gesamtbewertung links oben im Sticker anzeigen möchten
• maxHeight: Dieser Parameter ermöglicht Ihnen, die Größe des Product Stickers einzustellen
• introtext: Schreiben Sie einen individuellen Text hinzu, um die Nutzer auf die Produktbewertungen aufmerksam zu machen. 
• hideEmptySticker: Wenn Sie den Sticker auf Ihrer Seite nur ausspielen möchten, wenn schon Produktbewertungen vorliegen, so nutzen Sie den Parameter "hideEmptySticker".
• filter: Durch den Filter können Ihre Kunden nach Noten sortieren
• richSnippets: Wenn Sie diesen Parameter aktivieren, werden die strukturierten Daten für die Anzeige von Sternen bei Google direkt im Sticker bereitgestellt.
• commentBorderColor: Hiermit bestimmen Sie die Rahmenfarbe jeder einzelnen Bewertung.
• commentHideArrow: Mit diesem Parameter aktivieren/deaktiveren Sie das kleine Dreieck am unteren Rand jeder Bewertung

Und schon sind Sie fertig. Wir wünschen viel Spaß mit den Trusted Shops Produktbewertungen!  

Bewertungssterne separat anzeigen

Sie können für jeden Artikel die Sterne der Gesamtbewertung separat von den Kundenkommentaren auf der Produktdetailseite anzeigen. Individuell gestaltet und an prominenter Stelle platziert, verschaffen die Bewertungssterne Ihren Kunden auf den ersten Blick einen Eindruck über die Benotung des Produkts.

Füllen Sie den nachfolgenden JavaScript-Code aus, um die Bewertungssterne nach Ihren Vorstellungen zu veröffentlichen.

<div id="test"></div>
<script type="text/javascript" src="//widgets.trustedshops.com/reviews/tsSticker/tsProductStickerSummary.js"></script>
<script>
var summaryBadge = new productStickerSummary();
summaryBadge.showSummary(
{
'tsId': 'TSID',
'sku': ['9990004'],
'element': '#test',
'starColor' : '#FFDC0F',
'starSize' : '14px',
'fontSize' : '12px',
'showRating' : 'true' ,
'scrollToReviews' : 'false' ,
'enablePlaceholder' : 'false',
}
);
</script> 

Erklärung:

Pflichtfelder

• tsId: Ihre Trusted Shops ID
• sku: Die Produkt-Identifikationsnummer bzw. Artikelnummer vom Hersteller (SKU)
• element:  Platzierung der Bewertungssterne

Optionale Felder

• starColor: Farbe der Bewertungssterne
• starSize: Größe der Bewertungssterne (in Pixeln)
• frontSize: Schriftgröße der Bewertungsanzahl und –Note (in Pixeln)
• showRating: Bewertungsnote anzeigen (true) oder verbergen (false) 
• scrollToReviews: Mit einem Klick auf die Sterne scrollt die Seite zum Product Sticker (aktivieren mit "true") 
• enablePlaceholder: Wenn Sie diesen Parameter aktivieren, werden die Produktbewertungssterne in grau angezeigt, sofern noch keine Bewertung vorliegt