Personalizzare il Trustbadge®

Collocare il Trustbadge nel negozio in modo flessibile

Collocare il Trustbadge nel negozio in modo flessibile

Desideri collocare il Trustbadge in un altro posto che non sia in basso a destra nel tuo negozio?
Nessun problema, con queste istruzioni potrai personalizzare il Trustbadge secondo le tue preferenze.

Passo 1: Inserisci in basso l’URL del tuo negozio per poter generare il tuo Trustbadge personale


 

Passo 2: All’interno del codice d’integrazione generato in alto, cerca la seguente riga

'variant': 'reviews', /* reviews, default, custom, custom_reviews */

e modifica il valore del parametro in 'custom_reviews' o 'custom', a seconda che desideri visualizzare anche l’attuale valutazione del tuo negozio nel Trustbadge o soltanto il sigillo di qualità.

Passo 3: Inserisci il seguente codice

<div id="MyCustomTrustbadge"></div> 

lì dove desideri che sia visualizzato il Trustbadge – ad es. nell’intestazione o a piè di pagina.

Passo 4: All’interno del codice d’integrazione generato in alto, cerca la seguente riga

'customElementId': '', /* required for variants custom and custom_reviews */

e inserisci‚ ‘MyCustomTrustbadge‘ come valore del parametro 'customElementId':

'customElementId': 'MyCustomTrustbadge', /* required for variants custom and custom_reviews */

Passo 5: Per la posizione della Trustcard utilizza i parametri all’interno della riga TrustcardDirection, inserendo “topLeft”, “topRight”, “bottomLeft” o “bottomRight”.

'trustcardDirection': '', /* topRight, topLeft, bottomRight, bottomLeft */

Passo 6: Per adattare le dimensioni del Trustbadge, inserisci il numero di pixel desiderato nella riga customBadgeWidth e/o customBadgeHeight. È possibile scegliere tra 40 e 90 pixel.

'customBadgeWidth': '', /* 40 - 90 (in pixels) */
'customBadgeHeight': '', /* 40 - 90 (in pixels) */

Passo 7: Per raccogliere automaticamente le recensioni e permettere ai tuoi clienti di stipulare la garanzia, il Trustbadge necessita di un piccolo aiuto. Dovrai inserire l’elemento <div> per il riconoscimento della tua pagina di conferma d’ordine (pagina di ringraziamento). Qui, il Trustbadge aprirà automaticamente la Trustcard per i tuoi visitatori, che comprende la registrazione alla garanzia di rimborso e/o il consenso al promemoria per il rilascio della recensione. 

Se non l’hai ancora fatto, inserisci adesso il container <div> sulla pagina di conferma dell’ordine:

<div id="trustedShopsCheckout" style="display: none;">
<span id="tsCheckoutOrderNr">%Value: ORDER_NUMBER%</span>
<span id="tsCheckoutBuyerEmail">%Value: BUYER_EMAIL_ADDRESS%</span>
<span id="tsCheckoutOrderAmount">%Value: SHOPPING_BASKET_TOTAL%</span>
<span id="tsCheckoutOrderCurrency">%Value: ORDER_CURRENCY%</span>
<span id="tsCheckoutOrderPaymentType">%Value: PAYMENT_METHOD%</span>
<span id="tsCheckoutOrderEstDeliveryDate">%Value: DELIVERYDATE (YYYY-MM-DD)%</span></div> 

Inserisci i valori dei parametri tramite il linguaggio di scripting utilizzato dal tuo software di e-commerce. In PHP, la trasmissione dell’indirizzo e-mail potrebbe essere approssimativamente così, dove $customer_email  $customer_email dell’indirizzo di posta elettronica del cliente corrisponderebbe nel tuo software di e-commerce a (troverai l’esatta definizione e denominazione del parametro nella documentazione del tuo software di e-commerce - tali dati esulano dalle nostre competenze):

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

Adesso, sulla pagina di conferma dell’ordine appare la Trustcard in un Lightbox ed offre la stipula della garanzia:

Personalizza la versione mobile del Trustbadge

Negli schermi di dimensione ridotta, il Trustbadge viene visualizzato di default come una barra sulla parte superiore dello schermo.

Puoi adattare la visualizzazione e la posizione del Trustbadge con il parametro "responsive" all’interno della configurazione del Trustbadge.

Variante “Floating”

Aggiungi semplicemente alla tua configurazione del Trustbadge il seguente codice come parametro addizionale: approfittate automaticamente della nostra variante flottante.

'responsive': {'variant': 'floating'}

Per il parametro 'variant' specifica il valore 'floating_reviews' se desideri mostrare anche le recensioni all’interno del Trustbadge® oppure 'floating', se desideri mostrare solo il sigillo di qualità.

Variante personalizzata “Custom”: posizioni differenti per mobile e per desktop

'responsive': {'variant': 'custom', 'customElementId': 'myMobileCustomTrustbadge'}

Le varianti ‘custom’ e ‘custom_revies’ sono i possibili valori nell’oggetto per “variant”. Inserisci il seguente codice HTML nella posizione in cui vuoi mostrare il Trustbadge® – per esempio, nell’header o nel footer della pagina.

<div id="myMobileCustomTrustbadge" style="width:100px;height:50px"></div>

Nel tuo CSS, usa le proprietà “width” e “height” in questo codice HTML per impostare le dimensioni del Trustbadge. E’ necessario specificare entrambi i valori. Ricordati di rispettare le proporzioni originali (rapporto larghezza:altezza) del Trustbadge di 2:1 per la variante ‘custom_reviews’e di 1:1 per la variante ‘custom’.
 
 

Visualizzare la Trustcard in un punto a piacimento sulla pagina di conferma d’ordine

La stipula della garanzia Trusted Shops o la registrazione per il rilascio di una recensione sulla pagina di ringraziamento per l’ordine possono essere altrettanto collocate nella posizione desiderata.

Passo 1: Inserisci la tua pagina di ringraziamento per l’ordine al posto di un container<div>vuoto in cui desideri che sia visualizzata la Trustcard. Assegna a questo container<div>una denominazione ID indipendente, ad es.

<div id="customCheckoutDiv"></div>

Passo 2:  Nel codice del Trustbadge, inserisci nel campo _tsConfig come parametro aggiuntivo  'customCheckoutElementId': 'customCheckoutDiv' e imposta la denominazione ID che hai scelto nel passo 1 come valore del parametro 'customCheckoutElementId' (nell’esempio sarebbe 'customCheckoutDiv').