Add price range below product title

Site URL: https://point-manatee-dntb.squarespace.com/shop/p/leatherette-coffee-table-book

I've already used a piece of code from this forum to move the price to sit above the Add To Cart button. 

Is it possible to include the price range below the product title also?

password: Albums2021

On 12/8/2021 at 11:14 PM, DreamrW said:

Site URL: https://point-manatee-dntb.squarespace.com/shop/p/leatherette-coffee-table-book

I've already used a piece of code from this forum to move the price to sit above the Add To Cart button. 

Is it possible to include the price range below the product title also?

password: Albums2021

 

Try adding to Home > Design > Custom Css

.product-variants {
  order: 3 !important;
}
.product-quantity-input {
  order: 2 !important;   
}

Let me know how it works on your site

Press 👍 or mark this answer as solution to help another one too

My testing result

Thanks BaNgan, I got the same result however that wasn't quite what I desired. 

I was hoping to have the price sit under the product title (above the product description) AND above the Add To Cart button, where it currently sits. 

Is this possible? 

I'm also wondering if it's possible to remove the Quantity field so that Add To Cart automatically counts as one unit? 

2 minutes ago, DreamrW said:

Thanks BaNgan, I got the same result however that wasn't quite what I desired. 

I was hoping to have the price sit under the product title (above the product description) AND above the Add To Cart button, where it currently sits. 

Is this possible? 

I would insert it into the Product Title however that might cause problems down the line when discounts apply! 

On 12/14/2021 at 8:10 PM, DreamrW said:

I'm also wondering if it's possible to remove the Quantity field so that Add To Cart automatically counts as one unit? 

To remove quantity/add to cart for above product >> Edit Product >> Edit Additional Info >> Add a Code Block >> paste this code

<style>
  .sqs-add-to-cart-button-wrapper {
    display: none !important;
}
  div.product-quantity-input {
    display: none !important;
}
</style>

To move price under title, add this to Design > Custom CSS

.ProductItem-product-price {
    order: 1 !important;
}

.product-variants {
    order: 2 !important;
}

.ProductItem-details-excerpt {
    order: 3 !important;
}

Thanks for this but it's not quite what I was trying to do. 

I want to keep the Add to Cart button, but remove the quantity field - my customers are unlikely to be purchasing multiple quantities so there's no need for this option. 

I also want the price point to feature in two places; below the product title AND above the Add to Cart button. 

Perhaps neither of these options are possible?! 

On 12/20/2021 at 11:02 PM, DreamrW said:

Thanks for this but it's not quite what I was trying to do. 

I want to keep the Add to Cart button, but remove the quantity field - my customers are unlikely to be purchasing multiple quantities so there's no need for this option. 

I also want the price point to feature in two places; below the product title AND above the Add to Cart button. 

Perhaps neither of these options are possible?! 

#1. To hide quantity field on one product >> Edit Product > Additional Info >> Add a Code Block >> Paste this code

<style>
  div.product-quantity-input {
    display: none !important;
}
</style>

#2. Do this for specific product or all products?

This is superb! I don't have many products so was able to apply to all - thanks so much! 

On 1/7/2022 at 3:18 AM, DreamrW said:

This is superb! I don't have many products so was able to apply to all - thanks so much! 

Add to Settings > Advanced > Code Injection > Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
  jQuery(document).ready(function($){
  $('.ProductItem-product-price').clone().appendTo('h1.ProductItem-details-title');
})
</script>
<style>
  .product-price {
    margin-bottom: 0px !important;
}
.ProductItem-product-price {
    margin-bottom: 0px !important;
}
</style>