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

Issue with Swatch Text Visibility for Sizes (e.g., 12mm or XXS)

Hello,

I’m encountering an issue with the swatches in your plugin. When the size includes multiple digits and/or letters (e.g., 12mm or XXS), part of the text is not fully visible within the swatches. While I can adjust the size of the swatches, this does not resolve the issue, as the text still appears cut off and doesn’t fit properly within the swatch.

Could you please assist me in resolving this issue? Any suggestions on how to make the entire text visible within the swatches would be greatly appreciated.

Thank you!

Hakik Zaman

Hi Nikita,

Thanks for getting back to us.

It is better to use the Square shape for the swatches while you have a long text.

Or,

You can add the following CSS at Appearance > Customize > Additional CSS

.woo-variation-swatches .wvs-style-rounded.variable-items-wrapper .variable-item:not(.radio-variable-item).button-variable-item {
width: auto;
border-radius: 10px;
}
.woo-variation-swatches .wvs-style-rounded.variable-items-wrapper .variable-item:not(.radio-variable-item).button-variable-item .variable-item-span{
overflow: visible;
}

Please let me know whether it helps or not.

Hope to hear from you soon.

Thank You

Hi,

Thank you for providing the two solutions. Both work well. I prefer the square shape over the CSS code.

Thank you for your quick response!

Best regards, Nikita