ShopifyでECサイトを運営するうえで、画像や動画、PDFなどのファイルを正しく扱うことはとても重要です。商品ページの魅力を高めたり、取扱説明書を配布したりと、ファイルの活用シーンは多岐にわたります。
しかし、対応しているファイル形式や要件などを正しく理解していないと、思わぬエラーや表示崩れにつながることもあるでしょう。
本記事では、Shopifyがサポートしているファイル形式と要件、容量の上限、アップロード・ダウンロードの方法、画像ファイルの編集方法まで、画像付きでわかりやすく解説します。これからShopifyでファイルを活用したい方は、ぜひ参考にしてください。
Shopifyがサポートしているファイルについて
はじめにShopifyがサポートしているファイルについて、形式や要件、ファイル容量の上限を解説します。
Shopifyがサポートしているファイル形式と要件
Shopifyには画像・動画・ドキュメントなどさまざまな形式のファイルをアップロードできます。アップロードしたファイルは、ページや商品説明、ブログ記事などに挿入したり、顧客がダウンロードできるようにしたりする用途に使えます。
Shopifyがサポートしているファイルと要件は以下の通りです。
画像ファイルの要件
| 画像サイズ | 最大20MB |
|---|---|
| 解像度 | 最大20MP（商品画像が25MPまで） |
| アスペクト比 | 100:1～1:100 |
| ファイル形式 | JPEG、PNG、WEBP、HEIC、GIF |
| ファイル名 | 文字、数字、スペース、記号を使用可能 ※ファイル名はピリオドで始められません ※末尾にpico、icon、thumb、testing、small、compact、medium、large、grandeは使用不可 |
ビデオファイルの要件
| ファイルサイズ | 最大1GB |
|---|---|
| 解像度 | UHDの最大解像度 |
| 動画の長さ | 最長10分 |
| ファイル形式 | MOV、MP4、WEBM |
| 最小の幅と高さ | 100ピクセル |
| 最大の幅と高さ | 4096ピクセル |
| 最大フレームレート | 120フレーム/秒 |
| 最小動画尺 | 0.25秒 |
| ファイル名 | 文字、数字、スペース、記号を使用可能 ※ファイル名はピリオドで始められません |
※上記の制限は、「Vimeo」と「YouTube」の埋め込みリンクには適用されません。
一般的なファイルの要件
| ファイルサイズ | 最大20 MB |
|---|---|
| ファイル形式 | HTML以外のファイル形式（PDF、DOC、CSV、PPTXなど） |
| ファイル名 | 文字、数字、スペース、記号を使用可能 ※ファイル名はピリオドで始められません |
上の3つの表で挙げたファイル形式と要件を満たしていれば、Shopifyにアップロードできます。
Shopifyプランごとのファイル保存容量の上限
Shopifyにアップロードできるファイルの合計容量には上限があり、プランによって異なります。最も安価なStarterプランでも100GBあるため、多くのストアにとっては十分な容量でしょう。
ただし、商品画像や動画などを多数扱う場合には上限に達することもあります。その際は、不要なファイルを削除するか、上位プランへのアップグレードを検討してください。
| プラン名 | ファイル容量の上限 | ビデオおよび3Dモデルの数量上限 | ビデオ保存容量の上限 |
|---|---|---|---|
| Starter | 100GB | 250 | 50GB |
| Retail | 100GB | 250 | 50GB |
| Basic | 100GB | 250 | 50GB |
| Grow | 300GB | 1,000 | 500GB |
| Advanced | 500GB | 5,000 | 500GB |
| Plus | 1TB | 50,000 | 1TB |
| エンタープライズ | 10TB | 50,000 | 2TB |
※本記載は2025年8月時点の情報を元にしています。
Shopifyにファイルをアップロードする方法
ここでは、Shopifyストアにファイルをアップロードする手順を解説します。
Shopifyの管理画面のメニューにある「コンテンツ」を選択。サブメニューの中にある「ファイル」を選択し、右上の「ファイルをアップロード」をクリックします。
画像出典：Shopify
続いて、アップロードしたいファイルを選択します。
以下の画像のように、ファイルがアップロードされました。
この「ファイル」の画面に、ファイルをドラッグアンドドロップしてもアップロードできます。また、複数のファイルをまとめてアップロードすることも可能です。
アップロードしたファイルは、テーマ編集画面のセクションやブロックにあるファイルピッカーで選択できます。
なお、ファイルピッカーから「ファイルを追加」でファイルをアップロードした場合にも、「コンテンツ」メニューの「ファイル」にファイルが追加されます。
ファイルのアップロード方法は以上です。
Shopifyにアップロードした画像ファイルの編集方法
Shopifyにアップロードした画像ファイルは、管理画面から簡単に編集できます。ここでは、その編集方法を解説します。
Shopifyの管理画面より、「コンテンツ」 > 「ファイル」の順に選択し、編集したいファイルを選択。以下のような画面が表示されますので、赤枠の箇所で編集を行います。
編集できる項目は以下の通りです。
- 情報
- 名前：ファイル名を変更します
- 代替テキスト：画像が読み込めない場合にテキストを表示します
- 切り抜きと変形
- Orientation：画像を比率に応じて、または自由形式で切り抜き・トリミングします
- 反転：画像を反転させます
- 回転：画像を回転させます
- サイズ変更：画像のサイズをピクセル単位で変更します
- 描画：画像内に描画をします
また、画像をクリックして「フォーカルポイント」を設定できます。
フォーカルポイントとは、画像の中で特に見せたい部分を指定する機能です。これを設定すると、テーマが画像を自動的にトリミング（切り抜き）しても、そのポイントが常に表示されるようになります。画面サイズやアスペクト比が異なる場合でも重要な部分を見せられるため、商品写真やバナーをきれいに見せたいときに便利です。1枚の画像につき1つ設定でき、後から変更や削除も可能です。
テーマ編集で指定できないファイルのURLを取得する方法
通常、Shopifyにアップロードしたファイルはファイルピッカーから選択できます。しかし、ファイルピッカーがなく、テーマ編集画面で指定できない場合があります。例えば以下のようなケースです。
- カスタムセクションなどで、コードを記述して、画面に画像ファイルを出力したい場合
- 画面内のボタンにPDFファイルを開くリンクを設置したい場合
このようなケースにおいては、ファイルのURLを取得することで対処可能です。
Shopifyの管理画面より、「コンテンツ」 > 「ファイル」の順に選択。指定したいファイルにマウスオーバーすると、右に「リンクをコピー」のボタンが表示されますので、クリックします。
これでファイルのリンク（URL）を取得できました。
コピーしたリンクを適切な箇所に設置すると、画像が表示されます。以下の画像はカスタムセクションにコードを記述して画像を出力するケースです。src属性の属性値に、画像のリンクを貼り付けています。
もう一つ、例を紹介します。PDFファイルをアップロードしておき、メニューやボタンの「リンク」の箇所にPDFファイルのリンクを設置します。こうすることで、メニューやボタンをクリックした際に、PDFファイルを表示させることが可能です。
ファイルピッカーがなくファイルを指定できない場合には、上記の方法でリンクを取得して表示しましょう。
Shopifyでコンテンツのファイルをダウンロードする方法
Shopifyにアップロードしたファイルは、元のデータを削除してしまった後でもダウンロードできます。
Shopifyの管理画面より、「コンテンツ」 > 「ファイル」の順に選択。ダウンロードしたいファイルを選択し、画面右上に表示される「ダウンロード」をクリックします。
これでファイルを端末にダウンロードできます。
Shopifyがサポートしているファイルについて理解し、適切に管理しよう
この記事ではShopifyがサポートしているファイル形式と要件、容量の上限、アップロード・ダウンロードの方法、そして画像ファイルの編集方法などを解説しました。
ShopifyでECサイトを運営する際には、商品画像や動画、説明資料など多数のファイルを扱います。サポートしているファイル形式や容量の上限を理解し、正しい手順でアップロード・編集・ダウンロードを行うことで、サイトの表示品質や運営効率が向上します。不要なファイルは定期的に整理し、容量を有効活用することも大切です。
今回の内容を参考に、自社のストアにおけるファイル管理方法を見直してみてください。
