Motion theme product page variant label change - urgent

Store Design
, , , ,
1

I’m using the Motion theme in that I want to change the variant label in product page. I want to make the label from size to select size. How can I do that.

website: https://www.taramajeans.com/

image
image326×456 15.6 KB

2

Usually, this label is generated from the Option name. So if you change your option name in backend to “Select Size”, this will be reflected in front-end the way you want.

Alternatively, you can do it with CSS.
If you already modified theme code, you can add this to the very end of your assets/base.css stylesheet:

/* prepend "Select" to option label for Size option */
.variant-wrapper:has([name=Size]) > label:before {
  content: "Select";
}

Or, you can go to “Customize”, navigate to product page and add a “Custom liquid” (or “Custom code”?) section below your product info section. Paste the same code, but wrapped with </style>..</style>.

<style>
/* prepend "Select" to option label for Size option */
.variant-wrapper:has([name=Size]) > label:before {
  content: "Select";
}
</style>

Unfortunately, Shopify does not allow content in “Custom CSS” settings, so need to do it this way.

3

@Sivadarshan ,
It seems you’ve followed the instructions provided by tim_1 correctly.
The simplest solution here is just to add a style with content: “Select”.