商品画像

注目のリンク

1. help.shopify.comの参考リソース：パートナーディレクトリ
2. 商品管理に関するShopifyドキュメント
3. 商品メディアの追加に関するShopifyドキュメント
4. Shopify管理画面の商品ページ
5. メタフィールドに関するShopifyドキュメント
6. 動画と3Dモデルのホスティング上限に関するShopifyドキュメント
7. 3Dスキャナーに関するShopifyドキュメント
8. メディアへの代替テキスト追加に関するShopifyドキュメント
9. 対応する商品メディアテーマに関するShopifyドキュメント
10. メディア対応の追加に関するShopify開発者ドキュメント

役立つ動画

商品画像の動画

商品画像の動画

商品メディアの基本

Company XYZ Alignストアでは、Shopifyの商品メディアを使用して、実物商品、デジタルダウンロード、サービス、ギフトカードを紹介できます。商品詳細とメディアを追加し、サイズやカラーなどのオプション用にバリエーションを作成します。

商品を追加または更新するときに、1つ以上の販売チャネルで販売可能にできます。Shopify管理画面の商品から商品とバリエーションを管理します。

商品メディアを追加する

各商品には、画像、3Dモデル、動画を最大250個追加できます。動画と3Dモデルはストア全体のホスティング上限にもカウントされ、上限はプランによって異なります。詳しくは動画と3Dモデルのホスティング上限を参照してください。

iOS対応デバイスでは、Shopify Mobileアプリの3Dスキャナー機能を使用して、3Dモデルをスキャンして作成することもできます。

商品の最初のメディア項目が、注目の商品メディアまたはメインメディアになります。Shopifyでは、このメインメディアをコレクションページ、カートページ、チェックアウトページ、ホームページで使用します。メインメディアはいつでも変更できます。

商品にメディアを追加する

1. Shopify管理画面から商品に移動します。
2. 編集する商品を選択します。
3. メディアセクションで、次のいずれかの方法を使用して画像、3Dモデル、動画を追加します。
   • 新しくアップロードを選択し、アップロードするファイルを選択します。
   • ファイルをメディアセクションにドラッグ＆ドロップします。
   • 既存のものを選択を選択し、すでに所有しているメディアファイルから選択します。
   • URLからファイルを追加するには、既存のものを選択を選択してから、URLから追加を選択します。

メインの商品メディアを変更する

1. Shopify管理画面から商品に移動します。
2. 編集する商品を選択します。
3. メディアセクションで、使用するメディア項目を最初の位置にドラッグします。

商品メディアを削除する

メディアは1つずつ削除することも、複数の項目を一括削除することもできます。

1つのメディア項目を削除する

ファイルがストア内の別の場所で使用されている場合、ここで削除しても、この商品からのみ削除されます。

1. Shopify管理画面から商品に移動します。
2. 編集する商品を選択します。
3. メディアセクションで、削除するメディア項目を選択します。
4. ゴミ箱アイコンを選択します。
5. ファイルを削除を選択します。

メディアを一括削除する

選択したファイルがストア内の別の場所で使用されている場合、編集中の商品からのみ削除されます。

1. Shopify管理画面から商品に移動します。
2. 編集する商品を選択します。
3. メディアセクションで、チェックボックスを使用して削除するメディア項目を選択します。
4. ファイルを削除を選択します。
5. 削除を選択します。

動画と3Dモデル

3Dモデルと動画は、商品バリエーションのメディアとして使用できません。

Alignの商品ページで3Dモデルや動画を使用する前に、インストール済みのバージョンがそのメディアタイプに対応していることを確認してください。Shopifyでは、3Dモデルと動画に対応するテーマの一覧を管理しています。古い対応バージョンを使用している場合は、必要に応じて更新してください。

メディアに対応するようAlignのコードをカスタマイズする場合は、テーマにメディア対応を追加する方法に関するShopifyのガイダンスと、メディアUXガイドラインを確認してください。Align固有のガイダンスについては、Company XYZのドキュメントを参照するか、Company XYZサポートにお問い合わせください。

Videoと3Dモデルのホスティング上限

ストアには、商品メディアとファイルページにあるShopifyホスティングの動画および3Dモデルを対象とした合計上限があります。3Dモデルの上限はプランによって異なります。

Starter	Basic Shopify	Shopify	Advanced Shopify	Shopify Plus
250	250	1000	5000	Shopify Plusサポートにお問い合わせください

ノート

すべてのプランで、1つの商品に一度に保存できるメディアファイルは、種類を問わず最大250個です。

メタフィールドを使用して商品メディアを追加する

商品メディアをオンラインストアで表示する方法をより細かく管理したい場合は、メタフィールドを使用します。商品のファイル参照メタフィールドを作成して表示用の画像をアップロードしたり、別のファイルタイプを作成して顧客がダウンロードできるようにしたりできます。

ファイル参照メタフィールドでは、JPEG、PNG、WEBP、SVG、HEIC、GIFの画像を表示できます。各メタフィールドに含められるファイルは一度に1つだけです。

商品画像の編集を元に戻す

トリミング、サイズ変更、マジック編集が不要になった場合は、エディターの上部にある元に戻すを使用して、画像を元の状態に戻します。

ノート

元に戻すは、以前に編集したメディアをプレビューしている間のみ使用できます。操作を確定すると、ファイルは元の状態に戻ります。このオプションは、2024年1月以降に行った商品メディアの編集でのみ使用できます。

商品メディアのタイプ

顧客は商品ページで画像などの商品メディアを確認します。動画、3Dモデル、拡張現実を使用すると、顧客が商品をより明確に理解でき、購入への信頼感とショッピング体験の向上につながります。

必要な仕様を満たす高品質のメディアを使用して、正しく表示されるようにします。すべてのテーマが商品画像に対応していますが、動画と3Dモデルには、インストール済みのAlignバージョンでの対応が必要です。

画像

商品画像は、オンラインストアやShopify POSなど、販売チャネル全体に表示されます。ほとんどの商品画像ではPNGが最適なファイルタイプで、次にJPEGが適しています。

その他に使用できる画像タイプはPSD、TIFF、BMP、GIF、SVG、HEIC、WebPです。Shopifyの画像サービスは、顧客のウェブクライアントでサポートされる最適な形式を選択します。具体的な表示はAlignの設定とテンプレートによって異なりますが、すべてのテーマが商品画像に対応しています。

商品画像とコレクション画像は最大5000 x 5000 px、または25メガピクセルまで使用でき、ファイルサイズは20 MB未満である必要があります。高解像度の写真を使用すると、通常、商品をより洗練されたプロフェッショナルな印象にできます。

正方形の商品画像では、通常2048 x 2048 pxが最適です。写真撮影に関するガイダンスについては、Shopify Blogの美しい商品写真を撮影するための決定版DIYガイドをお読みください。

ヒント

商品画像は、コレクションページで異なるサイズの画像として横並びに表示される場合があります。同じアスペクト比、つまり高さと幅の比率を使用して、注目画像の見た目を統一してください。

画像を追加すると、Shopifyはテーマ内の異なる領域で使用するために、異なるサイズの画像を自動的に作成します。たとえば、商品詳細ページには大きいバージョンを表示し、大きな画像が不要なコレクションテンプレートには、よりコンパクトなバージョンを表示できます。

追加の画像を探す

オンラインストア用のロイヤリティフリー画像が必要ですか？Burstから高解像度の商品写真やライフスタイル写真をダウンロードできます。

3Dモデル

3Dモデルは、物体を仮想的に三次元で表現したものです。顧客が商品のサイズ、スケール、詳細をよりよく理解するのに役立ちます。

顧客は商品ページで3D商品モデルを表示できます。モデルはデバイスのカメラと画面を使用して、顧客の環境に商品を配置するため、顧客はあらゆる角度から商品を確認できます。

オンラインストアに3Dモデルを追加する前に、ファイルが次の要件を満たしていることを確認してください。

1. ファイルサイズ 最大500 MB
2. ファイルタイプ GLBまたはUSDZ

15 MBを超える3Dモデルをアップロードすると、Shopifyはファイルサイズを削減し、読み込み速度を向上させるために最適化します。

モデルサイズ	最適化	変換
15 MB未満	モデルは最適化されません。ジオメトリとマテリアルは変更されません。	AndroidおよびiOSベースのデバイスに対応するため、ファイルは.USDZと.GLBの両方のバージョンに変換されます。
15 MB超	モデルは最適化されます。元のファイルの視覚的な出力を維持しながら、ジオメトリとテクスチャが最適化されます。	AndroidおよびiOSベースのデバイスに対応するため、ファイルは.USDZと.GLBの両方のバージョンに変換されます。

動画

商品動画は次のいずれかの方法で追加します。

1. 動画ファイルをアップロードします。
2. YouTubeまたはVimeoの動画リンクを埋め込みます。

アップロードする動画ファイルは、次の要件を満たす必要があります。

1. 動画の長さ 最大10分
2. 動画サイズ 最大1 GB
3. 動画解像度 最大4K、または4096 x 2160 px
4. 動画ファイルタイプ .mp4または.mov

これらのファイル要件は、埋め込んだYouTubeまたはVimeo動画には適用されません。その他の動画プロバイダーのURLには対応していません。

ストリーミングに対応するブラウザでは、閲覧者の接続速度とアップロードされた動画の解像度に基づき、動画が480p、720p、または1080pで表示されます。ストリーミングに対応していないブラウザでは、利用可能な最高解像度で表示されます。

Shopify管理画面またはShopifyモバイルアプリから画像、3Dモデル、動画を追加できます。

3Dモデルと動画に対するAlignの対応

インストール済みのAlignバージョンが3Dモデルと動画に対応している場合がありますが、互換性はShopifyテーマライブラリのバージョンによって異なります。Alignを更新またはカスタマイズする前に、Company XYZのドキュメントを確認してください。Align固有の動作についてサポートが必要な場合は、Company XYZサポートにお問い合わせください。Shopify管理画面、プラン、アカウント、プラットフォームのホスティングに関する質問は、Shopifyサポートにお問い合わせください。

使用上の注意

1. 最初の項目は慎重に選択してください。 最初のメディア項目が、顧客向けの主要なページ全体に表示されるメインの商品メディアになります。
2. メディアの量を計画してください。 商品あたり250ファイルの上限を考慮し、大規模なカタログをアップロードする前に、ストア全体の動画と3Dモデルの上限を確認してください。
3. 画像の一貫性を保ってください。 高品質でアスペクト比が統一された画像を使用してください。特にコレクションに表示される注目画像では重要です。
4. まずAlignの対応状況を確認してください。 これらの形式を使用する前に、インストール済みのAlignバージョンが動画と3Dメディアに対応していることを確認してください。
5. 用途に合わせたメディアにはメタフィールドを使用してください。 ファイル参照メタフィールドには1つのファイルが保存されるため、テーマで商品固有の補助メディアを表示するよう設定している場合に便利です。
6. 元に戻す前に編集内容を確認してください。 編集した画像を元に戻すと元のファイルに戻るため、トリミング、サイズ変更、マジック編集が不要になったことを確認してください。