Shopifyの商品CSV登録時の画像とバリエーションに関するメモ

Cat WEBサイト構築Tag by cubismer

ヘルプに説明があるものの、実際何がどうなのかわからない部分があるのでメモとして。

前提

基本的な事柄は上記ページで全て説明されているのでまずはじめに読むべきです。そしてサンプルCSVをダウンロードして確認もした方が良いです。ただしヘルプを読んでもCSVを確認してよくわからない部分がそれなりにある印象なので、当記事ではそこを書いています。

商品管理画面からのインポート

アプリを使わずに商品管理からCSVをインポートする場合です。アプリは各アプリごとの動作が決まっているためアプリの方のヘルプを読む必要があります。

商品登録

前提記載のヘルプないからサンプルのCSVをダンウンロードできるので、基本的にはそれを元にCSVを作成することになると思います。

しかし実際のところ登録に必要な最低限の状態というのがわかりにくいため調べました。あくまで登録の最低限であって、そのまま販売開始できるという意味ではないのでその点は留意ください。

新規登録

  • Handle
  • Title
  • Option1 Name
  • Option1 Value

バリエーションありの商品を登録する場合、上記4つの見出しとその内容さえあれば登録自体は可能です。当然ながら自動でよしなにやってくれるというわけではなく、未入力部分はそれぞれ決められた初期値が設定されます。価格であれば「0」になります。

Option Valueの値が重複するとエラーになるので、Option Valueは必ず違う値で入力する必要があります。

商品のマスターデータとしてCSVを扱う場合、初期値で良いからと見出しを作成しない方法を採用すると、そのCSVを見ても見出しと内容の相互関係を把握できなくなってしまう点でやめた方が良いように思います。

ただしクライアントからすれば「余計なものはない方が良い」という考えはあり得ますし、今後のことを考えて見出しはなるべく全て用意しておくという考えもあり得るので、一概には言えませんが。

なおバリエーションを持たない商品を登録する場合、最小見出しは以下の2つだけで登録可能です。

  • Handle
  • Title

上書き登録

  • Handle
  • Title
  • 上書きが必要な見出し

上書きの場合、HandleとTitleさえあればあとは必要な列だけ書けばその箇所だけを上書きできる模様です。

以下のような画像の上書き問題見かけることがるかもしれませんが、これはShopifyの仕様であり問題とはなり得ません。

  • Image Srcを更新しないからと、空欄にしてアップロードしたら登録済みの画像が消えた

列を削除せず空欄でアップロードした場合は「登録画像を空欄で上書きする(=登録データの削除)」になるためです。そのため画像を消したくない場合はImage Srcなど画像を登録している列を消せば問題ありません。

仮に、ストアからCSVをダウンロードして更新に用いる場合は、更新したい商品のHandleとTitle以外に更新したい列だけを残してあとは消せばよい、となります。

ただしあくまで個人的に確認した範囲にすぎませんので、一応各自確認することをお勧めします。

画像と表示順序

いくつかの組み合わせを試しましたが色々とややこしい状態です。そのためバリエーションごとに画像を設定する商品を登録する場合は必ず以下を全て入力した方が安全だと思われます。ただしストアの表示状態はテーマによるため一概にはいえません。

Image Src 商品登録画面の「メディア」に登録され、ストアの商品詳細ページの画像として表示される。
Image SrcにVariant Imageの画像が含まれていない場合、自動でVariant Imageの画像が追加登録される。
Image Position 商品登録画面の「メディア」と、ストアの商品詳細ページの画像の並ぶ順番に使用される。
Image SrcにVariant Imageの画像が含まれていない場合は、仮に3や4を入力していても1から順に設定される。
Variant Image 商品登録画面の「バリエーション」に登録される。
Image Srcにしか登録しない場合、ストアの商品詳細ページでバリエーションを変更しても画像は変更されない。

確認した挙動

  • Variant Imageさえ入力すれば、Image SrcとImage Positionが空白でも、Variant Imageの並び順に従ってそれぞれ自動で設定される
  • Image SrcとVariant Imageが同じでなくともエラーもなく登録は可能
    順序が違う(上から順にImage Positionを4132のように指定する)だけならImage Positionで指定した通りに並んだ状態で表示され、バリエーション選択で意図通りの画像に切り替わる

上記だけを見るなら、Image SrcとImage Positionは空欄でもOKといえます。

ただしこの状態では、バリエーションに紐づかない画像をImage SrcとImage Positionに追加した場合に意図した状態になりません。

基本的にVariant Imageで設定された画像は強制的に「メディア」にも登録されますが、Image Srcで全く別の画像を追加した場合はその別画像のImage Positionが強制的に1として設定されます。Variant Imageで設定された画像の後ろには並びません。

もちろん「メディア」でドラック&ドロップによる入れ替えをすれば別ですが。

実験メモ

当記事を書くために色々試した際のメモを一応以下に残します。全て入力していれば起こらない事態ばかりですが、ミスはありますし意図的にやならないとも限りませんので一応試した次第です。

  • 失敗してもエラーは表示されない。登録もされない。ただし管理者のメールアドレスに成否と失敗の場合はエラー内容が送信される。
  • Image Srcを全て入力し、Variant Imageも全て入力すると、メディア欄にはメインの画像が表示される。バリエーションを変更すると商品画像は切り替わる。
  • バリエーションのTitleとBodyとVendorとTagsは全てに記述していてもエラーにはならない(この部分を出力する方法はない？)
  • Image Srcを全て入力して、Variant Imageを全て未入力すると、商品詳細に画像は表示されるが、商品登録画面のバリエーション画像が空になる。バリエーションを変更しても商品画像は切り替わらない。商品管理の一覧では画像が表示され、メディア欄にも画像は表示される。
  • Image Srcを全て未入力で、Variant Imageを全て入力すると、バリエーションの画像と商品画像も登録される。Image Positionは上から順に自動で割り振られる。バリーションに絡まないImage Srcを追加した場合は、記載したImage Positionの番号に関係なく1から始まる数が設定される。バリエーションを変更すると商品画像は切り替わる。
  • Image Srcをメインだけ入力して、Variant Imageを全て入力するとバリエーションの画像と商品画像も登録される。バリエーションを変更すると商品画像は切り替わる。
  • Image SrcとImage PositionとVariant Imageを全て入力して登録したあと、同じハンドルのままImage SrcとImage Positionを削除しVariant Imageだけを全て入力した状態で「同じハンドルを持つ現在の商品をすべて上書きします。欠けている列には既存の値が使用されます」にチェックを入れて上書きインポートを行うと、以前のImage Srcで登録した画像が残ったままVariant Imageの画像が登録される。
  • Variant Imageなど一部が登録されない場合は、見出し列の該当箇所を入れ直すことでアップロードできる場合がある。見た目には全く同じだが余計な何かが含まれているからかもしれない。制御コードかと思われるが、実際に目にしたのは「半角スペースに何かが混入して見出しが認識されない」という事例。

バリエーションの登録追加方法

  • ハンドルはメイン商品(元から存在している同一ハンドル内の最上部行)をコピーし、すぐ下の行にペーストする
  • Option1 Value(またはOption2 ValueやOption3 Value)だけ異なる値であれば、その他全ての内容が同じでも登録自体は可能なので、あとは必要に応じてVariant SKUやVariant Priceなどを変更する

上記はあくまで私案です。

後述しますが本来はTitleやBodyなどは空欄で問題ありません。ですが運用面安全性を考えますと、入力内容に違いがあることで混乱するという可能性も考えられるため、全て同じにしてから必須の部分だけ変更するという方法が安全ではと考えたからです。

登録時に最重要なのは以下の点で、ここさえ気をつけていれば登録自体はまず問題ないはずです。

  • Handleは必ず揃える
  • Option1 Value(またはOption2 ValueやOption3 Value)の値は個別にする

バリエーション登録時のBodyなど

バリエーションのある商品をアップロードする場合は、最初の画像のURLとともに、商品のフィールドすべて (前述) を最初の行に入力します。続く行にはハンドル名を入力します。Title、Body (HTML)、Vendor、およびTagsの各列は省略します。他のバリエーションの詳細と各画像のURLを記入してください。

上記のように説明がありますが、全てに記載してもエラーは出ず正常に登録されます。ただし、メイン(同一ハンドル内の最上行)の内容だけが登録され、他は無視されて登録されません。

TitleやBodyを空欄にしておけばCSV左端を見ただけでバリエーションの有無がわかるため、CSVの見通しをよくするという点で空欄にした方が良いとは思いますが、それ以上の意味はないかもしれません。

なおアプリで登録した場合も同じです。

バリエーションごとにTitleやBodyの表示を変えたい場合

バリエーションとして追加した行のTitleやBodyは記載しても無視されるので、デフォルトの状態では実現不可だと思われます。

実現したい場合は、バリエーションのメタフィールドにそれぞれの値を設定し、バリエーション切り替えに連動して設定した値を出力する方法が考えられます。

またはアプリを使えばできると思いますが、どのアプリで実現できるかは調べる必要があります。

結び

運用を考えると一つの形だけを許可する方向で固めるのが良いと思います。想定外の状態でエラーを出さずにある程度対応してくれるのは有り難いですが、そこを頼ると意図した状態にならない可能性が増すため、基本的にはヘルプの通り未入力は避ける方向が良いと思います。

3人がこの記事を評価

役に立ったよという方は上の「記事を評価する」ボタンをクリックしてもらえると嬉しいです。

連投防止のためにCookie使用。SNSへの投稿など他サービスとの連動は一切ありません。

コメント欄