Hi Don,
Thanks for reaching out to us. Unfortunately, it is difficult to understand the issue without a screenshot and a product page link.
Can you please share a screenshot and a product link here?
You can upload your screenshot here: https://prnt.sc/ and post the screenshot link on this thread.
Thank You
Hello, please see the below screenshot, I would like to have the attributes ‘Premium’ ‘Deluxe’ ‘Standard’ stretched to 100% and have one attribute per row. Screenshot is from mobile both desktop version is same.
Hi Don,
Can you please share a produce page link?
It will help me to inspect it from my end.
Hope to hear from you soon.
Thank You
Hi Don,
Please add the following CSS at Appearance > Customize > Additional CSS
.single.woo-variation-swatches .wvs-style-squared.variable-items-wrapper .variable-item:not(.radio-variable-item).button-variable-item {
width: 100%;
}
Then flush all the caches and check whether it resolves your issue or not.
Hope to hear from you soon.
Thank You
Also If I need to center the attributes on desktop and mobile version, what additional css can be added? and this should only affect the three attributes as shown on the screenshot.
the css code provided, stretched all three attributes however the last one ‘Standard’ is slightly wider.
also I need to remove the attributes so they’re not shown on shop/archive page, see screenshot below
also is there a css code you can help in order to remove the prices shown as the screenshot below.
Hi Don,
the css code provided, stretched all three attributes however the last one ‘Standard’ is slightly wider.
Please add the following:
.single.woo-variation-swatches .wvs-style-squared.variable-items-wrapper .variable-item:not(.radio-variable-item):last-child{
margin-right: 4px;
}
also I need to remove the attributes so they’re not shown on shop/archive page, see screenshot below
Please disable this option: https://snipboard.io/fkLKZs.jpg to hide the swatches on the shop/archive page.
also is there a css code you can help in order to remove the prices shown as the screenshot below.
It is not recommended. But you can add the following:
.summary-inner>.price {
display: none;
}
.woocommerce-variation-price {
display: none;
}
Please let me know whether it fits your needs or not. If it fits, my humble request to you to write your valuable review here: https://wordpress.org/support/plugin/woo-variation-swatches/reviews/?filter=5
Your rating keeps us inspired.
Hope to hear from you soon.
Thank You
Hello Hakik, everything has been working as provided by yourself and I am humbled by the amount of excellent support and assistance provided by yourself and team, I would like to request one last assistance,
what css code can be used to have the quantity screenshot below so it has either +- or up/down ticker so quantity can be changed instead of typing as currently set. see screenshot below
Hi Don,
what css code can be used to have the quantity screenshot below so it has either +- or up/down ticker so quantity can be changed instead of typing as currently set. see screenshot below
Unfortunately, it is not possible to achieve it using only CSS. You have to override the whole template to achieve that.
You may try this plugin: https://wordpress.org/plugins/wc-quantity-plus-minus-button/
By the way, I will wait for your valuable review here: https://wordpress.org/support/plugin/woo-variation-swatches/reviews/?filter=5
Thank You
is it possible for you to inspect that quantity area and see if possible to even add the up/down ticker to increase/decrease the quantity?
Hi Don,
is it possible for you to inspect that quantity area and see if possible to even add the up/down ticker to increase/decrease the quantity?
Unfortunately, it is not only dependent on CSS. The request is beyond our support scope.
I hope you will understand.
Thank You
Stretched Attributes
Don Ami
Hello, I am attempting to put one attributes per row, and also have the width stretched. I am using the ‘Large Size Attribute’ section however the width is not changing based on the width input.