ストアにファビコンを追加する

ファビコン (お気に入りアイコン) とは、ウェブページの名前の横に表示される小さな画像またはロゴのことです。ファビコンは、ブラウザのタブのほか、ブックマークページなど、ウェブサイトを一覧表示するブラウザページに表示されます。オンラインストアにファビコンを追加すると、ブランドを強化し、洗練されたウェブサイトの外観にすることができます。

ファビコンを作成する

無料のファビコンジェネレーターサイトを使用してカスタムファビコンを作成するか、自分で作成することができます。ファビコンジェネレーターを見つけるには、インターネットで free favicon generator を検索してください。

ファビコンの理想的な画像サイズは、16 x 16 ピクセルまたは 32 x 32 ピクセルのいずれかです。ファビコンの画像サイズが大きすぎる場合は、Shopify にアップロードされると 32 x 32 ピクセルに縮小されます。

オンラインストアにファビコンを追加する

Basic プラン以上をご利用の場合、オンラインストアにファビコンを追加できます。Starter プランをご利用の場合は、オンラインストアにファビコンを追加することはできません。

手順:

デスクトップ
  1. 管理画面から、[オンラインストア] > [テーマ] に移動します。

  2. ファビコンを追加するテーマを見つけ、「テーマを編集」をクリックします。

  3. 歯車アイコンをクリックして、「テーマ設定」にアクセスします。

  4. テーマのバージョンに応じて、「ロゴ」または「ファビコン」をクリックします。

  5. 「ファビコン画像」セクションで、「画像を選択」をクリックし、次のいずれかを行います。

    • 管理画面にすでにアップロードされている画像を選択するには、画像を検索または見つけ、チェックボックスでその画像を選択します。
    • ローカルコンピューターから画像を選択するには、「画像を追加」をクリックしてローカルコンピューターから画像を開き、チェックボックスでその画像を選択します。
  6. 「完了」をクリックします。

  7. 任意:次の操作を行って、ファビコン画像に代替テキストを追加します。

    1. 「ファビコン画像」セクションで、「編集」をクリックします。
    2. 「プレビューと編集」ダイアログの「代替テキスト」フィールドに、画像の簡単な説明を入力します。
    3. 「保存」をクリックします。
  8. 「保存」をクリックします。

モバイル
  1. Shopify アプリから、Menu アイコンをタップします。

  2. 「販売チャネル」セクションで、「オンラインストア」をタップします。

  3. 「すべてのテーマを管理」をタップします。

  4. ファビコンを追加するテーマを見つけ、「テーマを編集」をタップします。

  5. 「...」 > 「テーマ設定」の順にタップします。

  6. テーマのバージョンに応じて、「ロゴ」または「ファビコン」をタップします。

  7. ファビコン画像セクションで、画像を選択をタップし、次のいずれかの操作を行います。

    • 管理画面にすでにアップロードされている画像を選択するには、画像を検索または見つけ、チェックボックスでその画像を選択します。
    • ローカルデバイスから画像を選択するには、「画像を追加」をタップしてローカルデバイスから画像を開き、チェックボックスでその画像を選択します。
  8. 「完了」をタップします。

  9. 次の操作を行って、ファビコン画像に代替テキストを追加します。

    1. 「ファビコン画像」セクションで、「編集」をタップします。
    2. 「プレビューと編集」ダイアログの「代替テキスト」フィールドに、画像の簡単な説明を入力します。
    3. 「保存」をタップします。
  10. 「保存」または「✓」をタップします。

ファビコンのトラブルシューティング

ファビコンに問題がある場合は、次のトラブルシューティングの手順を確認してください。

Google検索結果にファビコンが表示されない場合のトラブルシューティング

Googleの検索結果にファビコンが表示されない場合は、ストア情報がクロールされるように、Googleにサイトマップを送信していることを確認してください。

Googleのドキュメントによると、すべてのガイドラインを満たしている場合でも、検索結果にファビコンが必ず表示されるとは限りません。

お客様アカウントページまたはチェックアウトページにファビコンが表示されない場合のトラブルシューティング

Shopify Plus プランをご利用でない場合、お客様アカウントページとチェックアウトページにファビコンは表示されません。また、テーマエディタは管理画面の一部であり、公開中のストアフロントを反映するものではないため、テーマエディタでテーマを表示している際にもファビコンは表示されません。

Shopify Plus プランを利用していて、お客様アカウントページとチェックアウトページにファビコンを設定する場合、Branding API または Checkout Blocks を使用する必要があります。ファビコンは自動的には表示されず、管理画面のテーマエディタやチェックアウトエディタで設定することはできません。Branding API の使用に関する詳細については、以下の開発者向けドキュメントを参照してください。