The Products by Attributes & Variations plugin gives you two ways to showing variations on listing pages: 1) displaying product variations as simple products, or 2) displaying product attributes on listing pages. Improve your user experience by allowing customers to find relevant variations from shop pages and add products to their cart without having to visit the product detail page.
<img class="aligncenter wp-image-18734005635358 size-full" src="https://addify.store/adv-banners/addify-store.gif" alt="" width="900" height="141" />
<h2>1.  Show variations as single products:</h2>
This feature empowers you to show variations as simple products on shop, category, and other listing pages. Customers can find relevant product variations from listing pages and add products directly to their cart, and the variations are compatible with product filters and search. This makes your catalog look bigger and improves the user experience.
<img class="alignnone size-full" src="https://woocommerce.com/wp-content/uploads/2019/10/WooCommerce-Show-Single-Variations-.png" width="958" height="1178" />
<h3>Key settings</h3>
<ul>
<li>Display variations of all or specific items as simple products</li>
<li>Exclude any variations from showing as simple product</li>
<li>Option to hide the main product from listing pages</li>
</ul>
<img class="alignnone size-full wp-image-5822577" src="https://woocommerce.com/wp-content/uploads/2019/10/WooCommerce-Show-Single-Variations-Setting-page.png" alt="" width="925" height="898" />
Exclude specific variation & customize sorting order
From Product Edit > Variations, you can exclude individual variations from displaying them as simple products on listing pages. You can also give a custom menu sorting order for each variation.
<img class="alignnone size-full wp-image-5710915" src="https://woocommerce.com/wp-content/uploads/2019/10/Variations-Settings-2.png" alt="" width="958" height="1212" />
Exclude entire attribute:
You can exclude any attribute and display products by only one attribute. For example, if you have color and size as attributes, you can exclude size and display products by color only. You can exclude this from the product edit sheet on the backend.
<img class="alignnone size-full wp-image-7957711" src="https://woocommerce.com/wp-content/uploads/2019/10/Exclude-Attribute.png" alt="" width="960" height="512" />
<hr />
<h2>2.  Display attribute selections on listing pages</h2>
This lets you add product attributes to listing pages so customers can select their desired variations and add products to their carts from a listing page. This makes shopping easier — customers will no longer need to visit individual product pages to make selections.
The attributes are displayed in the same format as on the product detail page. For example, if you are using color swatches or a third party plugin to show size options in a dropdown menu and are showing color options with checkboxes, the same dropdown and checkboxes will be displayed on listing pages
You can also utilize the toggle mode option to keep your products listing compact. Customers can click on the show/hide button to see the variations.
<img class="alignnone size-full wp-image-5710916" src="https://woocommerce.com/wp-content/uploads/2019/10/Variations-Dropdown-2.png" alt="" width="980" height="1168" />
<h3>Key settings</h3>
<ul>
<li>Display attributes of all or selected products</li>
<li>Option to display quantity box</li>
<li>Toggle mode option to keep the listings compact</li>
</ul>
<img class="alignnone size-full wp-image-5000645" src="https://woocommerce.com/wp-content/uploads/2019/10/woocommerce-Show-variations-on-shop-page-.jpg" alt="woocommerce Show variations on shop page" width="954" height="939" />
<h3>FAQs:</h3>
Can I use both features at the time?
Yes, you can convert your variations into products, and at the same time show attribute selections under the parent product.
Can I change variation product titles?
Yes, you can customize the title for each product by variation.
Is it compatible with product filter and layered navigation?
Yes, both features are 100% compatible with default sortings, product filters, and layered navigation.

Products By Attributes & Variations

This plugin enables you to 1) display product attributes on listing pages for easy selection and 2) display variations as simple products.

Qode

QODE Variation Swatches for WooCommerce provides you with a clear-cut way to present all your shoppers with detailed product variations alongside your products on shop single pages.
This lets you reduce the user interaction cost as well as product viewing & comparison times, as you can feature a number of easily adjustable attributes for your products and more.
<a href="https://qodeinteractive.com/qode-variation-swatches-for-woocommerce/" rel="nofollow ugc">Check out the QODE Variation Swatches Demo</a> 
<a href="https://qodeinteractive.com/qode-variation-swatches-for-woocommerce/documentation/" rel="nofollow ugc">Check out the QODE Variation Swatches documentation</a>
<h3>Basic Features:</h3>
<ul>
<li>Create Color attributes</li>
<li>Create Image attributes</li>
<li>Create Label attributes</li>
<li>Adjustable variation styles</li>
<li>Custom variation width</li>
<li>Custom variation height</li>
<li>Custom variation border color</li>
<li>Custom size for the space between swatches</li>
</ul>
<h3>Get Even More with Premium:</h3>
<ul>
<li>Dual swatches for two-color samples</li>
<li>Custom color codes for selected attributes</li>
<li>Create Radio attributes</li>
<li>Create Tab Switch attributes</li>
<li>Adjustable Image, Color & Label attribute layouts</li>
<li>Individual width, height & border color attribute settings</li>
<li>Additional selected attribute text</li>
<li>Additional Info option for specific attributes</li>
<li>Customizable attribute term badges</li>
<li>Show or hide specific attributes</li>
<li>Adjustable tooltips for attribute terms</li>
<li>Modifiable disabled attribute styles</li>
<li>Predefined variation styles</li>
<li>Generation of links for every variation</li>
<li>Choose to show or omit attributes on product pages</li>
<li>Max numbers of visible attribute terms in lists</li>
<li>AJAX-powered variation data loading on shop pages</li>
<li>Customizable “Add to Cart” button</li>
<li>Product availability info</li>
<li>Show single variations in loops</li>
<li>Hide parent products in loops</li>
<li>Create new attribute terms</li>
<li>Different image galleries for each variation</li>
</ul>
<h3>Showcase Product Variations in Great Detail Using QODE Variation Swatches</h3>
Enhance the eCommerce experience for all your visitors by featuring product variations next to your products with the help of flexible, option-rich QODE Variation Swatches for WooCommerce plugin.
You can include color, image, and label attribute swatches. The appearance of each attribute swatch can be modified thanks to a selection of stylization options that the plugin provides.
Best of all, each variation gets displayed on the fly once it is clicked on, providing the potential customer with a quick, streamlined way to view and compare different versions of a product they are viewing on a shop single page, thus eliminating the need to navigate to a different page on your website in the process.
The plugin is fully optimized for presenting your product variations to mobile users too.
<h3>Customize the Appearance of your Swatches and Attributes</h3>
The appearance of each attribute can be customized using a clearly outlined set of options included with the QODE Variation Swatches for WooCommerce plugin.
You can easily configure width, height, and idle/active border colors for each of the attributes.
<h3> Documentation & Support </h3>
<ul>
<li>Check out our step-by-step <a href="https://qodeinteractive.com/qode-variation-swatches-for-woocommerce/documentation/" rel="nofollow ugc">user guide</a> on how to install and use QODE Variation Swatches for WooCommerce.</li>
<li>You can also submit a topic to the <a href="https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/" rel="ugc">support forum</a> at and our support team will be glad to help you out.</li>
</ul>
<h3>Privacy Policy</h3>
We use our services
Qode’s CDN – The domain https://export.qodethemes.com is a service from which we retrieve the list of all Qode plugins displayed in the admin dashboard. 
Qode’s API – The domain https://api.qodeinteractive.com is an API that’s called when a user deactivates the plugin, to retrieve the reason for deactivation. Upon deactivating the plugin, the users are prompted for a reason for doing so. They also have the option to deactivate without providing a reply. The data obtained from the users who respond to the question is collected to improve the plugin. After the analysis of said data, the plugin is upgraded and enhanced in such a way as to fulfill the users’ expectations. 
Qode’s Terms of Use – https://qodeinteractive.com/terms-of-use/ 
Qode’s Privacy Policy – https://qodeinteractive.com/privacy-policy/
<h4>Looking for more?</h4>
Feel free to try out some of our other products:
<a href="https://wordpress.org/themes/qi/" rel="ugc">Qi Theme</a> 
<a href="https://wordpress.org/plugins/qi-addons-for-elementor/" rel="ugc">Qi Addons for Elementor</a> 
<a href="https://wordpress.org/plugins/qi-blocks/" rel="ugc">Qi Blocks for Gutenberg</a> 
<a href="https://wordpress.org/plugins/qode-wishlist-for-woocommerce/" rel="ugc">QODE Wishlist for WooCommerce</a> 
<a href="https://wordpress.org/plugins/qode-quick-view-for-woocommerce/" rel="ugc">QODE Quick View for WooCommerce</a> 
<a href="https://wordpress.org/plugins/qode-compare-for-woocommerce/" rel="ugc">QODE Compare for WooCommerce</a> 
<a href="https://wordpress.org/plugins/qode-product-extra-options-for-woocommerce/" rel="ugc">QODE Product Extra Options for WooCommerce</a> 
<a href="https://wordpress.org/plugins/qode-product-bundles-for-woocommerce/" rel="ugc">QODE Product Bundles for WooCommerce</a> 
<a href="https://wordpress.org/plugins/qode-optimizer/" rel="ugc">QODE Optimizer</a>

QODE Variation Swatches for WooCommerce

QODE Variation Swatches for WooCommerce provides you with a clear-cut way to present shoppers with detailed item variations alongside your products.

Products By Attributes & Variations vs QODE Variation Swatches for WooCommerce