DOCS

表示通貨のカスタマイズ

表示通貨のカスタマイズ

Helloが外国通貨の金額を表示する方法を上書きします。

JavaScript統合内で通貨表示形式をカスタマイズすることで、外国通貨の表示方法をニーズや好みに合わせて調整できます。

通貨表示形式 

Helloは以下の通貨表示形式をサポートしています:

  • symbol(デフォルト) - ローカライズされた通貨記号を表示します(例:€123)。
  • code - ISO通貨コードを使用します(例:123 USD)。
  • name - ローカライズされた通貨名を表示します(例:123 dollars)。

Zonos.init 関数の overrideCurrencyFormat プロパティを使用すると、通貨表示形式を上書きできます。このプロパティには、上記いずれかの通貨表示形式を指定できます。通貨表示形式の上書きは、HelloとZonos Checkoutの両方に適用されます。

1Zonos.init({
2 overrideCurrencyFormat: "code",
3});

カスタム通貨コンバーターの使用 

通貨表示形式を上書きするだけではサイトのニーズを満たせない場合は、カスタム通貨コンバーターを使用して、外国通貨額の変換とフォーマットを処理できます。この方法により、サイト上での通貨額の表示方法を完全に制御できます。

カスタム通貨コンバーターを使用するには、Zonos.init 関数内で currencyConverter 関数を実装する必要があります。この関数は、以下のパラメーターを受け取る必要があります:

  • convertAndFormat - 通貨額を変換してフォーマットする関数。
  • originalAmount - 元の通貨額。
  • selector - 通貨額を含む要素のセレクター。

currencyConverter 関数が存在する場合、サイト上の一致するすべての価格セレクターに対してループ処理を行い、それぞれにカスタム通貨変換ロジックを適用します。

カスタム通貨コンバーター関数の一般的な使用例は、ドロップダウンやその他の複雑なHTML要素内に価格が表示されている場合です。例えば、各オプションの横に価格が表示されるドロップダウンがある場合:

1

このような場合、価格の横に追加のテキストがあるため、価格を直接選択することはできません。カスタム通貨コンバーターを使用すると、要素から価格を抽出し、通貨変換ロジックを適用できます。

1window.Zonos.init({
2 currencyConverter: ({ convertAndFormat, originalAmount, selector }) => {
3 const optionValue = selector.getAttribute("data-select-option");
4 if (optionValue) {
5 return `${optionValue} - ${convertAndFormat(originalAmount)}`;
6 }
7 return convertAndFormat(originalAmount);
8 },
9});

このページは役に立ちましたか?


このページでは: