By 37Design |

スマホからWooCommerce商品写真を一括アップロードする方法

WooCommerceストアを運営しているなら、商品写真はすべての基本です。商品の鮮明でよく撮れた画像が見られないお客様は購入しません。課題は写真を撮ることではなく、何十、何百もの商品を撮影する場合に、それらをスマホからWooCommerceの商品リストに効率的に取り込むことです。

このガイドでは完全なプロセスを説明します: スマホで商品写真を撮影し、WordPressメディアライブラリに一括アップロードし、WooCommerceの商品に割り当てるまで。紙の上では良さそうに見えても実際には機能しない理論的なワークフローではなく、ストアオーナーが実際に使っている実践的なツールとテクニックを紹介します。

スマホでの商品撮影が機能する理由

まず明らかな疑問に答えましょう: スマホで商品写真を撮影して、オンラインストアに十分プロフェッショナルに見えるのでしょうか?

はい。現代のスマートフォンカメラはECサイトに十分な画像を生成します。商品写真の品質を決める重要な変数は照明、背景、一貫性の3つで、いずれもカメラ本体には依存しません。

5,000円以下で揃えられる基本的な商品撮影セットアップに必要なものを紹介します。

  • 白いポスターボードや発泡スチロール板を壁に沿って曲げ、シームレスな背景を作ります
  • デスクランプ2台を商品の両側に45度の角度で配置します。自然な色を出すには昼光色の電球(5000K〜5500K)がおすすめです
  • スマホ用三脚があると、カメラのブレを防ぎ、撮影間のフレーミングを揃えやすくなります
  • スマホは最近3年以内のものなら十分です

このセットアップで、少なくともWeb向けの画像については、DSLRとスタジオ照明で撮った画像に匹敵するクリーンな商品写真が撮れます。お客様はスクリーン上で商品を見ているのであって、ビルボードに印刷するわけではありません。

商品写真の効率的な撮影

まとめて撮影する

最大の時間節約はまとめて撮影することです。1つの商品を撮影してアップロードしてリストを作成し、次の商品に移るという方法は避けてください。代わりに以下の手順で進めましょう。

  1. 撮影スタジオを一度設置する
  2. すべての商品を順番に撮影する
  3. すべての写真を一括でアップロードする
  4. 商品に写真を割り当てる

この流れ作業アプローチは、撮影、編集、アップロード、リスト作成の間でコンテキストスイッチングが発生しないため、劇的に速くなります。各ステップには独自のセットアップコストがあり、まとめて作業することでそのコストを全商品に分散できます。

各商品の標準ショット

WooCommerceはメインの商品画像と商品ギャラリー(複数の追加画像)をサポートしています。ほとんどの商品では3〜5枚の画像を目標にしましょう。

  • メインの商品画像(ヒーローショット)。白背景で正面から撮り、ショップグリッドや検索結果に使います
  • 45度アングルから撮ると、正面だけでは伝わらない奥行きや立体感が出ます
  • 重要な特徴やテクスチャ、ラベルなどのクローズアップも用意しましょう
  • 手や硬貨、定規など身近なものと並べて撮ると、お客様がサイズ感をつかみやすくなります
  • 実際に着用・使用している写真は必須ではありませんが、転換率の向上に効果的です

ファイルの命名

アップロード前に、説明的な名前にファイルをリネームしましょう。これはSEOと、メディアライブラリで何百もの商品画像を管理する際の自分自身の正気のために重要です。

良い命名パターン: 商品名-アングル.jpg

  • blue-canvas-tote-front.jpg
  • blue-canvas-tote-detail-stitching.jpg
  • blue-canvas-tote-scale.jpg

避けるべき: IMG_4821.jpgphoto_2026_02.jpgproduct1.jpg

ほとんどのモバイル写真編集アプリでは、カスタムエクスポートファイル名を設定できます。例えばLightroom Mobileでは、エクスポート設定でファイル命名テンプレートを定義できます。

商品写真の一括アップロード

写真を撮影して編集したら、WordPressメディアライブラリに取り込む必要があります。ここで一括アップロード機能が大きな違いをもたらします。

方法1: 専用アップロードアプリ(推奨)

スマホベースのワークフローに最も速いアプローチは、WordPress REST APIに直接接続してバッチアップロードをサポートするアプリを使うことです。例えばSnapPressは一度に最大20枚の写真を選択してメディアライブラリに直接送れます。50〜100枚の一般的な商品撮影では、3〜5回のアップロードバッチ、合計約2〜3分で完了します。

この方法の主なメリットは、画像がメディアライブラリにすぐに表示され、WordPressに正しく登録され、WooCommerceの商品に割り当てる準備ができていることです。余分な手順なし、ファイル登録なし、デスクトップ不要です。

複数のストアを管理している場合、マルチサイト対応により異なるWooCommerceインストール間を切り替えて、同じアプリから各ストアに商品写真をアップロードできます。

方法2: WordPressの管理画面(ブラウザ)

メディア > 新規追加に移動することで、WordPress管理画面から直接アップロードできます。デスクトップブラウザではドラッグ&ドロップのアップローダーが動作しますが、モバイルでは標準のファイルピッカーにフォールバックします。カメラロールから複数の画像を選択できますが、体験はあまり快適ではありません。モバイルブラウザのアップローダーはバッチ操作向けに設計されておらず、大きなアップロードはモバイルデータ通信でタイムアウトや失敗が起きがちです。

この方法はやむを得ない場合には機能しますが、定期的な一括アップロードには推奨しません。メディアライブラリの管理についての詳細は、WordPress メディアライブラリ完全ガイドをご覧ください。

方法3: WooCommerce CSVインポート(大規模カタログ向け)

何百もの商品がある新しいストアを立ち上げる場合、WooCommerceの組み込みCSVインポートツールを使って商品に画像を一括割り当てできます。プロセスは以下の通りです。

  1. 最初に上記のいずれかの方法でメディアライブラリにすべての商品画像をアップロード
  2. Images列に画像URLを含む商品データのCSVファイルを作成
  3. WooCommerce > 商品 > インポートからCSVをインポート

このアプローチは初期ストアのセットアップや大規模なカタログ更新に強力ですが、他の方法より準備が必要です。アップロードした各画像の完全なURL(例: https://yourstore.com/wp-content/uploads/2026/02/blue-canvas-tote-front.jpg)を知っていて、CSVを正しくフォーマットする必要があります。

CSVの画像列では、複数のギャラリー画像はカンマで区切られています。最初の画像がメインの商品画像になり、後続の画像がギャラリーに追加されます。

https://yourstore.com/wp-content/uploads/2026/02/blue-canvas-tote-front.jpg, https://yourstore.com/wp-content/uploads/2026/02/blue-canvas-tote-angle.jpg, https://yourstore.com/wp-content/uploads/2026/02/blue-canvas-tote-detail.jpg

WooCommerce商品への写真割り当て

画像がメディアライブラリに入ったら、適切な商品に割り当てる必要があります。効率的に行う方法を示します。

メインの商品画像を設定する

  1. WordPress管理画面の商品 > 全商品に移動
  2. 編集したい商品をクリック
  3. 右サイドバーの「商品画像」パネルを見つける
  4. 「商品画像を設定」をクリック
  5. メディアライブラリから画像を選択(アップロードした画像は最新の順で上部に表示されます)
  6. 「商品画像を設定」をクリック

ギャラリー画像を追加する

  1. 同じ商品編集画面で、「商品ギャラリー」パネル(商品画像の下)を見つける
  2. 「商品ギャラリー画像を追加」をクリック
  3. Ctrl(Windows)またはCmd(Mac)を押しながらクリック、またはモバイルで各画像をタップして複数の画像を選択
  4. 「ギャラリーに追加」をクリック
  5. 画像をドラッグして並べ替え(最初のギャラリー画像は通常、商品のライトボックスで2番目の画像として表示されます)

一括割り当てのヒント

一度に多くの商品に画像を割り当てる場合、いくつかの効率化のヒントを紹介します。

  • 商品リスト(商品 > 全商品)の「クイック編集」を活用しましょう。画像は直接変更できませんが、画像更新と並行して他の商品データを一括更新するのに便利です。
  • 複数の商品編集ページを別々のブラウザタブで開いておくと、ページの読み込みを待たずにすばやく切り替えられます。
  • 画像を選択するとき、検索フィールドでファイル名を絞り込みます。blue-canvas-tote-*のようにわかりやすい名前を付けておけば、目的の画像をすぐに見つけられます。
  • 商品を順番に撮影してアップロードすると、メディアライブラリでも同じ順序で表示されるため、割り当て作業がスムーズになります。

WooCommerceの画像最適化

商品ページの速度は転換率に直接影響します。ページの表示が遅くなるほど離脱率が上がり、売上に響きます。最適化されていない大きな画像は、WooCommerceページが遅い最も一般的な原因です。

画像サイズのガイドライン

画像タイプ 推奨サイズ 理由
メイン商品画像 1000〜1200px幅 ズーム機能に十分な大きさで、高速ロードに十分な小ささ
ギャラリー画像 1000〜1200px幅 ライトボックス閲覧のためにメイン画像と一致
サムネイル WooCommerceが自動生成 WooCommerceはショップカタログとサムネイルサイズを自動的に作成
カテゴリーバナー 1920px幅、400〜600px高 カテゴリーアーカイブページでの全幅表示

圧縮とフォーマット

  • 商品写真にはJPEGが向いています。ファイルサイズと品質のバランスが良く、70〜85%の品質設定が目安です。
  • PNGは透明度が必要な画像だけに使いましょう。写真コンテンツではJPEGより大幅にファイルが大きくなります。
  • ShortPixelやImagifyなどのプラグインでWebP変換を有効にすると、画質をほぼ維持しながらファイルサイズを25〜35%削減できます。
  • GPS座標やカメラ設定などのEXIFデータは商品写真には不要です。削除するとファイルサイズが減り、位置情報の漏洩も防げます。

推奨の最適化プラグイン

  • ShortPixelは月100枚まで無料で使え、圧縮品質も優秀です。WebP変換に対応し、新規アップロードと既存画像の両方を処理できます。
  • ImagifyはWP Rocketの開発元が提供しているプラグインで、アップロード時に自動で最適化してくれます。
  • Smushは一度に最大50枚を無料で一括最適化できます。Pro版ではCDN配信や次世代フォーマットにも対応します。

WooCommerceの画像設定

WooCommerceは各商品画像に対して複数のサイズを生成します。外観 > カスタマイザー > WooCommerce > 商品画像で設定できます。

  • メイン画像幅は商品単体ページに使われます。デフォルトの600pxでも機能しますが、Retinaディスプレイを考慮すると800〜1000pxがおすすめです。
  • サムネイル幅はショップカタロググリッドに使われます。デフォルトの300pxで多くのテーマに対応できます。
  • サムネイルのトリミングは「なし(元のアスペクト比)」「1:1(正方形)」「カスタム」から選べます。正方形にするとグリッドの見た目が揃いますが、商品によっては重要な部分が切れることもあります。

これらの設定を変更した後、既存の画像のサムネイルを再生成する必要があります。「Regenerate Thumbnails」プラグインがこれを自動的に処理します。

バリエーション商品のワークフロー

バリエーション商品(異なるサイズ、色、素材)はさらに複雑さを加えます。各バリエーションに独自の画像を持たせることができ、お客様は異なるオプションを選択したときに画像が変わることを期待しています。

バリエーション画像の設定

  1. 商品編集画面で「商品データ」セクションに移動
  2. 「バリエーション」タブをクリック
  3. 各バリエーションを展開
  4. 画像のプレースホルダーをクリックしてそのバリエーションに特定の画像を割り当て
  5. メディアライブラリから適切な画像を選択

バリエーション撮影のヒント

  • 色違いやサイズ違いも省略せず、すべてのバリエーションを撮影しましょう。青いシャツと赤いシャツにはそれぞれ別の写真が必要です。
  • アングルとフレーミングはバリエーション間で揃えると、切り替え時にページが洗練された印象になります。三脚を固定したまま撮影するのがコツです。
  • ファイル名は商品名-色.jpg(例: canvas-tote-navy.jpgcanvas-tote-olive.jpg)のように統一すると、割り当て作業が楽になります。
  • バリエーション画像はまとめてアップロードすると、メディアライブラリ上で時系列順にグループ化されて探しやすくなります。

増えていく商品画像ライブラリの管理

200商品、商品あたり5枚の画像があるWooCommerceストアには、自動生成されたサムネイルサイズを含めると1,000枚以上の画像がメディアライブラリにあります。計画なしでこれを管理するのはすぐに手に負えなくなります。

整理の戦略

  • 説明的なファイル名は繰り返しになりますが最も効果的な整理手段です。メディアライブラリで「canvas-tote」と検索するだけで関連画像がすぐ見つかります。
  • WordPressにはメディアフォルダー機能がありませんが、FileBirdやReal Media Libraryなどのプラグインで追加できます。商品カテゴリーや季節ごとに画像を分類すると管理しやすくなります。
  • 商品を廃止したら、その画像も削除するか「アーカイブ」フォルダーに移動して、ライブラリが散らからないようにしましょう。
  • 四半期に一度くらいの頻度で、どの商品・投稿にも割り当てられていない画像がないか確認すると、ストレージの無駄を減らせます。

メディアライブラリの整理方法や一括編集の使い方については、WordPressメディアライブラリガイドで詳しく解説しています。

よくあるアップロードの問題のトラブルシューティング

「アップロード失敗」またはタイムアウトエラー

これは通常、サーバーのアップロード制限に対して画像ファイルが大きすぎることを意味します。PHPの設定でupload_max_filesizepost_max_sizeを確認してください。サーバーの設定を変更できない場合は、アップロード前に画像をリサイズしてください。1200px幅のJPEGを80%品質にすれば、一般的なアップロード制限内に収まるはずです。

商品ページで画像がぼやけて見える

テーマで設定した商品画像サイズより小さい画像をアップロードすると、このことが起きます。WooCommerceは表示エリアに合わせて小さい画像を引き伸ばします。元のアップロードがWooCommerceカスタマイザーの「メイン画像幅」設定以上のサイズであることを確認してください。

ギャラリー画像の順序が違う

商品編集画面でギャラリー画像をドラッグして並べ替えることができます。多数の商品の場合、一部のWooCommerce管理プラグインでは画像を一括で並べ替えることができます。

アップロード後に画像が表示されない

FTPやファイルマネージャーでアップロードした場合、画像はサーバーに存在してもWordPressのデータベースに登録されていない可能性があります。REST APIまたはWordPress管理者のアップローダーを使って画像を適切に登録する必要があります。WordPressネイティブのアップロードアプリを使えば、この問題を完全に回避できます。

まとめ

手順をおさらいすると、白背景とランプ2台の簡易スタジオで商品をまとめて撮影し、スマホで編集後、バッチアップロードツールでメディアライブラリに送り、各商品に割り当てます。最後に最適化プラグインで圧縮すれば完了です。

この流れを習慣にすると、1商品あたり撮影込みで10分ほどで追加でき、デスクトップ転送や手動リサイズに比べて大幅に時間を短縮できます。

スマホからWordPressに商品写真を一括アップロードしませんか?

SnapPressを使えば、最大20枚の商品写真を選択して数秒でWooCommerceのメディアライブラリに送れます。QRコード設定、マルチサイト対応、サブスクリプションなし。

SnapPressを入手(¥500)