Trusted Shops nutzen mit Gambio (GX3)

Sie nutzen Gambio 4? Das kostenfreie Trusted- Shops-Plugin für Gambio 4 mit der entprechenden Integrationsanleitung finden Sie hier: Trusted Shops nutzen mit Gambio (GX4)

Installation

Plugin hinzufügen & installieren

Um das Trusted-Shops-Plugin nutzen zu können, müssen Sie dieses zunächst hier herunterladen. (Version 1.0.3 - Veröffentlichungsdatum: 04.09.2020) Das Plugin ist kompatibel für die Gambio-Versionen 3.11.-3.15. (PHP 7). Entpacken Sie anschließend die ZIP-Datei auf Ihrem Rechner. Nun muss das entpackte Plugin per FTP auf Ihren Server kopiert werden. Öffnen Sie hierzu das von Ihnen verwendete FTP-Tool und verbinden Sie sich mit Ihrem Server.

Öffnen Sie nun innerhalb Ihres Serververzeichnisses den Gambio-Ordner (01_16x16.png). Wählen Sie anschließend den Ordner „GXModules“ (02_16x16.png) aus und ziehen Sie den entpackten ZIP-Ordner „NewTrustedShops“ in diesen Ordner.

1_FTP-Upload.png

Sollten Sie Probleme beim Hinzufügen des Moduls haben und eine Fehlermeldung erhalten, beachten Sie bitte folgendes: Nach dem Hochladen des Plugins per FTP müssen die CHMOD Rechte für das "Html" Verzeichnis auf 755 gesetzt werden. Bei Filezilla ist es meistens "rechte Maustaste -> Dateiberechtigungen..."

Loggen Sie sich nun in Ihr Gambio-Backend ein. Wählen Sie innerhalb der Hauptnavigation den Menüpunkt „Module“ (01_16x16.png) aus und klicken Sie innerhalb des sich nun öffnenden Dropdown-Menüs auf „Modul-Center“ (02_16x16.png).

2_ModulCenter.png

Daraufhin öffnet sich eine Auflistung Ihrer Module. Suchen Sie innerhalb dieser Liste nach dem Eintrag „Trusted Shops (aktuell)“ und wählen Sie diesen aus.

3_Modul-Liste.png

Anschließend erscheint in der rechten unteren Ecke der Button „Installieren“. Klicken Sie diesen an, um mit der Installation des Trusted-Shops-Plugins zu beginnen.

4_Installieren.png

Sobald die Installation abgeschlossen ist, erscheint an gleicher Stelle der Button „Bearbeiten“. Nutzen Sie diesen, um zur Konfiguration des Plugins zu gelangen.

5_Plugin-bearbeiten.png

Konfiguration

Das Trusted-Shops-Plugin wurde im vorherigen Schritt erfolgreich installiert. Im Folgenden zeigen wir Ihnen, wie Sie das Trustbadge® in Ihrem Online-Shop anzeigen und nach Ihren individuellen Wünschen konfigurieren können.

Trustbadge anzeigen, Käuferschutz integrieren & Shopbewertungen sammeln

Mit der einzigartigen Trustbadge-Technologie sammeln, managen und zeigen Sie Ihre Kundenbewertungen völlig mühelos in Ihrem Shop an. Außerdem können Sie so einfach Ihr Gütesiegel einbinden und den Käuferschutz anbieten.

Um das Trustbadge in Ihren Shop zu integrieren, müssen Sie zunächst in den Konfigurationsmodus wechseln. Klicken Sie hierzu – wie im vorherigen Kapitel beschrieben – auf den Button „Bearbeiten“. Wählen Sie in der sich nun öffnenden Ansicht zunächst die Sprache Ihres Shops aus und fügen Sie Ihre Trusted-Shops-ID in das dafür vorgesehene Eingabefeld ein.

Ihre Trusted-Shops-ID (beginnend mit X...) finden Sie in Ihrem Dashboard im Backend My Trusted Shops. Loggen Sie sich hierfür zunächst hier in My Trusted Shops ein. Nach dem Login werden Sie direkt ins Dashboard geleitet. In der rechten Spalte des Dashboards sind Ihre bei Trusted Shops angemeldeten Shops mit der jeweiligen Trusted-Shops-ID aufgelistet.

Klicken Sie anschließend auf „Speichern“.

6_TS-ID_eingeben.png

Daraufhin erscheint die Erfolgsmeldung „Die Einstellungen wurden gespeichert“ (01_16x16.png). Wählen Sie anschließend in der oberen Tableiste den Reiter „Trustbadge“ (02_16x16.png) aus.

7_TBKonfig.png

Um das Trustbadge anzuzeigen und den Käuferschutz anzubieten, müssen Sie in der sich nun öffnenden Ansicht den Kippschalter „Trustbadge aktivieren“ (01_16x16.png) auf Grün stellen. Über die Codebox, die unterhalb des Kippschalters angezeigt wird, haben Sie eine ganze Reihe an Einstellungsmöglichkeiten, um die Darstellung des Trustbadge an Ihre Wünsche und die Bedürfnisse Ihres Shops anzupassen. Diese Möglichkeiten erläutern wir Ihnen in diesem Artikel im Detail.

Klicken Sie auf „Speichern“ (02_16x16.png), sobald Sie Ihre individuellen Anpassungen vorgenommen haben.

8_TB_Tab.png

Sobald Sie diese Schritte durchgeführt haben, können Sie die Funktion Ihres Trustbadge testen. Führen Sie dazu eine Testbestellung in Ihrem Shop durch. Wenn am Ende Ihrer Bestellung die sogenannte Trustcard („Käuferschutz-Karte“) erscheint, haben Sie das Trustbadge korrekt in Ihrem Shop eingebunden und der Käuferschutz ist aktiv. 

website_integration_custom_de-DE.png

Shopbewertungssticker mit Bewertungskommentaren anzeigen

Um die gesammelten Shopbewertungen prominent in Ihrem Shop anzuzeigen, können Sie zusätzlich zum Trustbadge den von Trusted Shops bereitgestellten Shopbewertungssticker in Ihren Shop einbinden.

Wählen Sie hierzu zunächst den Reiter „Shopbewertungen“ (01_16x16.png) in der oberen Tableiste aus und aktivieren Sie in der folgenden Ansicht den Kippschalter „Shopbewertungskommentare anzeigen“ (02_16x16.png). Mithilfe der Codebox, die unterhalb des Kippschalters dargestellt wird, können Sie den Shopbewertungssticker an Ihre Wünsche und die Bedürfnisse Ihres Shops anpassen.

Möchten Sie den Shopbewertungssticker anpassen? Dann klicken Sie hier.

Die Grundlage für die Anpassung des Shopbewertungssticker ist der folgende JavaScript-Code.

<div id="reviewsticker"></div>
<script type="text/javascript">
  _tsRatingConfig = {
        tsid: 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
        variant: 'testimonial',
        reviews: '5',
        betterThan: '3.5',
        backgroundColor: '#ffdcof',
        fontColor: '#000000',
        linkColor: '#000000',
        fontFamily: 'Arial',
        quotationMarkColor: '#ffffff',
        reviewMinLength: '10',
        element: '#reviewsticker',
        locale: 'de_DE'
  };
  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/tsSticker.js';
  me.parentNode.insertBefore(_ts, me);
  _tsRatingConfig.script = _ts;
</script>

Innerhalb dieses Codes müssen einige Anpassungen vorgenommen werden, die wir Ihnen im Folgenden erklären werden. Hierzu erläutern wir Ihnen die einzelnen Parameter des Codes und welche Funktionen sie übernehmen.

  • tsid: Dieser Parameter verknüpft den Shopbewertungssticker mit Ihrem Bewertungsprofil und sorgt dafür, dass die richtigen Shopbewertungen in Ihrem Sticker ausgespielt werden. Geben Sie als Wert für diesen Parameter daher bitte Ihre Trusted-Shops-ID ein.
  • variant: Dieser Parameter ist fix und darf nicht verändert werden.
  • reviews: Über diesen Parameter können Sie bestimmen, wie viele Shopbewertungen innerhalb des Stickers rollieren. Standardmäßig sind fünf Bewertungen eingestellt, was auch der maximalen Anzahl entspricht. Selbstverständlich können Sie die Bewertungsanzahl aber nach unten korrigieren.

Darüber hinaus haben Sie noch ein paar optionale Konfigurationsmöglichkeiten.

  • betterThan: An dieser Stelle können Sie definieren, welche Mindestnote die über den Shopbewertungssticker ausgegebenen Bewertungen haben sollen. Standardmäßig liegt die Mindestnote bei dreieinhalb Sternen. Sie können aber natürlich einen anderen Wert eingeben, um die Mindestnote an Ihre Bedürfnisse anzupassen.
  • backgroundColor: Über diesen Parameter bestimmen Sie die Hintergrundfarbe des Shopbewertungsstickers. Voreingestellt ist Gelb. Falls Sie dies ändern möchten, müssen Sie einfach den Hexadezimalwert der gewünschten Farbe als Wert eintragen.
  • fontColor: Dieser Parameter bestimmt die Farbe der Schrift. Voreingestellt ist Schwarz, doch auch diese Farbe können Sie durch die Eingabe eines anderen Hexadezimalwerts anpassen.
  • linkColor: Hier können Sie die Farbe definieren, in der der Link zum Shopprofil am unteren Rand des Stickers dargestellt werden soll. Auch dies geschieht über die Eingabe eines Hexadezimalwerts. Standardmäßig ist Schwarz eingestellt.
  • fontFamily: Über diesen Parameter wählen Sie die Schriftart aus, die im Shopbewertungssticker verwendet werden soll. Voreingestellt ist Arial. Weitere Auswahlmöglichkeiten sind Geneva, Georgia, Helvetica, Sans-serif, Serif, Trebuchet MS und Verdana.
  • quotationMarkColor: An dieser Stelle können Sie die Farbe der Anführungszeichen bestimmen, die am oberen Rand des Shopbewertungsstickers ausgespielt werden. Voreingestellt ist Weiß. Falls Sie dies wünschen, können Sie auch diese Farbe mittels eines anderen Hexadezimalwerts ersetzen.
  • reviewMinLength: Dieser Parameter definiert, welche Mindestlänge Bewertungen haben müssen, um über den Shopbewertungssticker ausgespielt zu werden. Standardmäßig ist dieser Wert auf 10 Zeichen festgelegt. Sie können den Wert aber frei anpassen.
  • element: Dieser Parameter verbindet den JavaScript-Code mit dem in der ersten Codezeile definierten DIV-Element. Selbstverständlich können Sie die ID des DIV-Elements selbst bestimmen. Falls Sie ID ändern möchten, denken Sie aber bitte daran, die ID sowohl im DIV-Element als auch im Parameter 'element' anzupassen. Im Parameter darf zudem das # nicht vergessen werden. Nutzen Sie ein Trusted Shop Plugin, über das Sie den Shopbewertungssticker einbinden können, wird dieser standardmäßig in der Sidebar angezeigt. Wenn ihr Shop über keine Sidebar verfügt, können Sie diesen Parameter nutzen, um den Shopbewertungssticker an einer anderen Stelle zu platzieren.
  • locale: Durch diesen Parameter werden die Sprache der nicht durch Ihre Kundinnen und Kunden generierten Inhalte sowie das Datumsformat bestimmt. Voreingestellt sind die deutsche Sprache und das in Deutschland übliche Format (z.B. 22.01.2020). Der Wert für locale muss folgendes Format haben sprache_LAND. Die Bezeichnungen folgen dabei den ISO-639- und ISO-3166-Codes. Ein Beispiel: Der passende Wert für britisches Englisch wäre demnach en_GB.

Damit haben Sie den Shopbewertungssticker erfolgreich angepasst.

Klicken Sie anschließend auf „Speichern“.

9_Shopbewertungen.png

Produktbewertungen sammeln & anzeigen

Um nicht nur Shop-, sondern auch Produktbewertungen zu sammeln, müssen Sie die Funktion im Trusted-Shops-Plugin aktivieren. Öffnen Sie hierfür zunächst den Reiter „Produktbewertungen“ (01_16x16.png) in der oberen Tableiste und aktivieren Sie den Kippschalter „Produktbewertungen sammeln“ (02_16x16.png).

10_Produktbewertungenaktivieren.png

Nach der Aktivierung des Kippschalters erscheinen zwei weitere Einstellungsmöglichkeiten, über die Sie die Darstellung der gesammelten Produktbewertungen in Ihrem Shop regeln können.

11_Produktbewertungen_2.png

Eine Möglichkeit, die Produktbewertungen in Ihrem Shop anzuzeigen, besteht darin, die zu einem Produkt gesammelten Kundenstimmen über einen zusätzlichen Tab auf der Produktdetailseite einzubinden.

Produktbewertungstab_Frontend.png

Stellen Sie hierfür den Kippschalter „Produktbewertungssticker aktivieren“ (01_16x16.png) auf Grün.

Außerdem haben Sie die Möglichkeit, auf der Produktdetailseite die entsprechenden Bewertungssterne darzustellen.

Produktbewertungssterne_Frontend.png

Aktivieren Sie hierfür den Kippschalter „Bewertungssterne aktivieren“ (02_16x16.png).

Über die unter den Kippschaltern dargestellten Codeboxen haben Sie die Möglichkeit, die Darstellung des Produktbewertungsstickers und der Bewertungssterne an Ihre individuellen Bedürfnisse anzupassen. Welche Möglichkeiten Sie hierbei haben, erläutern wir Ihnen in diesem Artikel ausführlicher: Wie kann ich Produktbewertungen in meinem Shop anzeigen?

Multishops (z.B. mehrere Sprachshops) mit verschiedenen Trusted-Shops-IDs konfigurieren

Sie haben einen Multishop und verkaufen Ihre Produkte zum Beispiel in verschiedenen Sprachen? Dann nutzen Sie auch mehrere Trusted-Shops-IDs. Hier erfahren Sie, wie Sie Ihren Shop mit mehreren Trusted-Shops-IDs individuell konfigurieren können.

Die Voraussetzung für die Konfiguration eines Shops mit mehreren Sprachen ist, dass Sie in Gambio weitere Sprachen hinzugefügt haben. Wie Sie in Gambio weitere Sprachen zu Ihrem Shop hinzufügen, erfahren Sie hier.

Sobald die Sprache eingerichtet ist, wechseln Sie ins Trusted-Shops-Plugin. Wählen Sie in der ersten Ansicht innerhalb des Plugins (Reiter „Start“) zunächst über das entsprechende Dropdown-Menü die Sprache des Shops aus, für den nun die Trusted Shops Produkte konfiguriert werden sollen.

Multishop_1.png

Daraufhin wird das Eingabefeld „Trusted Shops ID“ wieder frei. Tragen Sie in dieses die ID Ihres Sprachshops ein und klicken Sie anschließend auf „Speichern“.

Multishop_2.png

Konfigurieren Sie auf diese Weise nun all Ihre Sprachshops – unabhängig von Ihrem Hauptshop – nach Ihren individuellen Bedürfnissen.


War der Artikel hilfreich?

1 von 3 fanden dies hilfreich