テーマ設定

テーマ設定を使用して、オンラインストアのタイポグラフィー、色、SNSのリンク、およびチェックアウト設定を変更することができます。

テーマ設定を使用して、オンラインストアのタイポグラフィー、色、SNSのリンク、およびチェックアウト設定を変更することができます。 テーマ設定を変更すると、オンラインストア全体に変更が適用されます。

オンラインストアのさまざまな部分のカラーを選択できます。

色の設定をカスタマイズする

  1. [テーマ設定] をクリックします。
  2. [カラー] をクリックします。
  3. カラーピッカーを開くには、変更するコンテンツタイプカラーの色の見本をクリックします。[現在使用中] エリアには、テーマの別の部分で現在使用している色が表示されます。

    特定の16進カラーコードを設定するには、テキストフィールドをクリックして色を入力します。

    色を透明に設定するには、テキストフィールドから16進コード値を削除します。

  4. [保存] をクリックします。

色のグラデーションの設定方法などの色オプションについて詳しくは、「配色」を参照してください。

タイポグラフィー

オンラインストアのテキストに使用するフォントのスタイルおよびサイズを設定できます。システムフォントまたはカスタムフォントを選択できます。

ストアではシステムフォントの使用をおすすめします。システムフォントを使用すると、新しいフォントがお客様のコンピューターにダウンロードされることを防ぎ、ストアの読み込み速度に悪影響を及ぼさないようにすることができます。お客様のコンピューターに表示されるフォントは、オペレーティングシステムによって異なります。

タイポグラフィーの設定をカスタマイズする

  1. [テーマ設定] をクリックします。
  2. [タイポグラフィー] をクリックします。
  3. テキストのタイプごとに、[変更] をクリックしてフォントピッカーを使用します。
  4. 検索フィールドを使用するか、[さらに読み込む] をクリックして、利用可能なフォントを検索します。
  5. 使用するフォントの名前をクリックし、[選択] をクリックします。
  6. [保存] をクリックします。

フォントサイズをカスタマイズする

タイポグラフィーのテーマ設定内で、見出しと本文用のデフォルトのフォントサイズを設定できます。

手順:

  1. [テーマ設定] > [タイポグラフィー] の順にクリックします。
  2. 見出しのデフォルトのフォントサイズを変更するには、[フォント・サイズ・スケール] を使用してデフォルトのフォントサイズを選択します。最小のフォントサイズは100%で、最大のフォントサイズは150%です。スケール1目盛りごとにフォントサイズは5%増加します。デフォルトの設定は100%です。
  3. 本文のデフォルトのフォントサイズを変更するには、[フォント・サイズ・スケール] を使用してデフォルトのフォントサイズを選択します。最小のフォントサイズは100%で、最大のフォントサイズは130%です。スケール1目盛りごとにフォントサイズは5%増加します。デフォルトの設定は100%です。
  4. [保存] をクリックします。

レイアウト

レイアウトを使用すると、オンラインストアに表示される最大幅を設定できます。

  1. [テーマ設定] > [レイアウト] の順にクリックします。
  2. ドロップダウンメニューを使用して、1200ピクセルか1600ピクセルのレイアウトのいずれかを選択します。デフォルトの設定は1600ピクセルです。
  3. [保存] をクリックします。

SNS

商品やブログ記事用のSNSでの共有ボタン、SNSアカウントへのリンクを追加することができます。 SNSアカウントへのリンクは、オンラインストアのフッターに表示されます。

SNSの設定をカスタマイズする

  1. [テーマ設定] をクリックします。
  2. [SNS] をクリックします。
  3. SNSアカウントへのリンクを追加するには、[アカウント] の下にある所定フィールドに、アカウントへのリンクを入力します。その際には、https://instagram.com/shopify、またはhttps://twitter.com/shopifyなどの完全なリンクを入力します。
  4. [保存] をクリックします。

入力を検索

Online Storeには、お客様が検索フィールドに入力し始めると商品の提案が表示される、予測検索が組み込まれています。商品の提案により、お客様の検索クエリを明確にして絞り込むことができ、オンラインストアを検索する新しい方法を提供できます。また、お客様は、検索結果の別個のリストを確認するために現在のページを離れることなく、一致するものを素早く閲覧することもできるようになります。

次の検索設定をカスタマイズできます。

  • 商品のおすすめを有効にする - 商品のおすすめを有効または無効にする。
  • 販売元を表示する - 商品のおすすめで販売元を表示または非表示にする。
  • 価格を表示する - 商品のおすすめで価格を表示または非表示にする

入力を検索する設定を変更する

  1. [テーマ設定] をクリックします。
  2. [入力を検索] をクリックします。
  3. 設定を使用して、ストアの検索動作をカスタマイズします。
  4. [保存] をクリックします。

商品のおすすめがどのように機能するかについて詳しくは、「予測検索」を参照してください。

ファビコン

オンラインストアのブランディングに役立つ、お気に入りアイコン「ファビコン」を追加できます。ファビコンは、以下のいずれかの場所に表示できます。

  • ウェブブラウザーのタブ
  • ウェブブラウザーの履歴
  • デスクトップのアイコン
  • ブックマークされたオンラインストア名の横

ファビコンについて詳しくはこちらをご覧ください。

ファビコンをカスタマイズする

  1. [テーマ設定] をクリックします。
  2. [ファビコン] をクリックします。
  3. ファビコン画像エリアで [画像を選択する] をクリックのうえ、次のいずれかの操作を行います。

    • 管理画面にすでにアップロードしている画像を使用するには、画像をクリックして選択し、[選択] をクリックします。
    • ローカルコンピューターの画像を使用するには、[アップロード] をクリックします。コンピューターの画像を選択し、[開く] をクリックしてアップロードを開始します。アップロードが完了すると、画像は自動的に選択されます。[選択] をクリックします。
    • 無料の画像を選択するには、[無料の画像] をクリックし、画像を検索またはクリックして選択します。
  4. ファビコン画像に代替テキストを追加するには、以下の手順を実行します。

    1. [代替テキストを編集] をクリックします。
    2. [画像を編集する] ウィンドウで、画像の説明を簡潔に入力します。
    3. [保存] をクリックします。

通貨形式

商品、カート、チェックアウトの価格に、通貨コードが常に表示されるように設定できます。

  1. [テーマ設定] をクリックします。
  2. [通貨フォーマット] をクリックします。
  3. 通貨コードを有効にするには、[通貨コードを表示] チェックボックスをクリックします。
  4. [保存] をクリックします。

チェックアウト

このセクションでは、ストアのチェックアウトをカスタマイズできます。ストアのチェックアウトページの詳細については、「Shopifyのチェックアウト」を参照してください。

テーマスタイルを変更する

テーマスタイルとは、テーマデザイナーが選択した設定のコレクションのことです。テーマスタイルをストアに適用すると、洗練された見た目と雰囲気を実現することができます。すべてのテーマには、デフォルトで適用されるテーマスタイルがあります。テーマをカスタマイズするときは、テーマスタイルの設定を自分の設定に置き換えます。テーマスタイルをテーマに適用すると、現在の設定 (色やタイポグラフィーなど) が変更されます。

手順:

  1. [テーマ設定] > [スタイル] の順にクリックします。

  2. ドロップダウンメニューを使用し、テーマスタイルのオプションを選択します。利用可能なオプションは、ご利用のテーマによって異なります。

  3. [保存] をクリックします。

変更を元に戻す、またはやり直す

[元に戻す] ボタンをクリックすると直近の変更を取り消し、[やり直す] ボタンをクリックすると取り消した変更をやり直します。[元に戻す] ボタンを2回以上クリックし続けると、操作を1つずつ元に戻すことができます。元に戻すボタンおよびやり直すボタンは、テーマエディタツールバーにあります。

テーマエディタツールバーにある [元に戻す] ボタンと [やり直す] ボタン

[元に戻す] ボタンをクリックすると、以下の変更を元に戻すことができます。

  • セクションの追加、順序変更、削除
  • [テーマ設定] タブでのカラー、フォント、およびその他の設定の適用
  • テーマスタイルをリセットする

Shopifyで販売を開始する準備はできていますか?

無料体験を試す