fbpx
Want To Add Extra Images Per Product Variation For Free? Download Now

Issues with shape and sold out items after update

Manuel Maier

Hi there,

we recently updated the “Variation Swatches for WooCommerce” and the “Variation Swatches for WooCommerce PRO” plugin and since then we have had two issues in the online shop:

  • even if we choose the settings of a rounded shape the color icon is shown in an oval shape
  • even if we choose the settings to blur “sold out items” with a cross they are shown the same way as the available ones.

Could you please help me here? We are using the KONA theme (from SpabRice) with the WooCommerce and GermanMarket plugins. Thank you already for your help in advance.

Best, Mira

Hakik Zaman

Hi Manuel,

Thanks for reaching out to us. We are sorry for your inconvenience.

Can you please give us an exact product link to check?

BTW, the Kona theme overrides our plugin CSS for their theme. So, there is a high chance that the issue is coming from Kona.

Thank You

Hakik Zaman

Hi Manuel,

Thanks for the product link. I have disabled our stylesheet (from here- https://prnt.sc/PAFz6LlZgcUG) so that the Kona Theme stylesheet can be applied properly.

Then enable this option- https://prnt.sc/1F7phhDwvpGB to get the blur-out option to work.

Please check now and don’t forget to clear your caches like- Browser Cache, Caching Plugin Cache, and Server-Side Cache before checking.

Hope to hear from you soon!

Thank You

Manuel Maier

Hi Hakik,

thank you so much for the fast reply and help. It works on the product detail page, but somehow the color icons on the product category are not shown anymore. Instead here are black dots shown now.

https://viererspitz.de/products/herren/hemden/

Can you please let me know what to do now?

 

Manuel Maier

Oh it works again. So thank you so much for your help!
Have a great day!

Hakik Zaman

Hi Manuel,

As I said, Kona Theme overrides our CSS. So, I have enabled our stylesheet again and added the below CSS at Appearance > Customize > Additional CSS

.product .cart .variations .variation .variable-items-wrapper li .variable-item-span {
   width: 26px;
   height: 26px;
   padding: 0;
   line-height: 26px;
}
.product .cart .variations .variation .variable-items-wrapper li {
   width: var(--wvs-single-product-item-width,30px);
   height: var(--wvs-single-product-item-height,30px);
}

Please check now both the shop and single product pages and let me know whether it resolves your issue or not.

Note: Don’t forget to clear your caches like- Browser Cache, Caching Plugin Cache, and Server-Side Cache before checking.

Hope to hear from you soon!

Thank You