Hoe kan ik de Trustbadge® zonder plug-in in mijn shop integreren?

Je kunt de Trustbadge® op de eerste dag van je Trusted Shops lidmaatschap integreren. Er zijn slechts vijf stappen nodig:

1. Zoek jouw Trusted Shops ID
2. Configureer de Trustbadge-code
3. Integreer de Trustbadge-code in jouw website
4. Definieer de dataoverdracht voor de Trustcard
5. Controleer de integratie van Trustbadge

Stap 1: zoek jouw Trusted Shops ID

Je hebt je individuele Trusted Shops ID nodig voor de integratie van Trustbadge. Je vindt jouw Trusted Shops ID in My Trusted Shops.

1. Log in op My Trusted Shops. Het dashboard wordt geopend.
2. Zoek jouw Trusted Shops ID ('TS-ID') in de rechterkolom van het dashboard.

Stap 2: configureer de Trustbadge-code

De basis voor je Trustbadge-integratie is de volgende integratiecode:

<script async 
data-desktop-y-offset="0" 
data-mobile-y-offset="0" 
data-desktop-disable-reviews="false" 
data-desktop-enable-custom="false" 
data-desktop-position="right" 
data-desktop-custom-width="156" 
data-desktop-enable-fadeout="false" 
data-disable-mobile="false" 
data-disable-trustbadge="false" 
data-mobile-custom-width="156" 
data-mobile-disable-reviews="false" 
data-mobile-enable-custom="false" 
data-mobile-position="left" 
data-mobile-enable-topbar="false" 
data-mobile-enable-fadeout="true"
data-color-scheme="light" 
charset="UTF-8" 
src="//widgets.trustedshops.com/js/YOUR_TSID.js"> 
</script>

1. Zoek de volgende codestring binnen de integratiecode:

   src="//widgets.trustedshops.com/js/YOUR_TSID.js">

2. Vervang het vetgedrukte gedeelte YOUR_TSID door je Trusted Shops ID.

Je hebt nu je Trustbadge-code aangemaakt. Als je geen verdere aanpassingen doet, zal de Trustbadge...

...jouw verzamelde beoordelingen laten zien en – na succesvolle certificering – het keurmerk.

...rechts in de desktopweergave staan en links in de mobiele weergave.

...54 pixels boven de onderkant van het scherm worden weergegeven in de desktopweergave en 10 pixels boven de onderkant van het scherm in de mobiele weergave.

Op dit punt heb je twee mogelijkheden:

• Zijn deze instellingen voor jou in orde? Ga dan meteen naar stap 3.
• Wil je een andere weergave van je Trustbadge of hem ergens anders integreren in jouw webshop? Ga dan verder met het configureren van de Trustbadge-code met behulp van dit artikel: Hoe pas ik de Trustbadge® op mijn vereisten aan? Daarna ga je terug naar dit artikel om verder te gaan met stap 3.

Stap 3: integreer de Trustbadge-code in jouw website

Heb je de Trustbadge-code volgens je behoeften geconfigureerd? Integreer hem dan in jouw website.

1. Open je footer bestand binnen je e-commerceplatform. 

2. Kopieer de volledige Trustbadge-code naar je klembord. 
3. Voer de Trustbadge-code in het footer bestand in vlak voor de afsluitende </body> tag. 

De Trustbadge is dan beschikbaar op elke pagina van jouw webshop, waaronder de bedankpagina.

Stap 4: definieer de dataoverdracht voor de Trustcard

Een belangrijke functionaliteit van de Trustbadge is de Trustcard. De Trustcard wordt na het afrekenen in jouw webshop geopend. Met behulp van de Trustcard kunnen je klanten toestemming geven voor het ontvangen van een beoordelingsverzoek en/of hun bestelling beschermen met de kopersbescherming.

Om ervoor te zorgen dat de Trustcard op het juiste moment wordt geopend, moet de Trustbadge de bedankpagina herkennen. Integreer hiervoor het DIV-element hieronder in de template van de bedankpagina.

Dit DIV-element wordt ook gebruikt om gegevens van jouw webshop over te dragen naar de Trustbadge, die nodig is voor de kopersbescherming en voor het verzenden van een beoordelingsverzoek.

De basis voor het DIV-element is de volgende code:

<div id="trustedShopsCheckout" style="display: none;"> 
<span id="tsCheckoutOrderNr">2020-05-21-001</span> 
<span id="tsCheckoutBuyerEmail">mein.kunde@mail.de</span> 
<span id="tsCheckoutOrderAmount">4005.95</span> 
<span id="tsCheckoutOrderCurrency">EUR</span> 
<span id="tsCheckoutOrderPaymentType">VORKASSE</span> 
<span id="tsCheckoutOrderEstDeliveryDate">2020-05-24</span> 
</div>

De gegevens van de bestelling moeten dynamisch ingevuld worden en doorgegeven worden via het DIV-element. Kopieer de bovenstaande voorbeeldcode daarom niet ongewijzigd naar je bedankpagina.

1. Vervang het voorbeeld en de vet gemarkeerde waarden van de parameters. Gebruik de overeenkomstige variabelen in de programmeertaal die jouw e-commerceplatform gebruikt. De volgende tabel geeft een verklaring van de afzonderlijke parameters: 

<span id="tsCheckoutBuyerEmail"><?php echo $customer_email; ?><span>

2. Open het voorbeeldbestand van je bedankpagina. 

3. Kopieer de volledige voorbereide DIV-elementcode naar je klembord.
4. Voeg de code toe aan het voorbeeldbestand van je bedankpagina. 

Hiermee wordt de Trustcard geopend op de bedankpagina na het afrekenen. Op die manier is de Trustbadge met al z'n functies in jouw webshop geïntegreerd.

Stap 5: controleer de integratie van Trustbadge

Test nu de werking van je Trustbadge door een testbestelling in jouw webshop te plaatsen. Als de Trustbadge correct is geïntegreerd, verschijnt aan het einde van het betaalproces de Trustcard.

Dit artikel helpt je om de integratie van Trustbadge te testen: Hoe controleer ik mijn Trustbadge®-integratie?