Shopify推奨の商品画像サイズとリサイズ方法まとめ|一括編集におすすめアプリも紹介

  • このエントリーをはてなブックマークに追加

この記事の所要時間:4分

ネットショップにとって商品画像はとても重要な要素です。

商品画像にこだわることで顧客に商品の魅力を正しく伝えることができ、ブランドの信頼性にもつながります。

そんな商品画像ですが、Shopifyには推奨の画像サイズやファイル拡張子があります。

今回は、そんなShopifyの商品画像について解説します。また商品画像の編集方法や、一括で画像をリサイズするアプリも合わせてご紹介します。

Shopifyの商品画像について

Shopifyの商品画像はネットショップだけではなく、Shopify POSやInstagramといった他の販売チャネル上にも表示されます。

そのため、Shopifyで利用する商品の画像は正方形で統一することをオススメします。また商品の画像サイズは、「2048 x 2048ピクセル」が推奨されています。

画像ファイルの形式は「PNG」が推奨されています。その次に「JPEG」「GIF」です。

その他にも「PSD」「TIFF」「BMP」などのファイル拡張子も使用することができますが、これらはアップロード時に「JPEG」もしくは「PNG」に変換されます。

3Dデータを使用できるテーマでは「GLB形式」のファイルが使用可能です。

ネットショップで画像が表示される正確な方法はテーマによって異なるので、必ず事前に確認するようにしましょう。

またShopifyの商品画像では、20MB以上のサイズの画像を使用することができず、1商品につき登録できる画像数は250枚までと制限があります。

Shopifyで商品画像を編集する

Shopifyに商品データを追加する際に、商品画像はドラッグ&ドロップで追加します。また商品画像を追加した後に、Shopify上で画像を編集することができます。

商品画像を編集する方法は、「商品管理 > すべての商品」をクリックし、編集する商品を選択します。

次に編集画面にあるメディア欄の画像をクリックします。

商品画像を編集する方法は、「商品管理 > すべての商品」をクリックし、編集する商品を選択します。次に編集画面にあるメディア欄の画像をクリックします。

画面右側にある「代替テキスト」には画像を説明する文章を入力することでSEO対策になります。

画面左下にあるアイコンで画像を編集することができます。

画面右側にある「代替テキスト」には画像を説明する文章を入力することでSEO対策になります。画面左下にあるアイコンで画像を編集することができます。

Shopifyでできる画像編集は以下の3つです。

・画像のトリミング
・画像の描画
・画像のリサイズ

編集が完了したら「保存する」をクリックして完了です。

画像をまとめてリサイズするアプリ「Photo Resize」

Photo Resizeについて

Shopifyでは商品画像をすべて正方形で揃えることが望ましいですが、画像を一つずつ編集していくのはとても大変です。

そんな時に活用すべきオススメのアプリが「Photo Resize」です。

Photo Resizeは、Shopifyに登録された画像を一括でリサイズするShopifyアプリです。すべての画像を自動で読み取り、数クリックで指定のアスペクト比(画像の縦と横の長さの比)にリサイズします。

プランと料金

Photo Resizeのプランと料金は以下のとおりです。

フリーベーシックプロアンリミテッド
月額利用料無料4ドル19ドル79ドル
画像数50枚100枚1000枚無制限
超過の追加料金0.05ドル/枚0.05ドル/枚0.05ドル/枚無料
元ファイルの保存期間7日間30日間30日間30日間
サイズ変更オプション×
自動サイズ変更×

無料プランでは50枚までリサイズすることができます。その後は1枚につき0.05ドルの従量課金制です。

プランによってリサイズ可能な画像数やファイルの保存期間が変動します。

また、無料プランでは正方形にのみリサイズが可能ですが、有料プランではアスペクト比を選択することができます。

無料プランでは、画像をリサイズする際に画像の読み込みが必要になり、読み込みに時間がかかってしまいます。

一方で有料プランは、商品画像をShopifyに追加するたびに自動で画像が読み込まれるので、リサイズに時間がかかりません。

Photo Resizeの使い方

では、Photo Resizeの使用方法について説明します。

商品画像をリサイズする

まずは、コチラからアプリをインストールします。インストールが完了したらPhoto Resizeの画面に遷移します。

画面中央にある「Analyze shop images」をクリックすると画像を読み込みます。(読み込みには多少の時間がかかります)

画面中央にある「Analyze shop images」をクリックすると画像を読み込みます。(読み込みには多少の時間がかかります)

読み込みが完了したら以下の画像のように読み込んだデータが表示されます。

「Total images analyzed」は読み込んだ画像数で、「All images that can be resized」がリサイズを行う画像数です。

「Resize images」をクリックしてリサイズを行います。(リサイズにも多少の時間がかかります)

「Total images analyzed」は読み込んだ画像数で、「All images that can be resized」がリサイズを行う画像数です。「Resize images」をクリックしてリサイズを行います。(リサイズにも多少の時間がかかります)

リサイズが終わると「完了」のポップアップが表示されます。これで完了です。

その他の設定

メニューにある「Settings」をクリックし、リサイズする画像の設定を行います。

「Auto resizing」は自動でリサイズを行います。

「Advanced Resize Options」では画像のアスペクト比や背景カラーを選択することができます。

「Restore images」をクリックすると、リサイズした画像を元のサイズに戻すことができます。(保存期間内の画像に限ります)

「Auto resizing」は自動でリサイズを行います。「Advanced Resize Options」では画像のアスペクト比や背景カラーを選択することができます。「Restore images」をクリックすると、リサイズした画像を元のサイズに戻すことができます。(保存期間内の画像に限ります)

【最後に】商品画像を整理しよう

ネットショップのデザインは商品画像で決まると言っても過言ではありません。

逆を言うと、商品画像が荒かったり、画像のアスペクト比が統一されていないと、ユーザーはショップに不信感を感じて離脱する可能性があります。

ぜひあなたのショップでも商品画像を整理し、ユーザーが安心してネットショッピングを楽しめるショップにしてください。

  • このエントリーをはてなブックマークに追加
おすすめリンクAD







パートナー募集|オフショア開発ドットコム











パートナー募集|オフショア開発ドットコム
ページ上部へ戻る