Tilpas visningsvaluta

Du kan tilpasse præsentationen af udenlandske valutaer for at imødekomme dine behov og præferencer ved at tilpasse valutaens visningsformat i din JavaScript-integration.

Valuta visningsformater 

Hello understøtter følgende valuta visningsformater:

• symbol (standard) - Vis et lokaliseret valutasymbol, f.eks. €123.
• code - Brug ISO-valutakoden, f.eks. 123 USD.
• name - Vis det lokaliserede valutabnavn, f.eks. 123 dollars.

Du kan overskrive valutaens visningsformat ved at bruge overrideCurrencyFormat egenskaben i Zonos.init metoden. Denne egenskab accepterer et af de valuta visningsformater, der er nævnt ovenfor. Overskrivning af valutaens visningsformat gælder for både Hello og Zonos Checkout.

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

Brug af en brugerdefineret valutaomregner 

For tilfælde, hvor det blot at overskrive valutaens visningsformat ikke er tilstrækkeligt til dit sites behov, kan du bruge en brugerdefineret valutaomregner til at håndtere konverteringen og formateringen af udenlandske valuta beløb. Denne tilgang giver dig fuld kontrol over, hvordan valuta beløb vises på dit site.

For at bruge en brugerdefineret valutaomregner skal du implementere currencyConverter funktionen i Zonos.init metoden. Denne funktion skal acceptere følgende parametre:

• convertAndFormat - En funktion, der konverterer og formaterer valuta beløbet.
• originalAmount - Det oprindelige valuta beløb.
• selector - Vælgeren af elementet, der indeholder valuta beløbet.

Når den er til stede, vil currencyConverter funktionen loop over alle matchende prisvælgere på dit site og anvende den brugerdefinerede valutaomregningslogik til hver enkelt.

Et almindeligt anvendelsestilfælde for at bruge en brugerdefineret valutaomregnerfunktion er, når du har priser vist i en dropdown-menu eller andre komplekse HTML-elementer. For eksempel, hvis du har en dropdown-menu med priser vist ved siden af hver mulighed, såsom:

<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>

I tilfælde som dette kan du ikke blot vælge prisen direkte, da der er yderligere tekst ved siden af. Ved at bruge en tilpasset valutakonverter kan du udtrække prisen fra elementet og anvende valutakonverteringslogikken på den.

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