WooCommerce 2022 的 10 多种最佳变化样本
已发表: 2022-01-19最近的情况迫使许多在线商店所有者为 WooCommerce 寻找变化样本。 在过去的几年里,消费者已经大量转向在线购物而不是实体店。 这导致电子商务网站之间的竞争更加激烈。 结果是用户体验优化标准不可避免地提高。
WooCommerce 商店必须吸引他们的客户以获得高转化率。 当用户在网上寻找他们想要的精确产品时有轻松的体验,他们更有可能完成购买。 他们也更有可能回来购买更多商品,甚至提供推荐和正面评价。
为您的用户提供良好购物体验的最佳方法之一是使用尺寸、价格、照片和颜色不同的产品。 WooCommerce 的默认界面为您提供了一些变体元素。 但是,这些元素很少且不足,这就是您可以从 WooCommerce 变体插件中受益的原因。 您可能需要了解最好的 WooCommerce 插件以增加销售额。
WooCommerce 中的产品变化是什么?
产品变体是 WooCommerce 允许您在单个产品上提供变体/区别的功能。 您可以控制每个变体的不同图像、价格、库存和其他质量。 这些变化可以归结为不同的颜色和尺寸,以及其他区别。
您如何为 WooCommerce 使用变体样本?
您可以使用 woocommerce 变体样本在全球范围内管理任何属性。 您所要做的就是遵循以下快速程序:
- 选择要使用的术语。
- 选择属性图像或颜色。
- 如果您选择颜色,请选择一种颜色。
- 如果您选择图片,请上传图片。
如何在 WooCommerce 中显示产品变体?
在 WooCommerce 中显示产品变体所需要做的就是:
- 通过设置单个产品的区别来创建可变产品。 WooCommerce 使您能够开箱即用地选择您的变体。
- 通过单击“属性”选项卡并从下拉菜单中选择要添加的变体来添加产品属性。 如果需要,您可以创建自定义属性。
- 通过转到“变体”选项卡并单击“创建变体”来生成变体,因此 WooCommerce 会自动生成您选择的属性的所有可能组合。 如果您想自己生成它们,您可以在填写价格和其他产品信息之前选择“添加变体”选项。
- 保存您的更改,预览生成的项目,然后单击“发布”按钮发布它们。 您的产品将出现在您的页面上。
如何将下拉菜单更改为 WooCommerce 变体的复选框按钮?
如果您需要复选框按钮来替换 WooCommerce 中的默认下拉菜单,您只需要 RadiusTheme 的 WooCommerce 变化样本。 该插件将在您的 WooCommerce 商店中的每个下拉列表中添加用户友好的复选框按钮。
如何更改 WooCommerce 中的默认变体?
转到 WooCommerce 仪表板上的产品,然后单击可变产品。 下拉菜单将显示产品数据; 选择可变产品。 在“变体”选项下选择默认表单值。
如何在样本中列出我的可变产品变体?
一旦您安装了 RadiusTheme 的 WooCommerce 的变体色板,创建和展示可变产品就非常容易。 您可以使用不同形状的样本显示产品的变化。
WooCommerce 的最佳变化样本如下所列:
- RadiusTheme 的 WooCommerce 变化样本
- Emran Ahmed 的 WooCommerce 变化样本
- WooSwatches – WooCommerce 颜色或图像变化色板
- Woosuite 的 WooCommerce 变化样本
- VillaTheme 的 WooCommerce 产品变化样本
- Swatchly – WooCommerce 的变体色板
- 变化样本和照片
1. RadiusTheme 的 WooCommerce 变化样本

变体是 WooCommerce 网上商店产品变体的魔杖。 它以风格完成广泛的功能; 它允许您添加标签、颜色和图像,以获得最佳客户体验。 与我们的 Variation Images Gallery 插件一样,该插件可以帮助您改善购物体验以及产品对买家需求的吸引力和相关性。 您将获得有关如何设置和配置 WooCommerce 产品变化样本 PRO 的详细文档
WooCommerce 的变体样本非常适合各种网上商店。 它具有各种广泛的功能,包括添加标签、图像和颜色以提供更多购物选择。 就像同一作者的 Variation Images Gallery 插件一样,这个插件改善了购物体验以及产品相关性和吸引力。
WooCommerce 的变化样本的用户友好性对访问者和管理员有益。 它是完全响应和移动友好的。 大多数用户通过手机购物,您将轻松进入这个市场。 这个 WooCommerce 变体样本插件通过优化显着提高了您的页面速度。
WooCommerce 的变体色板允许您自定义产品色板的边框,以增加优雅感。 使用您网站上的插件,您可以为背景选择特定的图像或颜色。 它还为产品和产品类别页面提供工具提示。
它的默认操作方式意味着它在产品详细信息页面上运行,它增强了标签、颜色和属性图像的显示。 此外,它还支持产品快速查看。 它使您可以控制图像大小和工具提示。 这个 WooCommerce 变体插件使您可以在方形和圆形样本形状之间进行选择。 字体大小和颜色都由你决定。
此插件可让您决定是否要交叉表示禁用的产品变体,而不是隐藏它们。 它还提供完全的不透明度控制。
专业版:
使用 WooCommerce 的 Variation Swatches 高级版本,您可以在存档页面上启用色板,这是默认 WooCommerce 缺少的功能。 您可以从设置中启用该功能。 这些设置很容易配置。
使用此 WooCommerce 产品变体插件,您可以使用工具提示控制存档或商店页面上的图像变体和文本。 您可以为每个产品选择要在商店页面上展示的单个属性。
WooCommerce PRO 的变体色板还允许您使用双色变体色板来说明您的产品是否是双色的。 您可以从详细信息页面为每个产品设置所需的图像、颜色、按钮或标签、单选和形状(圆形/方形)变体样本。
对于更友好的用户界面,您可以让您的页面仅显示 2 或 3 个属性,然后在存档或类别页面中显示“显示更多”链接。 您可以通过在“快速查看”中使用变体样本来改进产品购买。 WooCommerce PRO 的变体样本具有产品详细信息页面的图像和文本工具提示。 它允许您从存档或商店页面生成变体链接,以便当用户访问详细信息页面时,地址栏上会出现不同的链接。
该插件还在产品详细信息页面上有颜色变化样本,以替换下拉选项。 您还可以为每种产品自定义不同的属性,例如颜色和尺寸。 WooCommerce Pro 的变体样本支持每个产品属性的文本工具提示自定义。 您可以交叉、模糊或隐藏缺货的产品。
显着特点:
- 评分:28 条评论中的 4.4 星
- 定期更新(?):每月定期更新
- WordPress 版本支持:WordPress 4.8 或更高版本
- PHP 版本支持:5.6 或更高
2. Emran Ahmed 的 WooCommerce 变化样本

WooCommerce 的 Variation Swatches 是一个出色的插件。 它为选择产品属性变化提供了真正的专业体验和界面。 该插件是将变体选择字段转换为简单的标签、颜色和图像的最简单方法之一。
这个 WooCommerce 变体插件允许您在单个 WooCommerce 产品中展示颜色、图像和标签变体属性。 它还允许您的用户在产品快速视图中查看它们。 这个免费版本让您可以决定变体样本的颜色、大小和形状。 您可以在方形和圆形样本之间进行选择。
WooCommerce 的变体样本在悬停在变体样本上时会提供优雅的工具提示。 您还可以轻松地在设置中启用或禁用悬停效果。 这个插件可以很容易地个性化你的产品属性的开发过程。 如果你想从头开始编写 CSS,你可以禁用默认的插件样式表。
这个 WooCommerce 变体样本插件允许您显示缺货变体的十字符号,该功能具有多达 30 个变体。 它具有同样多的显示变体,用于脱销变体的模糊和隐藏选项。 这样一来,您的用户就不会因为购买不可用的商品变体而感到不便。
如果需要,您可以将样本按钮转换为下拉菜单并轻松返回。 WooCommerce 的变体样本允许在标签旁边显示选择变体名称。 插件附带的工具提示功能也很出色。
专业版:
WooCommerce PRO 的变体色板的一个令人印象深刻的功能是,当变体设置了特色图像时,它会自动将下拉菜单转换为图像色板。 该插件使您能够通过在存档或目录页面上展示样本来提高商店转化率。 您还可以通过工具提示在同一页面上显示变体图像和文本,以获得更多转换机会。
这个高级 WooCommerce 变体色板插件允许您将用于按属性过滤产品的小部件转换为色板。 如果需要,该小部件有助于启用过滤器下拉菜单。
就像上面 RadiusTheme 的 WooCommerce 的变体色板一样,这个高级插件允许您为单个变体添加双色。 它还允许您为产品变体视图添加快速视图。 但是,此插件具有一项特殊功能,可让您展示剩余库存数量。 这会产生紧迫感,因此会加快销售速度。
该插件的显着特点:
- 评分:585 条评论中的 4.9 星
- 定期更新(?):每几个月一次
- WordPress 版本支持:4.8 或更高版本
- PHP 版本支持:5.6 或更高版本
3. Woosuite 的 WooCommerce 变化样本

WooCommerce 的变体样本是显示可变产品的绝佳方式。 它为您提供了许多选项和用户友好的界面来使用。
此插件允许您通过单击按钮将所有默认下拉列表转换为色板按钮或标签。 该插件提供了一个切换选项,您可以通过该选项自动将菜单转换为图像样本。 但是,这种自动操作仅在所讨论的变体具有图像时才会发生。 同时,您可以为具有双色的产品变体设置双色。
WooCommerce 的变体样本允许您在商店或存档页面上展示样本,以便用户找到您想要他们购买的东西。
专业版:
该插件的高级版本带有产品页面上色板的尺寸控制。 它使您可以选择如何处理缺货变体的显示。 您可以使用的选项包括交叉、模糊和隐藏变化。 您还可以为可用产品变体的标签、文本或按钮自定义色板的形状。
当您利用该功能在您拥有的存档或商店页面上显示样本时,您可以改善用户的购物体验。 WooCommerce Pro 的变体样本附带的变体工具提示使您能够在商店页面上显示产品变体。 这有助于您的用户轻松找到他们想要的产品。
WooCommerce Pro 的 Variation Swatches 具有即插即用功能的设计。 这意味着他们已准备好在您安装插件时实施和使用。 您应该注意插件提供的其他功能包括 WooCommerce 过滤器小部件、工具提示文本和颜色自定义以及色板限制设置等。
其他显着特点:
- 评分:3.9 星,共 54 条评论
- 定期更新(?):大多数月份的定期更新
- WordPress 版本支持:4.5 版
4. VillaTheme 的 WooCommerce 产品变化样本

WooCommerce 的产品变化样本是一个优雅的插件,可让您显示产品的属性变化。 该插件允许您决定是否需要产品变体的默认下拉列表或样本。
您可以在此插件的设置中自定义全局和自定义属性。 您可以使用搜索栏查找现有的全局属性。 WooCommerce 产品变体插件允许您以两种样式(垂直或水平)中的任何一种设置全局属性的显示。
WooCommerce 的产品变化样本可容纳 5 种类型的全局属性显示。 这些包括按钮、图像、收音机、变体图像和颜色。 使用此 WooCommerce 变体插件,您可以选择产品的样本之一并将其设计为样本配置文件。 您可以对其进行自定义以展示默认的样本设计模式。 它具有颜色、宽度、字体大小、移动模式大小、高度、填充、框阴影效果和名称的设置。
您可以在选择变体样本时管理工具提示状态的各种设置。 边框、颜色、字体大小和工具提示位置都是可自定义的。 WooCommerce 的产品变体样本使您能够自定义现有全局属性的每个属性术语。
专业版:
除了免费版本中的所有功能外,您还可以使用此插件的高级版本获得更多功能。 使用 WooCommerce PRO 的产品样本,您可以创建无限的样本配置文件。 该插件甚至允许您复制现有的样本配置文件并创建许多样本设计模式。
您可以在产品列表中显示或隐藏特定的产品属性。 无论有问题的样本类型如何,您都可以为每个属性项设置图像。 当客户选择该属性项时,图像将很容易改变。 如果您不想禁用缺货的产品属性,您可以将它们模糊或划掉。 您还可以选择使它们可点击或不可点击。

使用此 WooCommerce 变体插件,您可以输入现有属性的名称并轻松自定义它们。 它还允许您将自定义的每个属性分配给您选择的类别。 2 种显示样式和 5 种显示类型可让您的样本具有独特性。 在产品列表中隐藏和显示变体文本工具提示很容易。
当用户选择了属性时,您可以允许添加到购物车按钮出现。 您可以自定义类别和商店页面上不同样本的位置。
显着特点:
- 评分:4.8 星,共 47 条评论
- 定期更新(?):每月定期更新
- WordPress 版本支持:5.0 或更高版本
- PHP 版本支持:7.0 或更高版本
5. ThemeHigh 的 WooCommerce 变化样本

ThemeHigh 的 WooCommerce 变化样本为您的用户购物体验提供了出色的界面。 该插件使您能够展示基于不同方面的产品变化,例如尺寸、颜色甚至纹理。
您可以制作 4 种样本中的任何一种来展示您的产品属性。 您可以以圆形或方形色板显示颜色、图像、单选或标签色板。 该插件允许您在购物者将鼠标悬停在产品样本上时将属性术语显示为工具提示。
WooCommerce 的变体样本可让您为可变产品的属性设置样本。 您可以使用三种样本类型及其属性自定义属性。 当用户将鼠标悬停在样本图标上时,您可以使用您选择的显示颜色来显示属性的术语名称。
您可以使用此插件在特定属性的标签旁边显示选定的变体名称。 该插件允许您编辑字体大小、背景颜色、图标宽度和高度。 由于它与 Ajax 兼容,它允许您设置阈值,以便可以通过 Ajax 或 JavaScript 检查产品的可用性。
专业版:
使用此高级插件,您可以在用户将鼠标悬停在样本上时使用自定义工具提示来提示描述、图像或其他文本。 WooCommerce PRO 的 Variation Swatches 有缺货警报。 它还对剩余库存发出警报,这会造成稀缺,从而增加销售额。
您的购物者会发现从商店页面本身很容易将商品变体添加到他们的购物车中。 这是因为您可以在商店页面上显示样本。 YITH Quick View 之类的 Quick View 插件可与此 WooCommerce 变体插件无缝协作。
您可以在商店或存档页面中添加工具提示。 如果您有多色产品变体,则此主题的双色色板功能将是有益的。 与 RadiusTheme、WooSuite、Emran Ahmed 和 VillaTheme 之前的插件一样,此高级版本支持 4 种类型的变化样本。 您可以为单个属性创建多组样本设计,并添加到产品变体的描述性中。
WooCommerce PRO 的变体色板允许您在 WooCommerce 过滤器小部件上将属性显示为色板。 您可以使用插件为每个产品或全局设置不同的样本类型。 文字、文字背景和边框颜色,以及清除按钮的边框半径,都很容易调整。
显着特点:
- 评分:5 星,共 28 条评论
- 定期更新(?):每月更新一次
- WordPress 版本支持:5.3 或更高版本
- PHP 版本支持:7.0 或更高版本
6. Swatchly – WooCommerce 的变体色板

您使用 Swatchly 获得的主要功能之一是能够在产品列表以及商店和产品详细信息页面上启用色板。 它支持多色色板的显示。 与此列表中的其他插件不同,Swatchly 带有 3 种不同的样本形状而不是 2 种。它们包括方形、圆形和圆形。
使用此 WooCommerce 变体插件,您可以将样本对齐到产品显示的左侧、中心或右侧。 该插件可以轻松地从变体下拉列表到样本类型的标签和按钮,然后返回。 Swatchly 允许您轻松设置色板的宽度、高度和字体大小。
您可以分别定义单个产品和产品列表页面的全局设置。 使用 Swatchly,您可以覆盖每个单独产品的设置。 WooCommerce 产品变体提供将单个产品样本重置为默认设置的选项。
Swatchly 支持禁用带有十字符号、模糊和交叉、仅模糊和隐藏的属性类型。 您可以随意启用和禁用 Tooltip。 WooCommerce 变体插件支持文本和图像中的 2 种不同的工具提示。 Swatchly 允许您更改工具提示图像大小和默认的 Ajax 变化阈值。
当您安装此插件时,您将在管理面板上有效地拥有一个样本预览列。 Swatchly 也有形状嵌入尺寸控制。 当购物者单击他们想要的变体时,他们可以通过再次单击它们来取消选择它们。
斯沃琪专业版:
Swatchly PRO 具有该插件免费版本附带的所有功能。 它允许您覆盖每个单独产品的全局样本设置。 这个特殊的插件有一个很好的变体标签分隔符。 它在单个产品页面上显示所选变体的名称。
Swatchly PRO 允许您为商店页面启用 Ajax 添加到购物车按钮,以获得更轻松的购物体验。 该插件具有自定义的“添加到购物车”文本,您可以对其进行调整以匹配整个网站的品牌。 您可以启用和禁用 Ajax 添加到购物车的弹出通知。
Swatchly PRO 允许您将色板定位到自定义挂钩中,以便于应用和管理。 该插件支持简码,可以轻松在任何页面和产品上添加新色板。 这个 WooCommerce 变体样本插件提供了一个产品缩略图选择器,很少有插件提供。
与其他插件相比,此插件的工具提示设置是额外的。 您可以管理工具提示的文本字体大小、颜色、填充和行高。 Swatchly 使您能够自定义工具提示图像边框的颜色和大小。 工具提示箭头的间距、颜色和大小也由您自定义。
显着特点:
- 评分:5 颗星(满分 4 分)
- 定期更新(?):每月不时更新
- WordPress 版本支持:4.0 或更高版本
- PHP 版本支持:5.4 或更高版本
7. WooSwatches – WooCommerce 颜色或图像变化色板

WooSwatches 是 WooMatrix 的高级插件,用于 WooCommerce 商店的变体样本。 此插件支持使用下拉选择字段以及文本、图像和颜色变化样本。 它为您的用户提供了更好的展示和与可变产品属性和属性样本的交互。
使用此插件,您可以在全球范围内自定义属性的图像或颜色的值。 WooSwatches 在 size 和 large 之间有各种样本尺寸。 它为您提供方形和圆形样本支持。 使用此插件,您可以选择是否要在样本下方展示特定变体的名称。 您还可以在单个产品页面上显示选项名称。
WooSwatches 在商店、标签、类别和存档页面中显示图像和颜色样本。 您的变体样本将导致使用插件附带的直接变体链接功能检索唯一链接。 当购物者将鼠标悬停在存档或类别页面上时,此插件使您的网站能够更改产品的图像。
由于 WooSwatches 支持简码,因此您可以添加与产品页面简码兼容的颜色和图像样本。 如果样本数量超过定义的数量,此插件使您能够显示“显示更多”链接。 WooSwatches 允许您在滑块编号超过设定值时在滑块上显示商店样本。
WooSwatches 的显着特点:
- 评分:4.06 星,共 192 条评论
- 定期更新(?):是的,它具有定期更新功能
- WordPress 版本支持:4.9 及更高版本
- 全面的视网膜支持
8. 变化样本和照片

您有什么想要在您的在线商店上展示的、具有显着变化的东西吗? Variation Swatches and Photos 摆脱了通过下拉字段方法在 WooCoommerce 上展示产品的老式方式。 您现在可以使用图像和颜色样本来显示样式、尺寸、定价和任何其他对您的产品进行分类的方面。
产品变量展示的美感让您在竞争中获得优势,因为购物者可以确定他们的偏好并快速决定购买。 该插件还允许您通过其用户友好且强大的界面显示每个产品的颜色和图像。
每个人都喜欢选择; 这是一个允许无数选项的插件,因此可以保证您获得最佳结果。 此插件将使您能够创建颜色和图像样本以展示可用的产品变量属性,例如标签、样式、尺寸、颜色等。
这个插件包括一个新的选项来创建图像样本、无限的颜色样本,并将样本样式设置为圆形或方形。 您可以用图像和颜色样本替换默认的 WooCommerce 下拉字段。 此插件仅适用于可变产品。
此插件的高级版本具有令人难以置信的额外功能。 仅举几例,它们包括在商店页面上显示色板和使用双色以及单选按钮创建色板的选项。 此外,您可以设置在商店页面上显示的最少属性数量,并在悬停时缩放样本图像。 对于色板方形样式,您可以在圆形和锐边之间进行选择。
9. XT Woo 变体色板

XT Woo Variation Swatches 是另一个顶级的 WooCommerce 插件,可将您的变体下拉列表转换为漂亮的色板。 这些是可变产品属性的标签、颜色和图像样本。 具有图像的变体颜色属性会自动激活图像色板。 这个出色的插件支持目录页面和产品快速查看模型中的标签、图像和色板,包括 XT Woo 快速查看。
您将获得一个用户友好且易于使用的界面,允许您向每个属性管理页面添加默认标签、颜色和图像。 XT Woo Variation Swatches 甚至可以帮助您在编辑产品页面中为快速属性选择正确的样式。 虽然它带有有限的选项,但这个插件可以实时预览您的编辑选项。 您可以调整所有色板的高度、宽度和对齐方式。 您也可以从方形、圆形和圆形选项中选择样本样式。
专业版提供所有免费功能等等。 您可以调整色板的容器间距、垂直和水平间距以及色板本身(宽度、高度、字体大小和颜色)。 您可以在图像或文本中启用工具提示并调整其背景、文本颜色、图像大小、边框大小和半径。
10. WooCommerce 的智能变体图像

如果您希望您的 WooCommerce 显示产品变体带有边缘,您应该考虑使用 WooCommerce 的智能变体图像。 该插件具有优化 WooCommerce 产品变化和促进销售的所有关键功能。 选择变体后,产品样本上的主要图像和缩略图将立即交换。 也可以使用单个变体的多个图像。
您可以在产品循环页面上显示两个变体库。 WooCommerce 的智能变体图像附带的简单滑块可以很容易地以时尚的方式显示一些奇妙的图像描述。 该插件与 WPML 兼容,因此您可以将其翻译成您想要的任何语言。
专业版向您的目录添加了另一组功能,将变体显示为购物车图像。 此处的变体可以在电子邮件订单和管理员订单中显示。 您可以使用一系列缩略图选项,包括禁用缩略图、保持缩略图可见、选择交换和缩略图单击交换。 此插件允许在具有不同变体的不同产品之间共享单个图像。 该插件将使您能够同时将图像分配给多个变体,以使您的工作更轻松。
哪个是最好的 WooCommerce 变体色板插件?
默认的 WooCommerce 布局和体验还不够,别说令人满意了。 购物者对他们购买的产品有不同的偏好。 您的网站需要向他们保证他们选择的变体是他们想要的。 大多数商业领域都非常具有竞争力,购物者会涌向提供最好产品和最好体验的网站。
那么,哪个 WooCommerce 变体样本插件将为您提供最简单的时间为您的网站提供您需要的功能? 此列表中的哪个插件可以最大程度地提升您整个 WooCommerce 商店的地位?
每个插件的显着功能都会影响您的决定。 也许您会将每个插件的评级与使用它们的 WooCommerce 店主的特定体验联系起来。 另一方面,您可以考虑更新频率,以决定哪些插件可以让您随时了解 WooCommerce 样本的最新技术改进。 这两种思路都是可行的,并且会有所帮助。
在测试和评估此列表中的每个插件提供的不同体验之后,我们有我们最喜欢的,您可能已经猜到了哪一个。 如果您猜到了 RadiusTheme 的 WooCommerce 变化样本,那么您是对的。
我们喜欢它有不同的原因,但它卓越的可用性不容错过。 这个主题的作者花时间创建了完美的插件。 该插件的高级版本因其提供的强大功能而广受赞誉。 作者的支持也很出色。
不要只相信我们的话 - 安装插件并与您最喜欢的插件进行第一手体验。