Ever wonder how people can add different attributes like color, size, etc to a product? WooCommerce variation swatches module of ShopEngine will let you add these variations to your product easily in a few minutes. Let’s get a clear overview of this module and how you can use it.
Quick Overview
ShopEngine is a WooCommerce variation swatches plugin along with a page builder. This tool has a dedicated module for adding variable products. Only free solution is enough for adding variation swatches to WooCommerce products. Besides this plugin, you will need two more free plugins such as:
必要なプラグイン: Elementor (free), WooCommerce (free), ShopEngine (Free)
Next to installing and activating these plugins on your WordPress website, follow the below steps:
✅ Enable the module.
✅ Attributes setup.
✅ Add attributes to products.
✅ Integrate product variations.
バリエーションスウォッチモジュールとは何ですか? #
バリエーション スウォッチ モジュールは、WooCommerce 製品に属性を追加できるモジュールです。たとえば、製品にはさまざまな色やサイズがあります。ShopEngine バリエーション スウォッチ モジュールを使用して、このバリエーションを追加できます。
このモジュールにより、顧客のユーザー エクスペリエンスが向上します。顧客は、必要な製品や好きな製品のサイズや色を選択できます。これにより、売上も増加します。
ShopEngine のバリエーション スウォッチ モジュールを使用するにはどうすればいいですか? #
ShopEngine は、バリエーション スウォッチ モジュールのユーザーフレンドリーなセットアップを提供します。このモジュールを実装するには、次の手順に従う必要があります。
Step 1: Enable WooCommerce variation swatches module. #
まず、管理ダッシュボードに移動し、「ShopEngine >> モジュール」にアクセスします。次に、スウォッチ モジュールをクリックします。

その後、モジュールを有効にして変更を保存します。

ステップ 2: 属性を追加します。 #
2 番目のステップでは、製品の下の属性を押す必要があります。次の情報を入力します。
- 名前: 保存する必要がある色、サイズ、その他の属性。
- タイプ: ShopEngine の色またはサイズを選択します。
最後に保存ボタンを押します。

色を追加するには、「用語の設定」ボタンを押します。

ここで色を挿入するには、フィールドに応じて入力する必要があります。名前を入力するだけで済み、最後に 新しい色の追加ボタン.

ステップ 3: 製品の属性を追加します。 #
商品に属性を追加するには、すべての商品に移動する必要があります。その後、属性を追加する商品を編集します。

製品データとして変数製品を選択します。

次に、属性をクリックしてカスタム製品属性を選択します。次に、追加ボタンを押します。

ここで、色の名前を選択し、バリエーションに使用するをクリックします。最後に、属性を保存します。

ステップ 4: バリエーションを設定します。 #
このステップでは、バリエーションを押して、すべての属性からバリエーションを作成するを選択します。次に、実行を押します。

次に、製品の色またはサイズをクリックして、次の情報を追加します。
- 画像: 画像を挿入します。
- 在庫管理: このオプションを使用すると、在庫製品を管理できます。
- 通常価格: 商品の通常価格を設定します。
- セールスプライス: セール価格を入力します。

次に、変更を保存します。

ステップ 5: 製品のバリエーションを更新します。 #
最後に、「更新」をクリックしてすべての変更を有効にします。

バリエーションスウォッチモジュールを使用した後の最終的な外観 #
Here is the final look after adding variable products with ShopEngine, a WooCommerce variation swatches plugin:
