=== WooCommerce Variation Swatches ===
Contributors: EmranAhmed, wpeshaan, getwooplugins
Tags: woocommerce variation, woocommerce, variation swatches, woocommerce attributes, product attributes, product color, product size, variable product attributes, variation product swatches, color variation swatch, image variation swatch, printful color swatches
Requires at least: 4.8
Tested up to: 5.0
Requires PHP: 5.6
Stable tag: trunk
WC requires at least: 3.2
WC tested up to: 3.5
License: GPLv3
License URI: http://www.gnu.org/licenses/gpl-3.0.html

Beautiful Color, Image and Buttons Variation Swatches For WooCommerce Product Attributes

== Description ==

=== How To Install WooCommerce Variation Swatches Plugin for WooCommerce Variable Products ===

[youtube https://www.youtube.com/watch?v=BySSYFuqwls]

=== How To Import WooCommerce Swatches Plugin Data For Existing Product Attribute Variations ===

[youtube https://www.youtube.com/watch?v=k-Snfpzy8M0]

WooCommerce Variation Swatches is easy to use WooCommerce product variation swatches plugin. It offers an aesthetic and professional experience to select attributes for variation products. It turns the product variation select options fields into radio images, colors, and label. It means with the help of this powerful WooCommerce color or image variation swatches plugin, you can show product variation items in images, colors, and label. So, you can say goodbye to dropdown product attribute fields.

WooCommerce Variation Swatches not only offers the color, image and label attributes in the single WooCommerce product. It also enables them in product quick view. If you're using WooCommerce themes like Flatsome that comes with default Quick View option, you don’t need to hassle to load color and image swatches for variable product attributes in quick view separately.

In the free WooCommerce attribute variation plugin, besides creating size, brand, image, color, and label variation swatches, you can handle the swatches shape style <strong>Rounded and Circle</strong>. On top of that, it allows you beautiful tooltips on variation swatch hover.  Based on your requirement you enable and disable hover from the settings. To maximize and personalize your development process,  the product attributes swatches comes an option to disable default plugin stylesheet so that you can personally write your own CSS. 

= Key Feature Comes with this Plugin =

* Enable Color Swatches For Variable Product Attribute Variations 
  [Live Demo & Documentation](http://bit.ly/3rd-demo-color-swatches-readme)
<hr />
* Enable Image Swatches For Variable Product Attribute Variations
 [Live Demo & Documentation](http://bit.ly/3rd-image-demo-swatches-readme)
 <hr />
* Enable Label/Text/Button Swatches For Variable Product Attribute Variations 
  [Live Demo & Documentation](http://bit.ly/3rd-label-demo-readme)
<hr />
* Convert Globally Created Attibute Variations Into Color, Image, and Label Swatches
  [Video Tutorial & Preview](http://bit.ly/label-swatch-free-read-youtube)
<hr />
* Option to Globally Select ROUNDED Attribute Variation Swatches Shape.
  [Live Demo & Documentation](http://bit.ly/3rd-round-shape-readme) 
<hr />
* Option to Globally Select SQUARED Attribute Variation Swatches Shape.
  [Live Demo & Documentation](http://bit.ly/3rd-demo-square-readme) 
<hr />
* Show Cross Sign For Out of Stock Variation Swatches (Up To 30 Variations)
  [Live Demo & Documentation](http://bit.ly/3rd-demo-cross-out-of-stock-readme)
<hr />
* Blur For Out of Stock Variation Swatches (Up To 30 Variations)
  [Live Demo & Documentation](http://bit.ly/3rd-demo-blur-readme)
<hr />
* Hide For Out of Stock Variation Swatches (Up To 30 Variations)
  [Live Demo & Documentation](http://bit.ly/3rd-demo-hide-out-stock-readme) 
<hr />
* Product Page Swatches Size Control
 [Live Demo & Documentation](http://bit.ly/3rd-demo-size-control-readme) 
<hr />
* Flexible Swatches Tooltip Insert and Display settings 
 [Live Demo & Documentation](http://bit.ly/3rd-demo-size-control-readme)  
<hr />

* Reorder Product Attribute Variation Swatches
* Flexible Swatches Tooltip Insert and Display settings   
* Work on Variable Product Quick View Popup   
* Compatible with popular WooCommerce themes and plugins 
* Frequently Updated And Secured Codebase 
* Option to disable default plugin stylesheet for theme developer
* Enable Color Swatches For Printful Technology
* Compatible With Popular WooCommerce Plugins Including <a href="http://bit.ly/woovs-org-item-page">WooCommerce Variation Image Gallery</a>  

= PREMIUM FEATURES OF WOOCOMMERCE VARIATION SWATCHES =

[Live Demo](http://bit.ly/3rd-main-demo-readme) | [Upgrade to PRO](http://bit.ly/upgrade-to-pro-readme) | [Documentation](https://getwooplugins.com/documentation/woocommerce-variation-swatches/?utm_source=wordpress.org&utm_medium=README&utm_campaign=woo-variation-swatches) | [Support](https://getwooplugins.com/tickets/?utm_source=wordpress.org&utm_medium=README&utm_campaign=woo-variation-swatches)

* Show Entire Color, Image, Label And Radio Attributes Swatches In Catelog/ Category / Archive / Store/  Shop Pages
  [Live Demo & Documentation](http://bit.ly/3rd-demo-acrhive-page-readme)
<hr />
* Show Selected Single Color or Image Or Label Attribute Swatches In Catelog/ Category / Archive / Store / Shop Pages
  [Live Demo & Documentation](http://bit.ly/3rd-demo-readme-catalog-mode)
<hr />
* Convert attribute variations into radio button
[Live Demo & Documentation](http://bit.ly/3rd-demo-radio-readme)
<hr />
* Product Basis Attribute Swatches Type Change
[Live Demo & Documentation](http://bit.ly/3rd-demo-product-basis-product-type-change-readme)
<hr />
* Show All Color, Image & Button Swatches Type In the Same Attribute
[Live Demo & Documentation](http://bit.ly/3rd-readme-demo-show-all-variation-type-in-the-same-variation)
<hr />
* Insert New Image Replacing Globally Added Image For Image Variation Swatches In Each Product
[Live Demo & Documentation](http://bit.ly/3rd-demo-product-basis-image-change-readme)
<hr />
* Insert New Color Replacing Globally Added Color In Color Variation Swatches For Each Product
[Live Demo & Documentation](http://bit.ly/3rd-demo-product-basis-color-change-readme)
<hr />
* Convert Manually Created Attibute Variations Into Color, Image, and Label Swatches
  [Live Demo & Documentation](http://bit.ly/manual-attribute-readme-video)
<hr />
* Change Variation Product Gallery After Selecting Single Attribute Like Amazon Or AliExpress
  [Live Demo & Documentation](http://bit.ly/3rd-readme-demo-amazon)
<hr />
* Generate Selected Attribute Variation Link 
  [Live Demo & Documentation](http://bit.ly/3rd-demo-generate-link-readme)
<hr />
* Option to Select ROUNDED and SQUARED Attribute Variation Swatches Shape In the Same Product.
  [Live Demo & Documentation](http://bit.ly/3rd-readme-demo-round-square)
<hr />
* Show Cross Sign For Out of Stock Variation Swatches (Unlimited Variations Without hiding out of stock item from catalog)
  [Live Demo & Documentation](http://bit.ly/3rd-readme-demo-cross-out-of-stock-variations-more-than-30-variations)
<hr />
* Blur Out of Stock Variation Swatches (Unlimited Variations Without hiding out of stock item from catalog)
  [Live Demo & Documentation](http://bit.ly/3rd-demo-readme-blur-out-of-stock-variations-more-than-30-variations)
<hr />
* Hide Out of Stock Variation Swatches (Unlimited Variations Without hiding out of stock item from catalog)
  [Live Demo & Documentation](http://bit.ly/3rd-demo-readme-hide-out-of-stock-variations-more-than-30-variations)
<hr />
* Shop Page Swatches Size Control
 [Live Demo & Documentation](http://bit.ly/3rd-readme-demo-shop-swatches-size) 
<hr />
* Make Selected Attribute Variation Swatches Size Larger Than Other Default Attribute Variations
 [Live Demo & Documentation](http://bit.ly/3rd-demo-readme-swatches-size-special-attribute)
<hr />
* Show Custom Text in Variation Tooltip
 [Live Demo & Documentation](http://bit.ly/3rd-demo-readme-how-to-enable-text-tooltip)
<hr />
* Show Custom Image in Variation Tooltip
 [Live Demo & Documentation](http://bit.ly/3rd-demo-readme-image-tooltip)
<hr />
* Swatches Border Styling
 [Live Demo & Documentation](http://bit.ly/3rd-demo-readme-swatches-border-styling)
<hr />
* Hover Swatches Border Styling
 [Live Demo & Documentation](http://bit.ly/3rd-demo-readme-hover-swatches-border-styling)
<hr />
* Active Swatches Border Styling
 [Live Demo & Documentation](http://bit.ly/3rd-demo-readme-hover-swatches-border-styling)
<hr />
* Archive Page Swatches Alignment
 [Live Demo & Documentation](http://bit.ly/3rd-demo-readme-shop-alignment)
<hr />
* Customize Tooltip Text and Background Color
* Enable / Disable Ajax Variation
* Archive page swatches positioning
* Archive page swatches alignment
* Tooltip display setting on archive/shop page
* Variation clear button display setting.
* Customize Tooltip Text and Background Color
* Customize swatches colors, background and border sizes
* Automatic updates and exclusive technical support

= Sites Built With WooCommerce Variation Swatches Plugin =

<blockquote>
<ul>
<li> Built With: Flatsome WooCommerce Theme
   <ul style="list-style: none;">
   	<li><a target="_blank" href="http://bit.ly/wvs-flatsome-01">muliomulio.com | Niche: Leather Bag Store </a>  </li>
   	<li><a target="_blank" href="http://bit.ly/wvs-client-demo-01">designchess.com  | Niche: Chess Design Store </a></li>
	<li><a target="_blank" href="http://bit.ly/woovs-demo-flatsome-02">makromass.pl| Niche: Supplements for athletes </a></li>
	<li><a target="_blank" href="http://bit.ly/wvs-demo-client-2">delampjesfabriek.nl  | Niche: Supplements for athletes </a></li>
	<li><a target="_blank" href="http://bit.ly/flatsome-wvs-demo-04">bell-motorcycle-helmets.co.uk | Niche: Motorcycle Helmets </a></li>
   </ul>
</li>

<li> Built With: Avada WooCommerce Multi-Purpose Theme
   <ul>
   	<li><a target="_blank" href="http://bit.ly/woovs-demo-avada-01">luckyonebijoux.com | Niche: Jewelry Shop </a></li>
	<li><a target="_blank" href="http://bit.ly/woovs-avada-02">polymaker.metricdesign.net | Niche: 3d Parts Shop </a></li>   	
   </ul>
</li>

<li> Built With: Divi by Elegant Themes
   <ul>
   	<li><a target="_blank" href="http://bit.ly/wvs-divi-demo-01">embodywear.com | Niche: Bodywear Shop </a></li>
   	<li><a target="_blank" href="http://bit.ly/divi-wvs-demo-01">clasp.apsbay.com | Niche: Handbags Shop </a></li>
   </ul>
</li>

<li> Built With: Enfold - WooCommerce Multi-Purpose Theme
   <ul>
   		<li><a target="_blank" href="http://bit.ly/wvs-enfold-demo">drawnfresh.co.uk | Niche: T-Shirt Store </a> </li>
   </ul>
</li>

<li> Built With: Astra WooCommerce Theme
   <ul>
   		<li><a target="_blank" href="http://bit.ly/astra-wvs-demo">polelegendaerial.at | Niche: Shoe Store </a> </li>
   </ul>
</li>

<li> Built With: Salient WooCommerce Theme
   <ul>
   		<li><a target="_blank" href="http://bit.ly/salient-wvs-demo">chooseoneshop.com | Niche: T-Shirt Store </a> </li>
   </ul>
</li>

<li> Built With: Twenty Seventen Theme
   <ul>
   		<li><a target="_blank" href="http://bit.ly/twentey-seventeen-demo">vollstedt-b2b.com | Niche: Leather Wallets Store </a></li>

   </ul>
</li>

<li> Built With: TheGem WooCommerce Theme
   <ul>
   		<li><a target="_blank" href="http://bit.ly/thegem-wvs-demo">sarrowork.com.br | Niche: Jacket Clothing Store </a></li>

   </ul>
</li>

<li> Built With: Kalium WooCommerce Professionals Theme
   <ul>
   		<li><a target="_blank" href="http://bit.ly/wvg-demo-kelium">qnoop.com | Niche: Clothing Store </a></li>
   </ul>
</li>

<li> Built With: Jevelin WooCommerce Theme
   <ul>
   		<li><a target="_blank" href="http://bit.ly/jevelin-wvs-demo">falkgarn.se | Niche: Cotton & Spinning Store </a></li>
   </ul>
</li>

<li> Built With: Nitro WooCommerce Theme
   <ul>
   		<li><a target="_blank" href="http://bit.ly/woovs-demo-nitro">sethsoldtimes.com | Niche: Dise Golf Store </a></li>
   </ul>
</li>

<li> Built With: Domino WooCommerce Theme
   <ul>
   		<li><a target="_blank" href="http://bit.ly/domino-theme-demo">abso.com.ar | Niche: Clothing Store </a></li>
   </ul>
</li>

<li> Built With: KuteShop WooCommerce Theme
   <ul>
   		<li><a target="_blank" href="http://bit.ly/kuteshop-vws-demo">torbice.s | Niche: Bag and Baggage Store </a></li>
   </ul>
</li>
</ul>
</blockquote>

= Officially tested plugins =

* WPML
* <a target="_blank" href="https://wordpress.org/plugins/polylang/">Polylang</a>
* <a target="_blank" href="https://wordpress.org/plugins/loco-translate/">Loco Translate</a>

= Forum and Feature Request =

<blockquote>
<h4>Pro Version</h4>
<ul>
<li><a target="_blank" href="https://getwooplugins.com/plugins/woocommerce-variation-swatches/?utm_source=wordpress.org&utm_medium=README&utm_campaign=woo-variation-swatches">Pro Version</a></li>
</ul>
<ul>
<li><a target="_blank" href="https://getwooplugins.com/documentation/woocommerce-variation-swatches/?utm_source=wordpress.org&utm_medium=README&utm_campaign=woo-variation-swatches">Documentation</a></li>
</ul>
<h4>For Quick Support, feature request and bug reporting</h4>
<ul>
<li><a target="_blank" href="http://bit.ly/getwoopluginsgroup">Join Our Facebook Group</a></li>
</ul>
<h4>For more information</h4>
<ul>
<li><a target="_blank" href="https://getwooplugins.com/?utm_source=wordpress.org&utm_medium=README&utm_campaign=woo-variation-swatches">Visit Our Official Website</a></li>
</ul>
</blockquote>


== Installation ==

### Automatic Install From WordPress Dashboard

1. Login to your the admin panel
2. Navigate to Plugins -> Add New
3. Search **WooCommerce Variation Swatches**
4. Click install and activate respectively.

### Manual Install From WordPress Dashboard

If your server is not connected to the Internet, then you can use this method-

1. Download the plugin by clicking on the red button above. A ZIP file will be downloaded.
2. Login to your site's admin panel and navigate to Plugins -> Add New -> Upload.
3. Click choose file, select the plugin file and click install

### Install Using FTP

If you are unable to use any of the methods due to internet connectivity and file permission issues, then you can use this method-

1. Download the plugin by clicking on the red button above. A ZIP file will be downloaded.
2. Unzip the file.
3. Launch your favorite FTP client. Such as FileZilla, FireFTP, CyberDuck etc. If you are a more advanced user, then you can use SSH too.
4. Upload the folder to `wp-content/plugins/`
5. Log in to your WordPress dashboard.
6. Navigate to Plugins -> Installed
7. Activate the plugin

== Frequently Asked Questions ==

= How can I configure attributes? =

Even this plugin has been installed and activated on your site, variable products will still show dropdowns if you’ve not configured product attributes.

1. Log in to your WordPress dashboard, navigate to the Products menu and click Attributes.
2. Click to attribute name to edit an exists attribute or in the Add New Attribute form you will see the default Type selector.
3. Click to that Type selector to change attribute’s type. Besides default options Select and Text, there are more 3 options Color, Image, Button/Label to choose.
4. Select the suitable type for your attribute and click Save Change/Add attribute
5. Go back to manage attributes screen. Click the cog icon on the right side of attribute to start editing terms.
6. Start adding new terms or editing exists terms. There is will be a new option at the end of form that let you choose the color, upload image or choose as a button for those terms.

= Is it compatible with any kinds of WooCommerce Theme? =

Yes, it's compatible with any WooCommerce theme including OceanWP / Astra / Flatsome / X-Theme / Avada / Uncode / Storefront / Labomba / WR Nitro / Divi / BeTheme. But sometimes it may require small css tweak.

= Does it show in product QuickView? =

Yes, it supports any kinds of product quick view.

= Does it work on MultiSite? =

Yes, it is.

= How to use it on ajax load more? =

If your theme follow wordpress 'post-load' event with `document` then you don't have to do anything.
Here is the details about it: https://codex.wordpress.org/AJAX_in_Plugins#The_post-load_JavaScript_Event

But if you don't then just call this javascript function on ajax load event
```
$('.variations_form').each(function(){
    $(this).wc_variation_form();
});
```
And your are ready to go.

== Screenshots ==

1. Variation Color Swatch Preview
2. Variation Image Swatch Preview
3. Variation Button / Label Swatch Preview
4. Product QuickView Preview
5. Out Of Stock Variation Preview
6. Tooltip Preview
7. Tooltip Setting
8. Attribute Variation Shape
9. Attribute Variation Display Behavior
10. Variation Swatches Size and Font Setting
11. Global Variation Image Swatches Attribute List Preview
12. Global Variation Color Swatches Attribute List Preview

== Changelog ==

= 1.0.53 =

* Fix: IE 11, CSS flexbox issue

= 1.0.52 =

* Add: Yith Product filter support

= 1.0.51 =

* Add: Flatsome theme Infinite Scroll Support
* Fix: Massive Dynamic theme CSS Issue

= 1.0.50 =

* Fix: Archive more click issue.
* Add: Adiva Theme support.

= 1.0.49 =

* Fix: Gecko theme support
* Add: Set default Shape style to Squared Shape

= 1.0.48 =

* Fix: Some speed issue.

= 1.0.47 =

* Add: Filter `disable_wvs_body_class` to disable or enable body class.

= 1.0.46 =

* Add: Filter `disable_wvs_enqueue_scripts` to disable or enable enqueuing scripts.
* Add: Filter `disable_wvs_inline_style` to disable or enable inline style.

= 1.0.45 =

* Fix: WC 3.5 Issue

= 1.0.44 =

* Add: IE-11 Support
* Add: Exporter-Importer

= 1.0.43 =

* Fix: Uncode theme Issue

= 1.0.42 =

* Fix: JS Reload variation.

= 1.0.41 =

* Fix: uShop by themetim CSS Issue

= 1.0.40 =

* Improve: Live Feed

= 1.0.39 and 1.0.39.1 =

* Fix: Elementor Pro CSS Issue

= 1.0.38 =

* Remove: Pro Class from Settings

= 1.0.37 =

* Add: RTL Support
* Fix: The Gem Theme CSS Issue

= 1.0.36 =

* Add: Yith Infinite Scroll support
* Fix: Yoast SEO Focused keyword issue.

= 1.0.35 =

* Add: AURUM theme support
* Fix: WooCommerce Product Bundle conflict.

= 1.0.34 =

* Fix: Known JS Issue

= 1.0.33 =

* Fix: CSS Issue

= 1.0.32 =

* Add: Out of stock product crossed also if "Hide out of stock items from the catalog" unchecked.

= 1.0.31 =

* Add: **Kalium** theme css fix

= 1.0.30 =

* Add: body class uniqueness
* Add: Centralise feed
* Fix: Elementor Pro JS Issue

= 1.0.29 =

* Add: IE-11 fallback
* Add: Increase `variation_threshold` label
* Fix: Divi woo_layout_injector script override

= 1.0.28 =

* Add: Admin Notice CSS

= 1.0.27 =

* Add: SelectBox class for more control
* Add: **StockHolm** Theme Compatibility

= 1.0.26 =

* Improve: Tooltip
* Add: **Enfold** Theme Compatibility

= 1.0.25 =

* Add: `gwp_affiliate_id` Filter for Affiliate link ID in more place.

= 1.0.24 =

* Improve: Frontend Visual Appearance
* Fix: Some known issues

= 1.0.23 =

* Improve: Frontend Visual Appearance
* Add: **Flatsome** Theme shortcode override

= 1.0.22 =

* Add: **OceanWP** Theme Compatibility
* Add: **Sober** Theme Compatibility
* Add: **Shophistic Lite** Theme Compatibility
* Add: **Old Haven** Theme Compatibility

= 1.0.21 =

* Fix: Known JS Issue
* Fix: Tooltip disable item disable issue
* Add: `gwp_affiliate_id` Filter to add affiliate referral link

= 1.0.20 =

* New: Font Size settings
* Improve: Frontend Visual Appearance

= 1.0.19 =

* New: Size settings
* Improve: Visual Appearance

= 1.0.18 =

* Update: CSS
* New: Attribute behaviour

= 1.0.17 =

* Fix: Visual CSS Issue

= 1.0.16 =

* Update: Improve JS Functionality
* Update: Multisite Compatibility

= 1.0.15 =

* New: Attribute deselect option
* Fix: Custom attribute select from product
* Update: translation

= 1.0.14 =

* New: Support Jetpack's Infinite Scroll event, `post-load` event.
* New: `wvs_product_attribute_image_size` filter to change attribute image size
* New: Increased tooltip z-index

= 1.0.13 =

* Fix: Avada theme select issue

= 1.0.12 =

* Fix: Disable publish button issue

= 1.0.11 =

* New: Attribute create from product
* New: Variation Preview color, image
* New: Settings option also added on customizer
* Fix: Any variation issue caused by outofstock variation

= 1.0.10 =

* New: Extendable hooks added to extend
* New: ajax variation threshold option added to control ajax variation.
* Fix: Out Of Stock Product Issue.

= 1.0.9 =

* Fix: Merged Pull request from `spoyntersmith`
* Fix: Tooltip hardware acceleration issue fix for theme animation
* Fix: use jquery `sibling` instead of `prev`

= 1.0.8 =

* Update: Improve variation javascript to support ajax variation
* Update: Renamed tooltip attribute to resolve conflict
* Update: Renamed variation javascript class name

= 1.0.7 =

* Update: Improving frontend CSS
* Update: Disable Bootstrap tooltip conflict

= 1.0.6 =

* Update: translation

= 1.0.5 =

* Fix: backend js issue

= 1.0.4 =

* Fix: Number Select Issue

= 1.0.3 =

* New: Css class on body based on settings
* Update: tooltip and frontend css changed
* New: `add_theme_support( 'woo-variation-swatches', array( 'tooltip' => FALSE, 'stylesheet' => FALSE ) );` for theme developer default setting control.
* New: `wvs_clear_transient` to clear saved transient.

= 1.0.2 =

* New: attribute tooltip
* New: Default stylesheet enable/disable option
* New: Display style added to show Rounded / Squared shaped style

= 1.0.1 =

* Fix: text type select list

= 1.0.0 =

* Initial release

== Upgrade Notice ==
