wpforce

It should not happen.

Try deactivating all your plugins except WooCommrece and Variation Swatches. Then re-activating them in various combinations until you isolate which one(s) caused the issue.

Can you use a tool like loom.com to record your issue?

It will help to understand your issue clearly.

Please share some screenshots, it will help others to understand your issue clearly.

As far as I know, it is not a feature of the Additional Variation Images Gallery.

It is a feature of Variation Swatches but with the advanced version of Variation Swatches, you can achieve it.

It should work. Try the below:

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).color-variable-item.selected:not(.no-stock) .variable-item-contents:before{
    background-image: none;
}

Still not working? clear your cache like browser cache, caching plugin cache, and server-side cache.

If still not working try the below:

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).color-variable-item.selected:not(.no-stock) .variable-item-contents:before{
    background-image: none !important;
}

Then clear your cache. If still no luck, it is difficult to answer without accessing your site.

Can you use a tool like- https://loom.com
and
record your issue and post the record link here?

So that, everyone can understand your issue clearly.

Hi,

Please try the below CSS

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).image-variable-item.selected:not(.no-stock) .variable-item-contents:before {
    background-image: none;
}

Then let me know if it works or not.

Glad to know it helps.

We should inspire the plugin author by giving them some good words.

You can share some good words here.

@cometto

Replace the above CSS with the below CSS-

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item) {
    margin: 4px 8px 4px 0;
}

Then check if it works or not.

Hi @cometto

Please place the below css at Appearance > Customize > Additional CSS

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item):first-child {
    margin-left: 4px;
}
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item):last-child {
    margin-right: 4px;
}

Can you please share your product page link?

@ismartpink

This plugin stopped working entirely after 2.0 update.

Can you please explain a bit more? What issues you are facing? A screenshot or a screen record will help to understand your issue.

@visualdigitaluk

Do a plugin compatibility check by doing these steps to identify the error :

=> Deactivate all of your additional plugins except WooCommerce and WooCommerce Variation Swatches Plugin.

=> See if the problem persists. If the problem is resolved, you can understand which plugin might be the culprit of this error by activating your additional plugins one by one.

Place the below CSS at Appearance > Customize > Additional CSS

table tbody tr:nth-child(2n) {
    background-color: transparent!important;
}

table tbody, table tfoot, table thead {
    background-color: transparent;
}

I hope it will resolve your issue.

As far as I know, Variation Swatches doesn’t apply any background color to the section you mentioned.

It would be great if you can live your site and give me a product link.

Then I can use inspect tools by visiting your product link.

It is difficult to help without visiting your site or an exact product link.