WooCommerceで商品バリエーションを追加する方法：4つの方法！

公開: 2021-07-01

あなたはあなたの店でユニークな可変製品を作成するための完璧なガイドを探していますか？あなたは正しい場所に来ました。このガイドでは、WooCommerceに商品バリエーションを追加し、バリエーション商品のエクスペリエンスを向上させる方法を説明します。

WooCommerceの製品バリエーションとは何ですか？それらはどのように機能しますか？

製品バリエーションから始めましょう。単純な製品とは対照的に、WooCommerceではバリエーションのある製品を作成できます。たとえば、サイズや色が異なるシャツや、デザインやデカールが異なるアイテムを扱っているお店を見たことがあるかもしれません。これらの組み合わせはそれぞれ異なるバリエーションです。したがって、可変商品とは、属性に基づいてバリエーションがある商品です。

価格、画像、寸法、説明、商品のSKU、在庫などを各商品のバリエーションに追加できます。基本的に、これにより、同じ製品のより多くのオプションを異なる価格と製品の詳細で提供できるようになり、製品を追加するためのより柔軟で便利な方法が可能になります。

製品の属性

バリエーションの重要な部分は、製品の属性です。デフォルトでは、WooCommerceでは任意の製品に属性を追加できます。これは、オンラインストアの特定の特性を持つ特定の製品を定義する方法を提供します。属性には、色、サイズ、形、重さ、パターン、素材などがあり、販売している商品の種類によって異なります。

属性の各組み合わせは、製品のさまざまなバリエーションを定義します。これは、製品のバリエーションがこれらの属性に依存することを意味します。属性がないと、WooCommerceで商品バリエーションを作成することはできません。バリエーションのある商品属性を作成する方法の詳細については、このガイドをご覧ください。

これが100％明確でなくても、心配する必要はありません。このガイドでは、可変商品を追加し、その属性とバリエーションを定義するさまざまな方法を紹介します。

WooCommerceで商品バリエーションを追加する方法

WooCommerceに商品バリエーションを追加するには、さまざまな方法があります。

WooCommerceダッシュボードから
1. デフォルトオプション
2. グローバル属性の使用
専用プラグイン付き
プログラムで

それぞれの方法を見てみましょう。あなたに最適な方法を選択できます。

1.1）WooCommerceのデフォルトオプションを使用して製品バリエーションを追加する方法

WooCommerceダッシュボードから可変商品を追加する簡単なプロセスから始めましょう。

ダッシュボードで、 [製品]> [新規追加]に移動します。 次に、商品に名前を付け、[商品データ]で[可変商品]として設定し、商品の説明を追加します（オプション）。

woocommerceに商品バリエーションを追加-新しい可変商品を追加

単一の製品にバリエーションと属性を追加する

前に述べたように、可変製品を作成するには、その製品の属性を定義する必要があります。最も一般的な属性は、サイズ、色、品質などです。属性を追加するには、[製品データ]の下の[属性]タブに移動し、[追加]をクリックします。

woocommerceに商品バリエーションを追加-新しい可変商品カスタム属性を追加

次に、属性に名前を付け、その値、つまりバリエーションを追加し、「|」を使用して各値を区切ります。 [バリエーションに使用]オプションをクリックして商品属性を有効にし、バリエーションを作成して、[属性の保存]を押します。

次に、[バリエーション]タブで、属性とその各値を使用して製品のバリエーションを作成できます。各バリエーションを個別に追加できますが、[バリエーションの追加]ラベルが付いたドロップダウンバーをクリックし、[すべての属性からバリエーションを作成]を選択して、[移動]をクリックすることをお勧めします。これにより、属性に追加した値ごとにバリエーションが自動的に作成されます。

woocommerceに商品バリエーションを追加-新しい可変商品カスタムバリエーションを追加作成

その後、[バリエーション]タブで各商品バリエーションをクリックして、商品IDを表示し、名前、価格、画像、寸法などの詳細を変更します。

製品に複数のバリエーションを追加することもできます。これを行うには、新しい属性を作成し、[バリエーション]タブを使用してそれらを追加し、それに応じてカスタマイズします。

woocommerceに商品バリエーションを追加-新しい可変商品バリエーションを追加バリエーション値を変更

すべてのバリエーション製品が完成したら、新しく作成した製品を保存/公開すると、完全にセットアップされます。製品のセットアップとバリエーションの追加の詳細については、この専用ガイドをご覧ください。

1.2）グローバル属性を使用して商品バリエーションを追加する方法

これで、すべての商品に個別の属性を追加する代わりに、グローバル属性を設定して、すべての商品バリエーションに使用することもできます。これは、同じ属性を持つ複数の製品がある場合に特に便利です。たとえば、色、サイズなどです。

グローバル属性を作成する

グローバル属性を作成するには、 [製品]> [属性]に移動します。名前とスラッグを追加し、[属性の追加]をクリックします。デモでは、 Color属性を追加します。

woocommerceに商品バリエーションを追加-グローバル属性を追加
次に、この属性のバリエーション/用語を追加しましょう。これを行うには、[属性]に移動し、作成した属性の下にある[用語の構成]を押します。

woocommerceに製品バリエーションを追加-グローバル属性は用語を構成します

次に、属性用語の名前、スラッグ、説明を追加する必要があります。たとえば、赤を追加するので、[新しい色/サイズ/用語の追加]ボタンを押すと、属性の設定されたバリエーションが追加されます。

先に進んで、必要な数の用語を追加して、さまざまなバリエーションを試してみてください。

グローバル属性を可変製品に追加します

次に、この属性をバリエーション製品のいずれかに追加するプロセスは、以前に見たものと非常によく似ています。

[製品]タブの下の[属性]タブに移動し、[属性の選択]ドロップダウンオプションをクリックするだけです。新しく作成したグローバル属性を選択し、[値]フィールドをクリックして、属性用に作成したすべての値を追加します。次に、[追加]をクリックし、[バリエーションに使用]オプションを有効にして、[属性の保存]をクリックします。

woocommerceに商品バリエーションを追加-グローバル属性商品データ

残りのプロセスも上記と同じです。バリエーションに移動し、バリエーションの追加ドロップダウンをクリックするだけです。 [すべての属性からバリエーションを作成]オプションを選択し、[移動]を押します。残りのプロセスでは、各バリエーションに価格と追加の詳細を追加するだけで済みます。

woocommerceに商品バリエーションを追加-グローバル属性バリエーションを追加

複数のバリエーションを追加することもできます。WooCommerceは、[すべての属性からバリエーションを作成]オプションを使用して各バリエーションの組み合わせを作成しますが、各バリエーションの製品の詳細を追加することを忘れないでください。

WooCommerceが提供するオプションは便利で、仕事をこなしてくれます。ただし、追加する製品が多数ある場合は、このプロセスが面倒になる可能性があります。デフォルトのオプションでは、パーソナライズも制限されています。特に、バリエーションに合わせて見本をカスタマイズするオプションはなく、ドロップダウンボックスは顧客にとって必ずしも魅力的ではありません。

WooCommerceで製品バリエーションを作成するためのより多くのオプションが必要な場合は、専用のプラグインを使用できます。

2）WooCommerceのバリエーションをカスタマイズし、可変製品を一括追加するプラグイン

WooCommerceの製品バリエーションを改善し、それらをカスタマイズするもう1つの方法は、専用のプラグインを使用することです。使用できる最高のツールのいくつかを見てみましょう。

1）WooCommerceのバリエーションスウォッチ

woocommerceに製品バリエーションを追加-woocommerceのバリエーション見本

バリエーションスウォッチは、バリエーション製品スウォッチをカスタマイズし、ラジオや色付きのボタン、またはミニ画像を使用してパーソナライズするための無料のオプションを提供します。これは、製品に複数のバリエーションを追加するときにWooCommerceが提供するデフォルトのドロップダウンボックスの代わりとして最適に機能します。

商品に複数のバリエーションオプションがある場合は、さまざまな方法でバリエーションを表示することもできます。サイズのシンプルなテキスト見本、カラーバリエーションの色見本、さまざまなテクスチャの画像を追加できます。見本の形状を追加したり、表示するスタイルを選択したりすることもできます。

プラグインの設定は簡単な作業であり、プラグインをアクティブにすると、すべてのドロップダウンバリエーションスウォッチが自動的に変換されます。属性ごとに固有の見本オプションを設定することも簡単で、特定のグローバルオプションをカスタマイズできます。

主な機能

使いやすい
複数のバリエーションと属性を持つ可変製品をサポートします
すべてのバリエーションドロップダウンを自動変換し、グローバルに作成された属性バリエーションドロップダウンオプションもスウォッチに簡単に変換します

価格

WooCommerceのバリエーションスウォッチはフリーミアムプラグインです。基本機能と年間49米ドルから始まるいくつかのプレミアムプランを備えた無料バージョンがあります。

2）WooCommerceのElex一括編集製品

woocommerceに製品バリエーションを追加-elexプラグイン

Elex Bulk Edit Productsを使用すると、製品やその価格などを一括編集できます。一括編集オプションを使用して、10,000を超える製品を同時に編集できます。さらに、専用のフィルターオプションを使用して、特定の製品を一括編集することもできます。

Elexの真の傑出した機能は、さまざまな製品でどれだけうまく機能するかです。これにより、すべての変動商品およびバリエーションの通常価格またはセール価格を特定の商品カテゴリで一括更新できます。同様に、プラグインの通常価格と販売価格を管理することは、％または固定値に基づいて価格を変更するオプションで非常に便利です。さらに、同じ価格で複数のバリエーションを選択し、必要に応じてそれらの詳細を更新することもできます。

主な機能

複数の商品を一括編集して、商品データ、詳細、配送の詳細、寸法などを管理します
バリエーション商品と一括編集バリエーション商品とその価格をフルサポート
製品のグローバル変数属性を一括編集するオプション

価格設定

Elex Bulk Edit Products For WooCommerceは、フリーミアムツールです。 WordPressリポジトリから無料バージョンを入手するか、年間79米ドルを戻すプレミアムプランを入手できます。

3）バーン2WooCommerceバルクバリエーション

Barn 2 WooCommerce Bulk Varianceは、製品のバリエーションを独自のマトリックスで表示できる優れたプラグインです。これにより、表示しやすいグリッドに膨大な数の製品バリエーションをすばやく簡単に表示できます。このツールは、属性やバリエーションが豊富な可変製品をお持ちの方に最適です。これにより、すべてのバリエーション、属性の詳細、および相違点を、比較可能な価格と機能とともに、相互作用可能なテーブルに表示できます。

このグリッドは、B2Bビジネスや大量に販売するビジネスに最適なツールです。また、顧客が数量を入力し、グリッドに複数のバリエーションを追加して価格をより適切に比較できるようにするオプションを追加することもできます。同様に、バリエーション製品を表示するための2つの独自の高度に構成可能なグリッド設計が提供され、これらのバルクバリエーションをWebサイトのどこにでも表示できます。

主な機能

独自のグリッドデザインでバルクバリエーション商品を表示するオプションを提供します
すべてのバリエーションの製品属性、数量、在庫情報、および価格をテーブルデザインで表示できます
顧客が数量と選択するバリエーションを定義するためのオプションを有効にします

価格設定

Barn 2WooCommerceバルクバリエーションプレミアムプラグイン。年間79米ドルから。

4）WooCommerceの製品バリエーションテーブル：

WooCommerceの製品バリエーションテーブルは、便利なデータテーブルに製品バリエーションデータを表示できる便利なプレミアムプラグインです。この使いやすいテーブルを使用すると、顧客はさまざまなバリエーションを表示し、個別に数量を追加してカートに追加できます。専用のAJAXフィルターオプションなどを使用してバリエーションテーブルを簡単に設定できます。顧客は、さまざまな属性やタグを使用してさまざまなバリエーションを簡単に検索し、価格、属性、名前などのさまざまな値に基づいて並べ替えることもできます。

プラグインを使用すると、テーブルに複数のバリエーションを追加して、顧客が製品のバリエーションのすべての可能なバリエーションと組み合わせを表示できるようにすることもできます。プラグインには、テーブルレイアウトを個別にまたはグローバルに定義するための簡単なオプションも付属しています。必要に応じて、製品のバリエーションをエクスポートして、オフラインで簡単に表示することもできます。

主な機能

使いやすく、モバイル対応のフロントエンドテーブルで、すべての製品バリエーションを表示します。
バリエーションテーブルのAJAXフィルターと並べ替えオプション。
テーブルレイアウト、ページ付け、およびバリエーションのエクスポートオプションの追加オプション。

価格設定

WooCommerceの製品バリエーションテーブルは年間49ドルから

5）YITH WooCommerceの色とラベルのバリエーション：

YITH WooCommerceの色とラベルのバリエーションは、商品のバリエーションにフレーバーを追加するのに最適なプラグインです。可変製品に無制限のバリエーションを追加し、ショップに合わせて個別にパーソナライズします。商品バリエーションボタンの独自の画像、見本、ロゴ、さらには画像を設定します。デフォルトのWooCommerceバリエーションボタンはほとんど当たり障りのないものに見えます。WooCommerceストアをより目立たせたい場合は、このプラグインの助けを借りて間違いなく使用できます。

プラグインを使用すると、バリエーションに合わせて独自のカラーピッカーや画像ギャラリーを簡単に追加できます。また、属性/バリエーションごとにカスタムツールチップを追加して、各バリエーションが何を取得するかを顧客に知らせることもできます。プラグインのプレミアム価格で、プレミアム機能も利用できます。これには、ホバー時に変化する動的画像、バリエーションのカスタムラベル、[追加情報]タブにバリエーションを追加するオプションなどが含まれます。

主な機能

製品バリエーションの画像、色、ラベルなどをカスタマイズするためのユーザーフレンドリーなプラグイン。
各バリエーションと属性にカスタマイズ可能なツールチップを追加するための専用オプション。
独自の画像ギャラリー、説明属性、動的バリエーション画像などを追加するオプション。

価格設定

YITH WooCommerceのカラーとラベルのバリエーションの価格は、年間79,99ユーロ（約94米ドル）です。

プラグインを使用してバリエーションスウォッチを編集する方法

WooCommerceバリエーション製品を改善し、製品のデフォルトのドロップダウンバリエーションオプションを変更するためのさまざまなプラグインがあります。このデモンストレーションでは、WooCommerceバリエーションスウォッチを使用します。

WooCommerceバリエーションスウォッチプラグインの使用

まず、WP管理ダッシュボードを開き、 [製品]> [新規追加]に移動します。 次に、右上の検索バーを使用して、EmranAhmedによるWooバリエーションスウォッチを検索します。プラグインのカードで[インストール]をクリックして、アクティブにします。

woocommerceに製品バリエーションを追加する-バリエーション見本をインストールする

デフォルトでは、すべての商品属性がドロップダウンオプションから特定のバリエーション見本に変更されます。ただし、バリエーションスウォッチを使用すると、無料バージョンを使用して、すべてのグローバル属性に特定のスウォッチオプションを追加できます。

これを行うには、 [製品]> [属性]に移動し、以前に作成したグローバル属性の1つを開きます。

woocommerceに商品バリエーションを追加-wooバリエーション見本はタイプを選択

次に、グローバル製品属性の下にある[編集]を押し、[タイプ]オプションを使用して、有効にするスウォッチデザインの種類を選択します。色属性として、色オプションを選択し、[更新]をクリックします。

最後に、[属性]ページに戻って、用語の各色オプションを定義しましょう。グローバル属性の横にある[属性]ページの[用語の構成]オプションを選択すると、[新しい色の追加]フィールドの下に[色]オプションが表示されます。

用語の色を変更する場合は、用語の下にある[編集]を押して、色をカスタマイズします。

woocommerceに製品バリエーションを追加-wooバリエーション見本は色が赤に変わります

スウォッチタイプとして[画像]オプションを使用し、用語ごとに特定の画像を追加することもできます。

デフォルトのWooCommerceオプションでは不十分で、プラグインをインストールせずに柔軟性を高めたい場合は、もう1つのオプションがあります。 WooCommerceの製品バリエーションは、少しコーディングするだけでプログラムで作成できます。

4）プログラムでWooCommerceに商品バリエーションを追加する方法

上記の方法とは別に、プログラムで可変製品を一括で取得することもできます。 これにより柔軟性が高まりますが、WordPressプログラミング、PHP、およびWooCommerceフックに関する知識が少し必要になります。

プログラムで製品を作成する方法に慣れていない場合は、最初にこの投稿を参照することをお勧めします。このセクションでは、要点に直接進み、独自のWordPressプラグインを作成してWooCommerce製品を追加する方法の説明をスキップします。そのため、その方法がわからない場合は、最初にそのガイドを確認してください。

注：開始する前に、サイトの完全バックアップを作成し、子テーマをインストールしてください。

WordPressプラグインを作成したら、次のコード行を追加する必要があります。または、子テーマのfunctions.phpファイルに次の関数を追加することもできます。ただし、プラグインプロセスに従うことを強くお勧めします。これにより、より詳細な制御が可能になります。

 //商品バリエーションの作成
$ variation_id = wp_insert_post（$ Variation_post）;

// WC_Product_Variationオブジェクトのインスタンスを取得します
$ Variation = new WC_Product_Variation（$ Variation_id）;

//バリエーション属性を反復処理します
foreach（$ Variation_data ['attributes'] as $ attribute => $ term_name）
{{
$ taxonomy = 'pa _'。$ attribute; //属性の分類

//分類法が存在しない場合は、分類法を作成します（Carl F. Corneilに感謝）
if（！taxonomy_exists（$ taxonomy））{
register_taxonomy（
$ taxonomy、
'product_variation'、
配列（
'hierarchical' => false、
'label' => ucfirst（$ attribute）、
'query_var' => true、
'rewrite' => array（ 'slug' => sanitize_title（$ attribute））、//ベーススラッグ
）、
）;
}

//用語名が存在するかどうかを確認し、存在しない場合は作成します。
if（！term_exists（$ term_name、$ taxonomy））
wp_insert_term（$ term_name、$ taxonomy）; //用語を作成します

$ term_slug = get_term_by（ 'name'、$ term_name、$ taxonomy）-> slug; //用語スラッグを取得します

//親変数productからpostTerms名を取得します。
$ post_term_names = wp_get_post_terms（$ product_id、$ taxonomy、array（ 'fields' => 'names'））;

//投稿用語が存在するかどうかを確認し、存在しない場合は親変数productに設定します。
if（！in_array（$ term_name、$ post_term_names））
wp_set_post_terms（$ product_id、$ term_name、$ taxonomy、true）;

//商品バリエーションの属性データを設定/保存します
update_post_meta（$ Variation_id、 'attribute _'。$ taxonomy、$ term_slug）;
}

##他のすべてのデータを設定/保存

// SKU
if（！empty（$ Variation_data ['sku']））
$ Variation-> set_sku（$ Variation_data ['sku']）;

//価格
if（empty（$ Variation_data ['sale_price']））{
$ variation-> set_price（$ Variation_data ['regular_price']）;
} それ以外 {
$ variation-> set_price（$ variation_data ['sale_price']）;
$ variation-> set_sale_price（$ variation_data ['sale_price']）;
}
$ Variation-> set_regular_price（$ Variation_data ['regular_price']）;

// ストック
if（！empty（$ Variation_data ['stock_qty']））{
$ variation-> set_stock_quantity（$ variation_data ['stock_qty']）;
$ variation-> set_manage_stock（true）;
$ variation-> set_stock_status（ ''）;
} それ以外 {
$ variation-> set_manage_stock（false）;
}

$ variation-> set_weight（ ''）; //ウェイト（リセット）

$ variation->保存（）; //データを保存します
}

もちろん、WooCommerceストアに製品バリエーションを追加するには、配列を使用する必要があります。このために、次のような配列を使用できます。

 $ parent_id = 123; //または、可変の製品IDを動的に取得します

//変動データ
$ Variation_data = array（
'属性' => array（
'サイズ' => 'L'、
'色' => '青'、
）、
'sku' =>”、
'regular_price' => '92 .00 '、
'sale_price' =>”、
'stock_qty' => 15、
）;

//実行する関数
create_product_variation（$ parent_id、$ Variation_data）;

このコードスニペットは、すべてのサイトでスムーズに機能するはずです。ただし、ベースとして使用し、要件に基づいてカスタマイズすることをお勧めします。この部分があまり明確でない場合は、プログラムでWooCommerce製品を追加する方法に関するガイドと、WooCommerceフックに関する完全なガイドを読むことを強くお勧めします。これらの投稿は、plugin /function.phpファイルを設定する前の良いガイドとして機能します。

結論

要約すると、属性を追加することで、製品にさまざまなバリエーションを作成し、顧客により多くのオプションを提供できます。

このガイドでは、WooCommerceに製品バリエーションを追加するさまざまな方法を見てきました。

可変商品を作成し、その属性とバリエーションを手動で追加する
グローバル属性を作成し、それを各可変商品に適用します
WooCommerceバルクバリエーションプラグインの使用
プログラムで可変製品を取得する

すべての方法で作業が完了しますが、あなたにとって最適な方法はどれですか？初心者ユーザーの場合は、WooCommerceのデフォルトオプションを使用できます。それらは使いやすく、セットアップはほとんど必要ありません。多くの製品があり、より多くのカスタマイズオプションが必要な場合は、バルクバリエーションプラグインを使用することをお勧めします。これらのツールを使用すると、バリエーションを作成するプロセスが非常に簡単になり、スピードアップします。さらに、それらは非常に便利な製品バリエーションの一括追加のプロセスを失敗させません。

最後に、コーディングスキルがある場合は、独自のソリューションをコーディングして、プログラムで製品バリエーションを作成できます。これはもう少し複雑で、コーディングスキルが必要ですが、多くの柔軟性があります。

あなたはその投稿が好きでしたか？いずれかの方法について質問がありますか？以下のコメントでお知らせください！

WooCommerceのさまざまな製品オプションの詳細については、次の投稿をご覧になることをお勧めします。

WooCommerceで注目の商品を設定する方法。
WooCommerceでデフォルトの属性を作成する