A user working with the Studio Theme is trying to modify variant pills to display as text-only instead of the default styled buttons. They’ve created custom pages for different product categories with varying prices for materials, and want the variant selector to appear as plain text within each category.
Proposed Solution:
A PageFly representative suggested adding CSS code to customize the appearance:
border: unset !important;Status: The solution involves CSS customization but appears incomplete in the thread. The approach focuses on styling the variant selector elements, though a complete text-only implementation may require additional code modifications beyond just removing borders.
I have watched numerous videos and checked in the community and tried a lot of different options but none have achieved this goal.
I am using the the Studio Theme and have created custom pages for each of my product categories. I have different prices for materials in each category and would the variant pill to appear as just text.
link to one of my products that I am currently working on,
https://thunderstrucklasercreations.com/products/drink-coasters
This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
Online Store ->Theme ->Edit code
Assets ->Base.css
.product-form__input input[type=radio]+label {
border: unset !important;
}
Hope you find my answer helpful!
Best regards,
Richard | PageFly