Kadence Shop Kit 变体色板功能详解：优化 WooCommerce 商品展示方式

Kadence Shop Kit(formerly known as Woo Extras) has extended the WooCommerce The function of which "variant color palette"is a highly practical one. It allows product variants to be visually displayed in drop-down menus, radio boxes, colors or pictures, making it easy for customers to quickly understand the differences in products and enhancing their willingness to buy.

Getting started with the variant color palette feature

Installation and Enabling Features

Installation and activation Kadence Shop Kit plugin.
exist WordPress Find it in the lower left corner of the back office Shop Kit menu, click to enter.

go into Variation Swatches tab to enable the feature.

Enable Product Gallery

The Variation Swatches feature relies on the Shop Kit offersProduct Gallery(Product Gallery) Module.

Enable the path as follows:

leave for Shop Kit Settings → Product Gallery
Enabling the product gallery function (Toggle switch)

Optional feature: enable product imagesrotate(Product Slider)

If you need to use the image rotation feature, you can also enable it in the product page.

Product Page Configuration Options

How variant labels are displayed: It is displayed next to the options area by default, and can also be set to be hidden, displayed above, or displayed on hover.

Default color palette type: Selects the default sample type for the variant. This can be set to drop-down selection boxes, radio boxes, image and color samples, or taxonomy definitions.

If you select "Taxonomy Definition", you can find the definition of the taxonomy in the WooCommerce → Attributes The page sets the swatch type individually for each attribute.

This setting can also be adjusted for individual products.

Default label display: no display, display above, display below, hover display

Default Swatch Size: Swatch size can be set for all products or individually within a single product.

Dropdown box placeholder text: The default prompt text in the drop-down box can be customized, e.g. "Please select an option".

Product variant setup process

Before you can use the variant color palette, you need to set the attributes and variants for the product. On the product edit page in the "Product Data"In the module, go to "causality" tab, add the desired attributes (e.g. color, size), check the "For variants".

Then go to "morph" tab to set prices, images for each variant, or you can add multiple images to form a variant gallery.

Adjustment of the color palette style for individual products

When customizing color swatches for individual products:

On the product edit page, go to Product Data → Variation SwatchesThe
set for each variant:
- Swatch types (colors, pictures, radio boxes, etc.)
- Label display mode
- Swatch Size
Assign colors to each variant or upload an image.

When finished, save and preview the product page to check that the effect is rendered correctly.

Overview of color palette presentation styles

Kadence Shop Kit supports the following display styles:

pull-down menuStyle (Dropdown)

Traditional selection method for attributes with more options or without images.

Radio Box Style

Displaying each option as a button is suitable for fewer variants.

Image or color swatch style (Color/Image Swatch)

Visualize each variant graphically, suitable for showing color, pattern or style differences.

summarize

Variant color palettes provide a richer presentation for product pages. Product information is more intuitive, which helps customers quickly understand the difference between the options and enhance their interest in the product. Especially suitable for apparel, customization, home goods display, with the Kadence The other modules provided are used to enable more flexibility in the presentation of product pages.

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