ヘルプ
ログイン

ソーシャルメディアで共有する画像の選択

Facebook や Pinterest などの SNS でオンラインストアへのリンクを共有すると、投稿にサムネイル画像を表示できます。

画像が添付された Facebook 投稿の例

このページの内容

「Shopify のすべての無料テーマ」では、オンラインストアから SNS にリンクを投稿すると、そのページのアイキャッチ画像が表示されます。以下のページタイプにはアイキャッチ画像があります。

  • 商品ページ
  • コレクションページ
  • ブログ記事

ホームページや「会社概要」ページなど、アイキャッチ画像がないページでは、オンラインストアの「ソーシャルメディアで共有する画像」が表示されます。

管理画面でのソーシャルメディア共有画像の設定

ストアの「オンラインストア」の「各種設定」で、ページのアイキャッチ画像が見つからない場合に使用するデフォルトの画像を追加できます。

SNS で共有される画像のプレビューを表示している管理画面の設定

手順：

  1. 管理画面から、オンラインストア > 各種設定に移動します。

  2. 「ソーシャルメディアでの共有画像と SEO」セクションで、新しい画像を追加するか、既存の画像を変更します。

  • 新しい画像を追加するには、[画像を追加] をクリックします。
  • 既存の画像を変更するには、[画像を変更] をクリックします。
  1. SNS に表示する画像をデバイスから選択します。
  2. [保存] をクリックします。

管理画面で画像を更新しても検索エンジンの検索結果に表示される画像が古い場合は、サイトマップを再送信する必要があります。

ロゴのフォールバック画像

「ソーシャルメディアで共有する画像」が手動でアップロードされていない場合、Shopifyはテーマに追加された画像をフォールバックとして使用します。Shopifyは、以下のいずれかのテーマ設定の値を使用する場合があります。

  • ヘッダー > ロゴ (推奨)
  • テーマ設定 > チェックアウト > ロゴ

ロゴのサイズが推奨ディメンションを満たしていない場合や背景が透明な場合は、Shopifyは [テーマ設定] > [カラー] > [背景] の色でエリアを塗りつぶします。この設定が利用できない場合は、Shopifyは [テーマ設定] > [チェックアウト] > [メインコンテンツエリア] > [背景色] を使用します。次の画像は、背景色がパディングとして使用されていることを示しています。

両側に赤いバーが追加されて長方形になった、正方形のストアロゴ

ソーシャルメディアで共有する画像の優先順位

[オンラインストア] > [各種設定] にある「ソーシャルメディアで共有する画像」は、他に画像が見つからない場合にフォールバックとして機能します。画像は、以下の優先順位で選択されます。

  1. テーマコードの画像：テーマファイルに直接ハードコーディングされた画像 (最優先)。
  2. テーマ設定の画像：SNSまたはチェックアウト用にテーマ設定にアップロードされた画像。
  3. オンラインストアの各種設定の画像：[設定] > [オンラインストア] > [ソーシャルメディアで共有する画像] にアップロードされた、デフォルトのフォールバック画像。

この階層により、テーマでの意図的なデザインが自動フォールバックよりも優先されます。

「ソーシャルメディアで共有する画像」フィールドが空白で表示される

[設定] > [オンラインストア] > [各種設定] の「ソーシャルメディアで共有する画像」フィールドが空白で表示される場合、ソーシャルメディアでの共有ではテーマ設定から画像が取得されている可能性があります。テーマエディタで、以下のロケーションにある画像を確認してください。

  • テーマ設定 > チェックアウト > ロゴ
  • テーマ設定 > SNSまたはソーシャルメディアでの共有

両方のロケーションが空白の場合、ソーシャルメディアでの共有では関連する画像を取得できず、フィールドは空白のままになります。オンラインストアの各種設定にある「ソーシャルメディアで共有する画像」フィールドに、手動で画像をアップロードできます。

ソーシャルメディアで共有する画像がSNSに表示されない

一部のテーマでは、SNSの投稿にはテーマ設定にアップロードされた画像のみが表示されます。[設定] > [オンラインストア] > [各種設定] に画像をアップロードしても、リンクを共有する際にその画像が表示されない場合は、テーマのSNS設定にも画像がアップロードされていることを確認してください。

画像をプレビューする

Shopifyの無料テーマは、Open Graphタグを使用して、SNSプラットフォームにウェブサイトに関する情報を提供します。Open Graphは、Facebook、Twitter、LinkedIn、Pinterestなどのサービスで使用されています。TwitterのCard Validator、FacebookのCrawler、LinkedInのPost Inspectorなどのツールで、一部のプラットフォームでソーシャルメディアで共有する画像がどのように表示されるかをプレビューできます。