Visual Attributes - WooCommerce Variable Products

Visual Attributes - WooCommerce Variable Products

WPMeta Score

Did you know?

Plugin Popularity 2.5
Author Activity 3.7
  • 🎖 Plugin ranks 1,745 amongst 50,000+ plugins.
  • 🎂 This plugin celebrated it's 7th anniversary 6 months ago.



Visual Attributes is a WooCommerce extension that enhances variable products replacing the attribute dropdown with:

  • images
  • color swatches
  • text labels
  • icons

so you can pick each attribute by clicking on a visually descriptive element.

Enhance the user experience in your store by giving them the ability to simply click visual elements instead of clicking the attribute menu, read the attributes and only then select the desired one.

Visual Attributes is also good for mobile devices since your users can just tap the element instead of launching the disruptive select interface in iPhone and Android.


  • Use images, icons, color swatches and text labels to select product attributes in variable products
  • Mix the visual attributes with the standard select dropdown
  • Setpresets for attributes: select the type and add the visual attribute once; It will be pre-filled when you create a new product and add this attribute
  • Show visual attributes in WooCommerce shop loop, product category and product tag pages
  • Font icons for crisp visualization in retina or other high density display
  • Choose from Genericons or Font Awesome icon font libraries, or
  • Use your own custom font icon set
  • Specify to show visual attributes only on mobile, desktop or both
  • Supports custom product attributes and taxonomy attributes respecting their custom order
  • Display the attribute name
    • as a label below the visual element
    • as a tooltip that shows up when mouse rolls over the visual element
  • Also works with simple products displaying visual attributes and optionally hiding the Additional Information tab
  • Disable them on each product while preserving the data
  • Easily customizable through visual controls
  • Write custom CSS & JavaScript directly in the plugin settings to keep them safe during updates.
  • Extensive customization can be achieved through the usage of WordPress actions, filters and JavaScript events included throughout the code
  • Fully translatable
  • Complete spanish translation included
  • Complete german translation included. Thanks to Jessica Mense
  • Good documentation and prompt support

Adding Visual Attributes

You can add images, select icons, specify colors and set text labels right in WooCommerce Product Data panel. The panel is completely integrated with product custom attributes and taxonomy attributes.

Visual Attribute Presets

With presets, you define default images, color swatches, icons and text labels once in Product > Attributes, editing the attribute term where you want to setup presets. The next time you create a new product and add this attribute, its visual attributes will be already filled-in with the preset you defined. You can also add presets when you first create a new attribute.

Show Visual Attributes in Shop Loop, Product Category Pages and Product Tag Pages

This feature allows you display visual attributes in WooCommerce shop catalogue views. You can select all attributes, none or pick specific attributes. It works for inline attributes or taxonomy attributes and you can also display the attribute labels. In variable products, the visual attribute show on shop it?s linked to the product single view and when the single view is loaded the clicked attribute is already preselected.


1.1.9 Sep 27. 2016 Fix: Solving problem with Post’s QuickEdit link.

1.1.8 Jun 7. 2016 Enhancement: Adding compatibility with WP 4.5.2.

Access the support forum

Assistance is provided exclusively through the support forum.

Support forum

See Also

Fullscreen Touch Product Gallery for WooCommerce Product Slider Carousel for WooCommerce - CodeCanyon Item for Sale

Allground – Responsive Fullscreen Backgrounds for WordPress

Allground - Responsive Fullscreen Backgrounds for WordPress AllSlider - WordPress Responsive Slider Carousel - CodeCanyon Item for Sale

Alldion – Responsive Accordion for WordPress

Alldion - Responsive accordion for WordPress - CodeCanyon Item for Sale