Kan ik de Trustbadge® ook naar een andere positie in mijn webshop verplaatsen?

Heb je de Trustbadge® nog niet geïntegreerd? Voer dan eerst de standaardintegratie uit voordat je verdergaat. Dit artikel kan daarbij handig zijn: Hoe kan ik de Trustbadge® zonder plug-in in mijn shop integreren?
Via de link naar het artikel hierboven vind je ook de Trustbadge-code, die de basis vormt voor alle aanpassingen in de volgende tekst.

Binnen de standaardintegratie zijn voor de positionering van de Trustbadge de volgende regels vastgelegd:

  • Voor desktops wordt de Trustbadge rechts op het scherm weergegeven en in de mobiele versie aan de linkerkant van het scherm.
  • Op desktops wordt de Trustbadge 54 pixels boven de onderste rand van het scherm weergegeven en op mobiele apparaten 10 pixels erboven.

Je kunt deze regels natuurlijk aanpassen aan jouw individuele behoeften. Met de Trustbadge-code kun je de Trustbadge op verschillende plekken in de desktop- en mobiele weergave bekijken, onafhankelijk van elkaar.

Hoe wijzig ik de positionering in de desktopweergave?

In de desktopweergave is het mogelijk om de Trustbadge te verplaatsen...

...horizontaal van de rechter- naar de linkerrand op het scherm.

...verticaal omhoog of omlaag.

...volledig flexibel op jouw website.

De Trustbadge aan de linkerkant van het scherm plaatsen in de desktopversie van jouw website

  1. In de Trustbadge-code vind je de volgende codestring:
    data-desktop-position="right"
  2. Vervang de code string door de volgende codestring:
    data-desktop-position="left"

Je hebt de Trustbadge nu aan de linkerkant van het scherm geplaatst.

De Trustbadge naar boven of beneden verplaatsen in de desktopversie van jouw website

  1. In de Trustbadge-code vind je de volgende codestring:
    data-desktop-y-offset="0"
  2. Vervang de 0 door het aantal pixels waarmee de Trustbadge omhoog of omlaag moet worden gebracht.

Twee voorbeelden:

  • Wil je de Trustbadge 20 pixels hoger plaatsen? Gebruik dan de volgende codestring:
    data-desktop-y-offset="20"
  • Wil je de Trustbadge naar beneden verplaatsen? Gebruik dan de minwaarden. Gebruik de volgende codestring om de Trustbadge 20 pixels lager te plaatsen:
    data-desktop-y-offset="-20"

Met een waarde van -54 wordt de Trustbadge zonder tussenruimte op de onderrand van het scherm geplaatst. We raden daarom aan geen waarden van meer dan -44 te gebruiken.

Je hebt de Trustbadge nu naar boven of beneden verplaatst.

Flexibele plaatsing van de Trustbadge in de desktopversie van jouw website

Naast de eerder beschreven standaardvariant van de Trustbadge kun je ook de aangepaste versie in jouw website integreren.

De aangepaste variant verschilt op drie manieren van de standaardvariant:

  1. Hij ziet er anders uit dan de standaardvariant. Hier kun je de aangepaste variant bekijken:
    01_NL.png 02_NL.png
         (met beoordelingssterren)                                                 (zonder beoordelingssterren)
  2. Je kunt de aangepaste variant volledig flexibel op jouw website plaatsen.
  3. Je kunt de grootte van de aangepaste variant wijzigen.

De aangepaste variant heeft standaard een breedte van 156 pixels en een hoogte van 78 pixels. Hieronder leggen we uit hoe je de grootte van de Trustbadge in de desktopweergave kunt wijzigen. Vind je de bovenvermelde standaardwaarden in orde? Sla dan de volgende twee stappen over en ga verder met stap 3.

  1. In de Trustbadge-code vind je de volgende codestring:
    data-desktop-custom-width="156"
  2. Vervang de 156 door het aantal pixels dat je als breedte van de Trustbadge wilt instellen.

Het aantal pixels dat je hier kunt instellen, hangt af van de vraag of je de beoordelingssterren in de desktopweergave hebt verborgen.

  • Heb je de beoordelingssterren verborgen? Als dat het geval is, selecteer je tussen 32 en 58 pixels.
  • Heb je de beoordelingssterren niet verborgen? Dan selecteer je tussen 100 en 500 pixels.

Het aantal pixels voor de hoogte van de Trustbadge wordt automatisch bepaald door de breedte die je hebt geselecteerd. Je kunt dit niet zelf specificeren.

  1. In de Trustbadge-code vind je de volgende codestring:
    data-desktop-enable-custom="false"
  2. Vervang de code string door de volgende codestring:
    data-desktop-enable-custom="true"
  3. Open de broncode van jouw website.
  4. Plaats de volgende codestring op jouw website op de plek waar de Trustbadge moet worden weergegeven:
    <div id="trustbadgeCustomContainer"></div>

Mogelijke opties zijn bijvoorbeeld de header of de footer.

Je hebt de Trustbadge nu geïntegreerd op de positie die je op jouw website hebt geselecteerd.

Hoe wijzig ik de positionering in de mobiele weergave?

In de mobiele weergave is het mogelijk om de Trustbadge te verplaatsen...

...horizontaal van de linkerrand van het scherm naar het midden of naar rechts.

...verticaal omhoog of omlaag.

...volledig flexibel op jouw website.

In de mobiele weergave plaats je de Trustbadge aan de rechterkant van het scherm of in het midden

  1. In de Trustbadge-code vind je de volgende codestring:
    data-mobile-position="left"
  2. Vervang de code string door de volgende codestrings:
    - Als je de Trustbadge aan de rechterkant wilt plaatsen:
    data-mobile-position="right"
    - Als je de Trustbadge in het midden wilt plaatsen:
    data-mobile-position="center"

Je hebt de Trustbadge nu aan de rechterkant van het scherm of in het midden geplaatst.

De Trustbadge naar boven of beneden verplaatsen in de mobiele versie van jouw website

  1. In de Trustbadge-code vind je de volgende codestring:
    data-mobile-y-offset="0"
  2. Vervang de 0 door het aantal pixels waarmee de Trustbadge omhoog of omlaag moet worden gebracht.

Twee voorbeelden:

  • Wil je de Trustbadge 5 pixels hoger plaatsen? Gebruik dan de volgende codestring:
    data-mobile-y-offset="5"
  • Wil je de Trustbadge naar beneden verplaatsen? Gebruik dan de minwaarden. Gebruik de volgende codestring om de Trustbadge 5 pixels lager te plaatsen:
    data-mobile-y-offset="-5"
    Gebruik alleen waarden tot -10.

Je hebt de Trustbadge nu naar boven of beneden verplaatst.

Flexibele plaatsing van de Trustbadge in de mobiele versie van jouw website

Naast de eerder beschreven standaardvariant van de Trustbadge kun je ook de aangepaste versie in de mobiele weergave van jouw website integreren. De aangepaste variant heeft standaard een breedte van 156 pixels en een hoogte van 78 pixels in de mobiele weergave. Hieronder leggen we uit hoe je de grootte van de Trustbadge in de mobiele weergave kunt wijzigen. Vind je de bovenvermelde standaardwaarden in orde? Sla dan de volgende twee stappen over en ga verder met stap 3.

  1. In de Trustbadge-code vind je de volgende codestring:
    data-mobile-custom-width="156"
  2. Vervang de 156 door het aantal pixels dat je als breedte van de Trustbadge wilt instellen.

Het aantal pixels dat je hier kunt instellen, hangt af van de vraag of je de beoordelingssterren in de mobiele weergave hebt verborgen.

  • Heb je de beoordelingssterren verborgen? Als dat het geval is, selecteer je tussen 32 en 58 pixels.
  • Heb je de beoordelingssterren niet verborgen? Dan selecteer je tussen 100 en 500 pixels.

Het aantal pixels voor de hoogte van de Trustbadge wordt automatisch bepaald door de breedte die je hebt geselecteerd. Je hoeft dit niet zelf te specificeren.

  1. In de Trustbadge-code vind je de volgende codestring:
    data-mobile-enable-custom="false"
  2. Vervang de code string door de volgende codestring:
    data-mobile-enable-custom="true"
  3. Open de broncode van jouw website.
  4. Plaats de volgende codestring op jouw website op de plek waar de Trustbadge moet worden weergegeven:
    <div id="trustbadgeCustomMobileContainer"></div>

Mogelijke opties zijn bijvoorbeeld de header of de footer.

Je hebt de Trustbadge nu geïntegreerd op de positie die je op jouw website hebt geselecteerd.

Hoe plaats ik de Trustcard ergens anders?

Na het afrekenen verschijnt de Trustcard als pop-up op de bestelbevestigingspagina van je webshop. Met behulp van de Trustcard kunnen je klanten toestemming geven voor het ontvangen van een beoordelingsverzoek en/of hun bestelling beschermen met de kopersbescherming.

03_NL.png

Wil je niet dat de Trustcard als pop-up wordt geopend? Vervolgens kun je deze op je bestelbevestigingspagina een vaste positie geven.

  1. Open het voorbeeldbestand van je bestelbevestigingspagina.
Het voorbeeldbestand heet waarschijnlijk finish.tpl, thankyou.php, success.phtml of iets dat erop lijkt.
  1. Kopieer de volgende coderegel:
    <div id="trustbadgeCustomCheckoutContainer"></div>
De waarde id="trustbadgeCustomCheckoutContainer" mag niet worden gewijzigd.
  1. Plak de codelijn op de positie van het voorbeeldbestand waar de Trustcard moet komen.

Je hebt de Trustcard nu met succes op een vaste plaats op je bestelbevestingspagina geplaatst.


Was dit artikel nuttig?

Aantal gebruikers dat dit nuttig vond: 1 van 3