Is there a link/url for an 'Add to cart' action of a product in Squarespace?

Hey peeps!

I hope I can explain this the easiest as I'm unable to find this answer anywhere online.

Let's say I add a simple text block and type "product 01". And then I wanted to hyperlink that "product 01" that once clicked, it would perform an add to cart action on a specific product I have in my store. Is that possible?

So in other words, is there a URL that adds a product of yours to the shopping cart or is that ONLY possible by using the product 'add to cart' button?

I deeply appreciate your help!

On 1/13/2022 at 11:09 PM, romerodan said:

Hey peeps!

 

I hope I can explain this the easiest as I'm unable to find this answer anywhere online.

 

Let's say I add a simple text block and type "product 01". And then I wanted to hyperlink that "product 01" that once clicked, it would perform an add to cart action on a specific product I have in my store. Is that possible?

 

So in other words, is there a URL that adds a product of yours to the shopping cart or is that ONLY possible by using the product 'add to cart' button?

 

I deeply appreciate your help!

You can try adding to the link to this text with href="/cart"

SS does not expose an interface for adding products to a cart via a URL.

However it may be possible to use a code block with code similar to the following and then modify it with CSS to look more like a link.

<div class="sqs-add-to-cart-button-wrapper" data-animation-role="button" style="visibility: visible;">

  <div class="sqs-add-to-cart-button sqs-suppress-edit-mode" data-collection-id="[enter collection id here between double quotes]" data-item-id="[enter data item id here between double quotes]" role="button" tabindex="0" data-product-type="1" data-use-custom-label="false" data-original-label="Add To Cart">
  
    <div class="sqs-add-to-cart-button-inner">
    
      Add To Cart
      
      </div>
      
    </div>
    
  </div>

This code requires knowing the collection and product ids.

Original button.

After some minimal styling to show that is may be possible to make the button look like a link.

There is a caveat this technique will only work with products that don't have variants.

On 1/15/2022 at 6:13 PM, creedon said:

SS does not expose an interface for adding products to a cart via a URL.

However it may be possible to use a code block with code similar to the following and then modify it with CSS to look more like a link.

<div class="sqs-add-to-cart-button-wrapper" data-animation-role="button" style="visibility: visible;">

  <div class="sqs-add-to-cart-button sqs-suppress-edit-mode" data-collection-id="[enter collection id here between double quotes]" data-item-id="[enter data item id here between double quotes]" role="button" tabindex="0" data-product-type="1" data-use-custom-label="false" data-original-label="Add To Cart">
  
    <div class="sqs-add-to-cart-button-inner">
    
      Add To Cart
      
      </div>
      
    </div>
    
  </div>

This code requires knowing the collection and product ids.

Original button.

After some minimal styling to show that is may be possible to make the button look like a link.

There is a caveat this technique will only work with products that don't have variants.

What code / injection is needed to have this become a waitlist form when out of stock?

2 hours ago, adamfriedman21 said:

What code / injection is needed to have this become a waitlist form when out of stock?

I know of no way to use that code to do what you want.

However you don't need code to have a waitlist. SS has a built-in feature for what you want to do.

25 minutes ago, creedon said:

I know of no way to use that code to do what you want.

However you don't need code to have a waitlist. SS has a built-in feature for what you want to do.

Yes, it is set, however when I added the custom add to cart button (via code block per your instruction), the waitlist doesn't appear.

waitlist enabled product : https://www.shufflehouse.co/shop/p/4-week-program

custom product page (in progress) with add to cart button added via code block (ID and collection linked to above waitlist enabled product per your instruction) : https://www.shufflehouse.co/1-on-1

As you can see, the waitlist doesn't appear when adding the add to cart via code block. Any ideas? 

31 minutes ago, adamfriedman21 said:

As you can see, the waitlist doesn't appear when adding the add to cart via code block. Any ideas?

It appears that the waitlist option only appears in the product detail page.

I just tried a product block and those don't show a waitlist option.

I have no other options off the top of my head.

1 minute ago, creedon said:

It appears that the waitlist option only appears in the product detail page.

I just tried a product block and those don't show a waitlist option.

I have no other options off the top of my head.

I appreciate your time, no worries! 

On 1/15/2022 at 6:13 PM, creedon said:

SS does not expose an interface for adding products to a cart via a URL.

However it may be possible to use a code block with code similar to the following and then modify it with CSS to look more like a link.

<div class="sqs-add-to-cart-button-wrapper" data-animation-role="button" style="visibility: visible;">

  <div class="sqs-add-to-cart-button sqs-suppress-edit-mode" data-collection-id="[enter collection id here between double quotes]" data-item-id="[enter data item id here between double quotes]" role="button" tabindex="0" data-product-type="1" data-use-custom-label="false" data-original-label="Add To Cart">
  
    <div class="sqs-add-to-cart-button-inner">
    
      Add To Cart
      
      </div>
      
    </div>
    
  </div>

This code requires knowing the collection and product ids.

Original button.

After some minimal styling to show that is may be possible to make the button look like a link.

There is a caveat this technique will only work with products that don't have variants.

Hey, this doesn't work with Express Checkout. It still shows the automatic "Purchase" button. I have changed my "Custom Button Label" as well, still doesn't work. Any ideas?