Shopify

Shopifyでフォントを変更しよう:文字もデザインの一部

Shopifyは柔軟性の高いプラットフォームで、多くのデザインオプションがあります。しかし、デフォルトのテンプレートは日本語フォントに最適化されていない場合が多いです。この記事では、Shopifyストアにカスタムフォント(特に日本語フォント)を追加する方法をご紹介します。

Shopifyのデフォルト機能を利用する

Shopifyの管理画面を使い、簡単にフォントを変更できます。この機能は特に英字フォントの変更に便利で、以下の手順で変更できます。

  1. 管理画面から「オンラインストア > テーマ > カスタマイズ」を開きます。
  2. 「テーマ設定」から「文字フォント」を選択し、利用可能なフォントを確認し変更します。

Google Fonts活用のすすめ

Shopifyは海外企業が作ったECプラットフォーム。そのため日本語向けのフォントがほぼ無いと言っても過言ではなりません。そこで「Google Fonts」を使用するケースが多いです。

Google Fontsは無料で幅広い言語のフォントを提供しており、特に「Noto Sans Japanese」が人気。Google Fontsのサイトから必要なコードを取得し、Shopifyに組み込むことで、より多様なフォント選択が可能になります。

実際にコーディングでGoogle Fontsを実装するとなると、コーディング知識が必要となるため、Shopifyパートナーにご相談されることをオススメします。

コーディング知識がある場合は下記を参考にされると良いでしょう。少し古い記事なので画面が最新のものと若干異なりますが役に立つはずです。

【Shopify マスターへの道】#9 サイトのフォントを編集しよう

フォント変更アプリ「Fontify」を活用

Fontifyアプリを使用すると、コーディングの知識がなくてもフォントを追加できます。このアプリは簡単に設定でき、Shopifyテーマに対応しており、特定のタグにフォントを適用できます。

使い方はいたってシンプル。

  1. フォントの選択:
    • Fontifyの「Google Fonts」タブを開きます。
    • 「Choose」の欄をクリックし、希望のフォント(例: Noto Sans JP)を検索します。
    • フォントのスタイルとウェイトをプルダウンメニューから選択し、「+」マークをクリックして元の画面に戻ります。
  2. フォントの適用:
    • 設定したい要素(例: H1~H6、p、liリスト)をチェックします。
    • 「Add Font」ボタンをクリックすると、最大30秒でShopify Storeに反映されます。

ABOUT ME
さすー
2020年からShopifyに注力し、越境ECサイト構築をメインとして従事。海外のWebマーケティング企業に対してECサイト制作の支援を行い、制作部門の立ち上げにも関与。また書籍「はじめての越境EC・海外Webマーケティング」の執筆に協力。最近ではChatGPTなどの生成AIを活用したITソリューションにも取り組み、企業への導入実績もある。