How can I move the product price under the variant on my website?

Store Design
1

Hi,

I just want the price of my products to be under the variant (as shown in image) if someone can help please? Or if there is no variant just above the amount wanting…

I’m not sure why it is on the same line as the heading, and now that I have added afterpay code, it is extremely confusing as it is in the same line as the heading and price but before the price.

Added the link if that helps.

https://thefairtraderstore.com.au/collections/planters/products/kubu-rattan-straight-round-baskets

Thanks

Screenshot 2023-07-12 at 1.59.23 pm.png
Screenshot 2023-07-12 at 1.59.23 pm.png2584×784 138 KB

2

Hi @media_by_bec
In this case if you want to move the price to below the Size, You must change the theme code.
but you can try to use this code to move the price to below the Product Title

You can try follow this path:
Themes => edit code => asset => theme.css
and add this code to bottom of the file theme.css

.product-section .product__details .product__headline {
flex-direction: column-reverse;
gap: 10px;
justify-content: flex-start;
}
.product__align-left .product__price {
align-items: flex-start;
}
3

Hello @media_by_bec ,

You can try to follow these steps:

Go to Online Store → Themes → Actions → Edit code

Go to Sections → product-template.liquid file

Modify the code so that the price appears below the variant section like this example


  

  {{ product.price | money }}

# {{ product.title }}

Save and preview

Hope this can help. Let us know if you need any further support.

Transcy