A second button on full product detail page

Site URL: https://www.pappishop.com/

Hello!

Is there a custom CSS to add another button on the full details product page? On top of our purchase button, we want to add another button on the page but there is no settings to do so. Is there a way to add another button? Hope this makes sense. Thanks!

Add a button above Add to Cart? https://www.pappishop.com/shop-1/p/cross-satin-halter-top

When clicking on button >> it will?

I'd like to add another button above the 'add to cart' button (not a weblink in the description) for the option to purchase the item with crypto.

Click button >> User can purchase item with crypto on current Squarespace site, or redirect to external site?

If current, I'm not sure SS support this. You should contact Squarespace Customer Care

If different, you can add a Button Block in addition info, link to external site, then share link to that product, we can give the code to move it above add to cart

On 3/18/2022 at 3:45 PM, tuanphan said:

Click button >> User can purchase item with crypto on current Squarespace site, or redirect to external site?

If current, I'm not sure SS support this. You should contact Squarespace Customer Care

If different, you can add a Button Block in addition info, link to external site, then share link to that product, we can give the code to move it above add to cart

I need this 🥺
I added a button to the addition info, how do I move it and make it as wide as the "add to cart" button?

https://falcon-lavender-b2h4.squarespace.com/
pw: suport

19 hours ago, Venera said:

I need this 🥺
I added a button to the addition info, how do I move it and make it as wide as the "add to cart" button?

https://falcon-lavender-b2h4.squarespace.com/
pw: suport

Add this code to Last Line in Code Injection > Footer

<script>
$(document).ready(function() { 
		$('section.ProductItem-additional .button-block').insertAfter('.ProductItem-details .sqs-add-to-cart-button-wrapper');
	});
</script>
<style>
  div.sqs-add-to-cart-button-wrapper + .button-block a {
    width: 100%;
    text-align: center;
    overflow: hidden;
}
  div.sqs-add-to-cart-button-wrapper + .button-block div {
    overflow: hidden;
}
</style>

Last Line in Code Injection > Footer 
I'm confused, where is it?

I found it! Thank you very much!

Is it possible to change the design of the button to white with a black outline in order to somehow separate the buttons?
Here is an example

19 hours ago, Venera said:

I found it! Thank you very much!

Is it possible to change the design of the button to white with a black outline in order to somehow separate the buttons?
Here is an example

Add this code under

<style>
  div.sqs-add-to-cart-button-wrapper + .button-block a {
    background-color: white !important;
    color: black !important;
    border: 2px solid black;
    padding: 0 !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}
div.sqs-add-to-cart-button-wrapper + .button-block div {
    overflow: visible !important;
}
div.sqs-add-to-cart-button-wrapper + .button-block a:hover {
    background-color: black !important;
    color: white !important;
}
</style>

46 minutes ago, tuanphan said:

Add this code under

<style>
  div.sqs-add-to-cart-button-wrapper + .button-block a {
    background-color: white !important;
    color: black !important;
    border: 2px solid black;
    padding: 0 !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}
div.sqs-add-to-cart-button-wrapper + .button-block div {
    overflow: visible !important;
}
div.sqs-add-to-cart-button-wrapper + .button-block a:hover {
    background-color: black !important;
    color: white !important;
}
</style>

 

Perfect! Thank you a lot!  🙌

I noticed a little mess in the mobile version. Is it possible to put a button under the "add to cart" button?
 

Add this under

<style>
  @media screen and (max-width:768px) {
  div.sqs-add-to-cart-button-wrapper + .button-block {
    order: 4;
}
  }
</style>

On 5/25/2022 at 4:42 AM, tuanphan said:

Add this under

<style>
  @media screen and (max-width:768px) {
  div.sqs-add-to-cart-button-wrapper + .button-block {
    order: 4;
}
  }
</style>

 

Thank you so much!