Removing one of the variants on product's page

Store Design

Topic summary

A store owner wants to modify the variant picker display on their product page. They have two variants (age and another option) and want to either:

  1. Remove only the age variant picker label while keeping the age selection functional
  2. Alternatively, center the age variant picker if removal isn’t possible

A solution was provided using custom CSS code to be added to the theme.liquid file after the <head> tag. The code:

  • Hides the legend/label for the specific variant using display: none
  • Centers the variant picker and adds top padding
  • Targets the element using a specific data attribute (data-option-value-id="5305131204761")

The discussion appears resolved with a working CSS solution, though no confirmation from the original poster yet.

Summarized with AI on October 24. AI used: claude-sonnet-4-5-20250929.
1

image
image545×716 43.5 KB

i want to remove just the age variant picker. but keeping the age one
how can i do that?
and if i cant, how can i put the age variant picker in the middle?
thank you in advance

store link : officialbresh . com
pass: hugegyat

2

Please add this code to theme.liquid file, after <head>

<style>
.product-form__input:has([data-option-value-id="5305131204761"]) legend { display: none; }
.product-form__input:has([data-option-value-id="5305131204761"]) { text-align: center; padding-top: 12px; }
</style>