Using variations to change the product template in the designer

WooCommerce variations allow you to load different products inside the product designer. This is useful for offering options such as different colors, sizes, or product cuts (e.g., T-shirts, hoodies, mugs). You can also control how the Customize button behaves when variations are in use.

Step 1: Create a Variable Product

1. In your WordPress Dashboard, go to Products → Add New (or edit an existing product).
2. Click on Product Data to expand dropdown menu
3. Select Variable Product

Step 2: Add Attributes

1. Go to the Attributes tab.
2. Click on Add New
3. Create the attributes you need, such as Color or Size.
4. Save attributes and ensure the “Used for variations” box is checked.

Step 3: Generate Variations

1. Go to the Variations tab.
2. Use the dropdown to **Generate variations **or add them **manually **from all attributes.
3. Save your variations.

Step 4: Assign Products to Variations

• For each variation, you can assign a Chamevo Product.

Step 5: Set an Initial Product

Make sure to select an initial product in the Product Designer meta box (just like you would for any other product). This ensures the designer loads correctly on first view.

Optional Configurations

• Customize Button Behavior

In Chamevo → Settings → Features → WooCommerce, you can choose whether the Customize button shows immediately or only after a variation has been selected.

• Hide Variations After Customize

If you want to hide the variation dropdowns after the customer clicks Customize, you can use a small CSS snippet:

.fpd-customize-button-hidden .variations {
    display: none;
}

Updated on: 30/10/2025