Shopify(ショッピファイ、ショピファイとも呼ぶ)で構築されたストアでは初期状態の価格表示が「¥1,300JPY」といったようにあまり見かけない形式になっています。この記事ではShopifyストアで通貨の表示方法を変更して見た目を整える方法を紹介します。
「設定」> 「一般設定」 > 「ストアのデフォルト」にある「通貨表示」のメニュー「・・・」をクリックし、「通貨のフォーマットを変更」を選択します。
すると下記のようなダイアログが表示されます。
通貨表示が含まれているHTML | ¥{{amount_no_decimals}} JPY |
通貨表示が含まれていないHTML | ¥{{amount_no_decimals}} |
通貨表示が含まれているメール | ¥{{amount_no_decimals}} JPY |
通貨表示が含まれていないメール | ¥{{amount_no_decimals}} |
「{{amount_no_decimals}}」という部分に金額の数字が代入されて表示されます。「no_decimals」とは小数点以下を表示しない形式のことで、日本ではこれが一般的であるためこのような初期設定になっています。
アメリカドルなどを利用する場合、例えば1ドル25セントの金額は「1.25 USD」といった表記が一般的になるのでこれが変わってきます。
「{{amount_no_decimals}}」の形式を崩さないように、それ以外の部分を変更しましょう。例えば下記のように変更できます。
通貨表示が含まれているHTML | {{amount_no_decimals}} 円 |
通貨表示が含まれていないHTML | {{amount_no_decimals}} 円 |
通貨表示が含まれているメール | {{amount_no_decimals}} 円 |
通貨表示が含まれていないメール | {{amount_no_decimals}} 円 |
こうすることでShopifyストア上の様々な場所での金額表示が設定したものに変更されます。
またこの設定にはHTMLを適用できるため、金額部分に装飾をしたい場合は下記のような設定も可能です。
通貨表示が含まれているHTML | <span style=”color:red”>{{amount_no_decimals}} 円 </span> |
通貨表示が含まれていないHTML | <span style=”color:red”>{{amount_no_decimals}} 円 </span> |
通貨表示が含まれているメール | <span style=”color:red”>{{amount_no_decimals}} 円 </span> |
通貨表示が含まれていないメール | <span style=”color:red”>{{amount_no_decimals}} 円 </span> |
spanタグで囲ってスタイルを適用することで金額表示を赤くしています。
この記事ではShopifyストアで通貨を表示する際のフォーマット変更の方法を紹介しました。日本円の初期設定はやや不自然ですので、普段から見慣れた表示にしたいという運営者様も多いかと思います。その際の参考になれば幸いです。