商品に色やサイズといったバリエーション展開がある場合、それぞれを個別商品として登録する必要はありません。WooCommerceでは1つの商品として登録しそれにバリエーションとして選択肢を持たせ、さらに全てのバリエーションの組み合わせごとに代表画像、価格、割引、在庫管理をすることができます。

WooCommerce 商品バリエーションの設定方法

1. 商品タイプを「バリエーションのある商品」に

Screen Shot 2015-07-10 at 6.01.43 PM

2. サイズ、カラーといった属性を設定する

まず「属性」タブを選択し、「追加」ボタンをクリックします。

Screen Shot 2015-07-10 at 6.02.02 PM

属性を設定します。属性とは例えば「サイズ」「カラー」といった項目です。
項目名の中に含む選択肢を名前欄に記入します。そしてその名前に対応する値をを入力します。値は半角の縦棒「|」で区切ることで選択肢として認識されます。
そして「バリエーションのために使用」にチェックを入れます。

Screen Shot 2015-07-10 at 6.02.43 PM

3. バリエーションを設定する

次に「バリエーション」タブを選択します。
バリエーションとは、例えば属性にサイズとカラーあった場合の組み合わせを意味します。例えば2サイズ2カラーあった場合は4バリエーションが出来上がることになります。

手動で1つ1つ設定することもできますが、「全てのバリエーションをリンク」ボタンをクリックすることで、既に設定した属性から自動的に全てのバリエーションを追加してくれます。例えば「Sサイズの赤色はそもそも存在していない」といった例外がある場合は「全てのバリエーションをリンク」してから後から不要なバリエーションだけ削除できます。

Screen Shot 2015-07-10 at 6.02.56 PM

例では2カラーしか用意していませんので、バリエーションは2つ表示されました。

Screen Shot 2015-07-10 at 6.03.22 PM

4. バリエーションごとに詳細を設定する

バリエーションごとに代表画像の設定、SKU、定価、セール価格、在庫管理が可能です。

代表画像を登録することで、そのバリエーションを選択すると商品写真がその画像に自動的に切り替わります。商品全体の画像ギャラリーにはまとめて全て画像登録しておき、更にバリエーションごとに代表画像を設定することで、顧客がそのバリエーションを選択したときに正しい画像を見てもらうことができます。

Screen Shot 2015-07-10 at 6.04.00 PM

また、特定のバリエーションだけ価格や割引を設定できます。バリエーションによって価格が異なる場合、少尉品画面には「2000円 – 3000円」といった価格帯のみが表示され、バリエーションを選択すると自動的に価格と購入ボタンが表示されます。

実際のバリエーション商品がデモサイトにありますので、こちらで動作を確認してみてください。
http://demo.wooseum.com/fujiyama/product/woo-t-shirt/

WooCommerceはこのように細かいバリエーション設定機能が非常に使いやすく設計されています。

Leave a Comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA