Adding Variation Swatches to WooCommerce Products with blocksy 2

In the competitive e-commerce environment, improving the intuitiveness and aesthetics of product displays is directly related to users' purchasing decisions.blocksy 2 Theme Launched Variation Swatches Functions forWooCommerceThe store brings a new way of displaying product variants. With rich visual options such as color blocks, buttons, and images, users can quickly select their preferred product combinations and dramatically improve their shopping experience.

What are Variation Swatches?

Variation Swatches is a way to display product variations (e.g. colors, sizes, materials) as small visual icons or color blocks on the page, replacing traditional drop-down menus. This approach allows shoppers to complete their selection more intuitively and quickly.

Supported swatch types include:

• Button
• Single or Dual Color (Color or Dual Color)
• Picture (Image)
• Mixed color palette (Color + Image)

blocksy 2 of the variant color palette system with WooCommerce The native Attributes functionality is perfectly compatible and easy to configure, with no additional plug-in support required.

⚡ Reminder: The Variation Swatches module is part of the blocksy Pro (used form a nominal expression) Shop Extra Extension, Professional or Agency subscription required.

How do I enable the variant color palette feature?

The enabling process is very simple:

• go into WordPress In the backend, click blocksy→ in the left menu. ExtensionsThe

• locate Shop Extra extension module, enable the Variation SwatchesThe

Configure product attributes (Attributes)

When the module is enabled, you need to set the swatch type for the product attributes:

• Backstage Selection offerings → causalityThe
• New or edit existing properties.

• Select the corresponding swatch type (e.g., Picture, Color, Button).

• After saving the settings. in the Properties entry (Terms):
  • Image Swatches: upload an image representing this variant.
  • Color Block Swatches: Select one or two color combinations.
  • Tooltip can be set to add accessibility assistance instructions.

In this way, traditional text options can be easily upgraded to vivid visual selectors.

Individual configuration of individual products

If certain products require special displays.blocksy 2 Also allowed inIndividual variable product editing interfacein the Swatches page to adjust the swatch styles individually. Simply find the new Swatches settings option on the product edit page and customize how each variant is displayed.

Style Optimization in the Customizer

To ensure a beautiful front-end presentation, blocksy 2 also offers a wealth of customization options:

• go into exterior condition → customizableThe
• Location:WooCommerce → General → Variation SwatchesThe

• Customizable:
  • Color plate shape (round or square)
  • Swatch Size
  • Color plate spacing
  • Whether to display color palette and quantity limit on product list page

Individual product pages display variant color palettes by default, with no additional action required.

Front-end effect show

Once enabled, users can see clear, intuitive color swatch selectors on product listing pages and individual product detail pages. The color palette not only enhances visual aesthetics, but also accelerates purchasing decisions.

In particular, the support of mixed color palettes (Color + Image) makes the product display richer and more detailed, which greatly enhances the user's shopping experience.

summarize

leverage blocksy 2 of the variant color palette function.WooCommerce Stores can easily achieve a more professional and visually appealing way of displaying products. Whether it's colors, images, or custom buttons, blocksy 2 provides strong support for improving user experience and conversion rates.

Latest Articles

Contact Us
Can't read the tutorial? Contact us for a free answer! Free help for personal, small business sites!	Customer Service
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) E-mail: [email protected]
④ Working hours: Monday to Friday, 9:30-18:30, holidays off