Dostosuj walutę wyświetlania

Możesz dostosować prezentację walut obcych, aby odpowiadały Twoim potrzebom i preferencjom, modyfikując format wyświetlania waluty w swojej integracji JavaScript.

Format wyświetlania waluty 

Hello obsługuje następujące formaty wyświetlania waluty:

• symbol (domyślny) - Wyświetl zlokalizowany symbol waluty (np. €123).
• code - Użyj kodu waluty ISO (np. 123 USD).
• name - Wyświetl zlokalizowaną nazwę waluty (np. 123 dolary).

Możesz nadpisać format wyświetlania waluty, używając właściwości overrideCurrencyFormat w metodzie Zonos.init. Ta właściwość akceptuje jeden z formatów wyświetlania waluty wymienionych powyżej. Nadpisanie formatu wyświetlania waluty dotyczy zarówno Hello jak i Zonos Checkout.

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

Używanie niestandardowego konwertera walut 

W przypadkach, gdy proste nadpisanie formatu wyświetlania waluty nie jest wystarczające dla potrzeb Twojej witryny, możesz użyć niestandardowego konwertera walut, aby obsłużyć konwersję i formatowanie kwot walut obcych. Takie podejście pozwala na pełną kontrolę nad tym, jak kwoty walutowe są wyświetlane na Twojej stronie.

Aby użyć niestandardowego konwertera walut, musisz zaimplementować funkcję currencyConverter w metodzie Zonos.init. Funkcja ta powinna akceptować następujące parametry:

• convertAndFormat - Funkcja, która konwertuje i formatuje kwotę waluty.
• originalAmount - Oryginalna kwota waluty.
• selector - Selektor elementu zawierającego kwotę waluty.

Gdy jest obecna, funkcja currencyConverter przejdzie przez wszystkie pasujące selektory cen na Twojej stronie i zastosuje niestandardową logikę konwersji walut do każdego z nich.

Jednym z powszechnych przypadków użycia funkcji niestandardowego konwertera walut jest sytuacja, gdy ceny są wyświetlane w menu rozwijanym lub innych złożonych elementach HTML. Na przykład, jeśli masz menu rozwijane z cenami wyświetlanymi obok każdej opcji, takich jak:

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

W przypadkach takich jak ten, nie możesz po prostu bezpośrednio wybrać ceny, ponieważ obok niej znajduje się dodatkowy tekst. Używając niestandardowego konwertera walut, możesz wyodrębnić cenę z elementu i zastosować do niej logikę konwersji walut.

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