Personalizza la valuta di visualizzazione

Puoi adattare la presentazione delle valute estere per soddisfare le tue esigenze e preferenze personalizzando il formato di visualizzazione della valuta nella tua integrazione JavaScript.

Formati di visualizzazione della valuta 

Hello supporta i seguenti formati di visualizzazione della valuta:

• symbol (predefinito) - Visualizza un simbolo di valuta localizzato (ad es. €123).
• code - Usa il codice di valuta ISO (ad es. 123 USD).
• name - Visualizza il nome della valuta localizzata (ad es. 123 dollari).

Puoi sovrascrivere il formato di visualizzazione della valuta utilizzando la proprietà overrideCurrencyFormat nel metodo Zonos.init. Questa proprietà accetta uno dei formati di visualizzazione della valuta elencati sopra. La sovrascrittura del formato di visualizzazione della valuta si applica sia a Hello che a Zonos Checkout.

Zonos.init({
  overrideCurrencyFormat: 'code',
});

Utilizzo di un convertitore di valuta personalizzato 

Per i casi in cui semplicemente sovrascrivere il formato di visualizzazione della valuta non è sufficiente per le esigenze del tuo sito, puoi utilizzare un convertitore di valuta personalizzato per gestire la conversione e la formattazione degli importi in valuta estera. Questo approccio ti consente di avere il pieno controllo su come gli importi in valuta vengono visualizzati sul tuo sito.

Per utilizzare un convertitore di valuta personalizzato, devi implementare la funzione currencyConverter nel metodo Zonos.init. Questa funzione dovrebbe accettare i seguenti parametri:

• convertAndFormat - Una funzione che converte e formatta l'importo in valuta.
• originalAmount - L'importo originale in valuta.
• selector - Il selettore dell'elemento contenente l'importo in valuta.

Quando presente, la funzione currencyConverter ciclerà su tutti i selettori di prezzo corrispondenti sul tuo sito e applicherà la logica di conversione della valuta personalizzata a ciascuno di essi.

Un caso d'uso comune per l'utilizzo di una funzione di convertitore di valuta personalizzato è quando hai prezzi visualizzati in un menu a discesa o in altri elementi HTML complessi. Ad esempio, se hai un menu a discesa con i prezzi visualizzati accanto a ciascuna opzione, come:

<select title="Option">
  <option className="money" data-select-option="Blue" value="option1">
    Blue - $1.99
  </option>
  <option className="money" data-select-option="Red" value="option2">
    Red - $2.00
  </option>
  <option className="money" data-select-option="Yellow" value="option3">
    Yellow - $3.59
  </option>
</select>

In situazioni come questa, non puoi semplicemente selezionare il prezzo direttamente poiché c'è del testo aggiuntivo accanto ad esso. Utilizzando un convertitore di valuta personalizzato, puoi estrarre il prezzo dall'elemento e applicare la logica di conversione della valuta ad esso.

window.Zonos.init({
  currencyConverter: ({ convertAndFormat, originalAmount, selector }) => {
    const optionValue = selector.getAttribute('data-select-option');
    if (optionValue) {
      return `${optionValue} -  ${convertAndFormat(originalAmount)}`;
    }
    return convertAndFormat(originalAmount);
  },
});