plugin not displaying color variations on home page

Hi Julio,

Thanks for reaching out to us. How do you bring the products to the homepage?

From my inspection, you are using Essential Addons to display the product grid on the homepage.

Unfortunately, they didn’t keep any WooCommerce hook to push the swatches. So, you have to override their template file. To override the template file, please carefully follow the below steps:

=> [Recommendation] We are assuming you are using a child theme. If you are using a parent theme, this custom work will be erased once you update your theme.

=> Create a folder ‘Template‘ inside your current theme. Inside the ‘Template’ folder create another folder called Woo-Product-Gallery

=> Then add this file: https://gist.github.com/hakikz/cf6ba10032dad5008f2f38cf332a129d to the Woo-Product-Gallery folder.

=> The file name should be default.php

Then check again. Before checking, don’t forget to clear the caches like- browser cache, caching plugin cache, and server-side cache.

Hope to hear from you soon.

Thank You

Hi Julio,

I have added the product wrapper as per your theme markup here: https://i2.paste.pics/NAV7O.png

Please check now and don’t forget to clear your caches before checking.

Hope to hear from you soon.

Thank You

Hi Julio,

The Essential Addons plugin is overwriting our CSS: https://prnt.sc/4Ne9d5z6nB6E

Please add the following CSS at Appearance > Customize > Additional CSS:

.woo-variation-swatches .variable-items-wrapper .variable-item img {
height: 100% !important;
}

Then check whether it behaves as it should or not.

Thank You

Hi Julio,

As I said before, they didn’t keep any standard WooCommerce hook to push the swatches.

You can try this setting for Product Grid: https://paste.pics/NNGCX to get swatches.

Thank You