Tilpass visningsvaluta

Du kan tilpasse presentasjonen av utenlandske valutaer for å passe dine behov og preferanser ved å tilpasse valuta visningsformatet i din JavaScript-integrasjon.

Valuta visningsformater 

Hello støtter følgende valuta visningsformater:

• symbol (standard) - Vis et lokalisert valutasymbol (f.eks. €123).
• code - Bruk ISO valutakoden (f.eks. 123 USD).
• name - Vis det lokaliserte valutabegrepet (f.eks. 123 dollar).

Du kan overstyre valuta visningsformatet ved å bruke overrideCurrencyFormat egenskapen i Zonos.init metoden. Denne egenskapen aksepterer ett av valuta visningsformatene som er listet ovenfor. Overstyring av valuta visningsformatet gjelder både Hello og Zonos Checkout.

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

Bruke en tilpasset valutakonverterer 

For tilfeller der det å bare overstyre valutavisningsformatet ikke er tilstrekkelig for nettstedets behov, kan du bruke en tilpasset valutakonverterer for å håndtere konvertering og formatering av utenlandske valutabeløp. Denne tilnærmingen gir deg full kontroll over hvordan valutabeløp vises på nettstedet ditt.

For å bruke en tilpasset valutakonverterer, må du implementere currencyConverter-funksjonen i Zonos.init-metoden. Denne funksjonen skal akseptere følgende parametere:

• convertAndFormat - En funksjon som konverterer og formaterer valutabeløpet.
• originalAmount - Det opprinnelige valutabeløpet.
• selector - Velgeren til elementet som inneholder valutabeløpet.

Når den er til stede, vil currencyConverter-funksjonen gå gjennom alle matchende prisvelgere på nettstedet ditt og bruke den tilpassede valutakonverteringslogikken på hver enkelt.

En vanlig brukstilfelle for å bruke en tilpasset valutakonvertererfunksjon er når du har priser vist i en nedtrekksmeny eller andre komplekse HTML-elementer. For eksempel, hvis du har en nedtrekksmeny med priser vist ved siden av hvert alternativ, 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 slike tilfeller kan du ikke bare velge prisen direkte, da det er ekstra tekst ved siden av den. Ved å bruke en tilpasset valutakonverterer kan du hente prisen fra elementet og bruke 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);
  },
});