Alexandherpixels

15 hours ago, Beyondspace said:

I see, the detail order also did not available on my end too. 

Also this part won't work because it trying to query the promo code on checkout page

So we can use Cloudflare as external service to query Squarespace orders and using OrderId (this is incorrect name, the value in Order confirmation page is OrderNumber)

- Squarespace Orders API help you retrieve Squarespace order programatically

- In order to user it on 3rd party you will need an API key. Note that you will need Commerce Advanced or higher to use the Orders API

In Cloudflare workers when you create a worker it will be available as an endpoint, for example https://api.squarespace-order.workers.dev/, once user lands on Order confirmation page you will make a request to that endpoint with the OrderId value

Next step is tricky part, since Orders API can return a specific Order based on its ID, but it is not the same with OrderId on Confirmation page which actually is OrderNumber!

So you got to use the All Orders api to get all order in specific time and filter based on the given OrderNumber and return the matched order, which will contain the Discount code line

Thank you for this detailed reply. I'm not sure I can code a solution, but I'll forward this on to our developer! I've also sent you a PM 🙂

2 minutes ago, Beyondspace said:

Which site?

Sorry, I thought I already had it linked.
https://www.smokintex.com/

35 minutes ago, Beyondspace said:

Order data is actually available on Order status page, can you create a 100% discount so I can make a test order to confirm the available on Order confirmation page?

Last time I used 3rd party service to make API call to Acuity server and retrieve Acuity order info

I'm not sure if this helps, but this is Tapfiliate's Squarespace integration code (referral link tracking only) that is injected into the order confirmation and order status page:

<script src="https://script.tapfiliate.com/tapfiliate.js" type="text/javascript" async></script>
<script type="text/javascript">
    (function(t,a,p){t.TapfiliateObject=a;t[a]=t[a]||function(){
    (t[a].q=t[a].q||[]).push(arguments)}})(window,'tap');

    tap('create', '47272-f7587c', { integration: "squarespace" });
    tap('conversion', '{orderId}', {orderSubtotal}, {'customer_id': '{customerEmailAddress}'});
</script>

This is the latest version of code our developer tried, also injected into the order status and confirmation pages, but he was unable to get it working:

<script src="https://script.tapfiliate.com/tapfiliate.js" type="text/javascript" async></script>
<script type="text/javascript">
    (function(t,a,p){t.TapfiliateObject=a;t[a]=t[a]||function(){
    (t[a].q=t[a].q||[]).push(arguments)}})(window,'tap');

    tap('create', '47272-f7587c', { integration: "squarespace" });
    tap('conversion', '{orderId}', {orderSubtotal}, {'customer_id': '{customerEmailAddress}'});
(function () {
  document
    .querySelectorAll('[data-test="gift-and-promo-code-input"]')
    .forEach((inputField) => {
      inputField.addEventListener("input", function (ev) {
        tap("click", { code: ev.target.value }, (err, res) => {
          console.log({ error: err, result: res });
        });
      });
    });
})();
</script>

19 minutes ago, Beyondspace said:

Order data is actually available on Order status page, can you create a 100% discount so I can make a test order to confirm the available on Order confirmation page?

Here's a code you can use: TFTEST2

Thank you so much!

3 hours ago, Beyondspace said:

Did you integrate Tapfiliate with Squarespace commerce or Acuity? To call the REST API you need to user 3rd service, previously I used Autocode webhooks because they have free generous tier, but now it is gone.

I think we can also use Cloudflare for this matter

We integrated Tapfiliate with Squarespace Commerce.

Regarding Autocode or Cloudfare, can you elaborate on what is needed from the 3rd party in order to make this work? I have a very very basic understanding of Javascript but since our developer is also stumped, I'm trying to do as much research/learning to aid this process as I can.

I really appreciate your time!

*editing to add: the only transaction data we need is the discount code used, and the order total. I had hoped this meant we would not need a secure API key as I understand that can be an issue with Squarespace, but please correct me if I am wrong.

Hello! I have Tapfiliate integrated and working with our Squarespace website, however, we are only able to track conversions that come through a referral link. We require the ability to also track conversions when a discount code is used. Tapfiliate's support has advised us this is possible through the rest api and supplied their dev docs, "Create a Conversion":

https://tapfiliate.com/docs/rest/#conversions-conversions-collection-post

We have hired a front-end developer but he has been unable to resolve this issue. Any insight or help into this would be greatly appreciated, we have been working to resolve this since January.

On 7/5/2023 at 3:44 PM, creedon said:

Settings are in the code. If you scan through the code you will find the lines for changing the adding, added and etc. text.

Thank you so much for that code! Is there a way to rework it so that the "add to cart" button for each product will show if that specific product is already in your cart?

e.g. "Add to cart +1" or "update cart quantity" etc. once that product has already been added to the cart.

On 9/20/2022 at 8:11 PM, BEE_e said:

It is such a convoluted and unclear process but this was instrumental to me figuring it out in the end - Thank you kc2615!

In squarespace under Marketing> Facebook Pixel & Ads - this section and the information there is what syncs everything together. 

You need to copy and paste the Facebook pixel ID from facebook commerce manager into squarespace and click save. 

Back on facebook in the catalogue section > Data Sources > Add New Feed

You need to take the squarespace url link directly below Facebook Pixel ID and use this as the url in the feed to upload. 

No coding necessary. Still a headache figuring it out....

 

This solution worked for me as of June 2023,
BUT instead of:
Data Sources > Add New Feed

It is now:
Data Sources > Data Feed (spreadsheet/file upload option) > then upload via URL (instead of a file) > paste SquareSpace URL

This is where you use the SquareSpace provided URL mentioned in this solution, but the description says "spreadsheet or file" so it's easy to miss that you can also add a URL here. 

On 1/25/2023 at 4:09 PM, creedon said:

I suggest using a text block for your copyright and put your JavaScript where I suggest that would find the block and update the year.

I do not think there is a clean fix for the script block issue until SS fixes it.

I see what you mean, thank you! I'll give that a try.

Here's some visuals. The disclaimer in the code block forces the section to have too many rows at the bottom. I have the block resized via CSS, but I'm not sure how to remove the additional rows from only the bottom of the footer.

16 hours ago, creedon said:

Add your JavaScript code to Settings > Advanced > Code Injection > FOOTER.

You may need to wrap your code in the following so that is loaded near the end of document load.

window.addEventListener ( 'DOMContentLoaded', ( ) => {

  [your code here]
  
  } );

Let us know how it goes.

Thanks for your help! When I add the JavaScript into the footer via code injection, it appears below the footer as plain text.

I preferred using the script in a code block so it would maintain the styling and alignment of the footer section theme, but I can't figure out how to resize the footer to reduce all the unused rows at the bottom of the footer due to the code block forcing additional grid rows.

I put a code block in the footer that uses a javascript function to automatically update the year in my copyright line of text. The code works perfectly, and I used the following css to resize the code block to the same height as the other text fields on that row.

/*footer copyright sizing*/
#block-yui_3_17_2_1_1674572709417_110386
{
  max-height:1rem
}

The row of text (that includes the code block) is intended to be at the very bottom of the page footer, but because the code block contains the javascript disclaimer about not being able to run while in edit mode, I cannot remove all the excess rows from the bottom of the footer. Beneath the row where I want my footer to end, there are 8 rows I cannot remove.

I tried setting a max footer height via CSS, but it cuts off the footer content from the top, not the bottom. How can I fix this to reduce the excess empty space at the base of my footer from the code block?

Thanks!