We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

Shopify variant with price on product page (Variant Pills)

Shopify variant with price on product page (Variant Pills)

JohnWalter
Shopify Partner
3 0 0

Hello,

 

I'm selling products with variants based on 'size' and 'Quantity' attributes, each with a unique price. I want to display the price of each variant ( on product page) within its respective label (or in a new span element next to it), regardless of whether it's selected or not. Can you provide the specific code snippets required to implement this?

I would appreciate any help and am willing to compensate.

 

Note: Dawn theme 

My current Structure

 

 

JohnWalter_0-1731515685019.png

 

 

The structure I want is shown below. Similar to the example, when selecting options, the variant prices should update in their box or in a new span tag nearby. With a small CSS adjustment, it should be easy to hide the initial prices for the 'Size' variants.

 

Since there is a dynamic relationship between the 'Size' and 'Quantity' variants, prices should update whenever these options are selected.

 

JohnWalter_1-1731515713516.png

 

 

Thanks

Reply 1 (1)
JohnWalter
Shopify Partner
3 0 0

so. what can we do about this?