How can I reposition the product price on my Open Studio template?

Store Design
1

Hi everyone,

I have different product templates for most of my products, but the one I’m asking about is the “Open Studio” template. The URL is: https://tipsyhues.com/products/open-studio and I’d like to move the price BELOW the description but ABOVE the variants and add to cart button. Within the editor, the only option is to move the description. I’m trying to move the price.

Thanks in advance!

1 Like
2

Hi @Anonymous ,

You can follow the instruction below:

  1. Go to Online Store->Theme->Edit code
  2. Asset->/styles.css->paste below code at the bottom of the file:
.product__section .product__details {
    display: flex;
    flex-wrap: wrap;
}
.product__section .product__details .product__title {
    order: -3;
}
.product__section .product__details .product__description {
    order: -2;
}
.product__section .product__details .product__price {
    order: -1;
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

3

@AvadaCommerce won’t this apply to all products? I need it to apply to one specific template only.

4

Hi @Anonymous ,

My code above will change for all product. If you want to edit only on product studio template, you can try below code in styles.css file:

#shopify-section-product-open-studio-template .product__section .product__details {
    display: flex;
    flex-wrap: wrap;
}
#shopify-section-product-open-studio-template .product__section .product__details .product__title {
    order: -3;
}
#shopify-section-product-open-studio-template .product__section .product__details .product__description {
    order: -2;
}
#shopify-section-product-open-studio-template .product__section .product__details .product__price {
    order: -1;
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

1 Like
5

@AvadaCommerce That worked, thank you so much!

1 Like