Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Add price range below product title


DreamrW

Question

10 answers to this question

Recommended Posts

  • 0
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

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0

My testing result

image.thumb.png.c8978c5b7fe21839128a8a47b612f08f.png

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
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! 

Link to comment
  • 0
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;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0

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?! 

Link to comment
  • 0
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?

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
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>

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...