Shopify themes, liquid, logos, and UX
Hi,
I wanted to change the title of the swatches. At the minute its "colour" but I wanted to change it to "metal" but when I change it to "metal" via the variants on the products page, the swatches of the images changes to written, which I don't want. I want the title to be "Metal" but with the image swatches.
Here's a screenshot of what i mean:
Solved! Go to the solution
This is an accepted solution.
Hi @Ess91 ,
This is Victor from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1. Go to Online Store -> Theme -> Edit code
Step 2. Open your theme.liquid theme file
Step 3. Paste below code before </body> :
<style>
p.swatches__option-name.h5 > strong {
font-size: 0px;
}
p.swatches__option-name.h5 > strong:before {
content: 'Metal:';
font-size: 16px
}
</style>
Hope my answer will help you.
Best regards,
Victor | PageFly
Hi @Ess91 ,
Could you please share URL and your store password if it enabled? So that we can help you.
Thank you.
This is an accepted solution.
Hi @Ess91 ,
This is Victor from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1. Go to Online Store -> Theme -> Edit code
Step 2. Open your theme.liquid theme file
Step 3. Paste below code before </body> :
<style>
p.swatches__option-name.h5 > strong {
font-size: 0px;
}
p.swatches__option-name.h5 > strong:before {
content: 'Metal:';
font-size: 16px
}
</style>
Hope my answer will help you.
Best regards,
Victor | PageFly
That worked perfectly!
Thank you so much.
Hi, sorry.
Just wanted to ask. Is there anyway of targeting just the first variant and not the others being affected. As the change in title for just the first variant has also affected the second variant. I just want the first variant to have the "metal" and the second variant to have "size".
This code not working ,please provide the correct code.
i want here only ,when click color swatch then change the title of the product.
this is booster theme.
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025