To migrate to Shopify Checkout Extensibility support with the ShopMy Affiliate Network, we require updates to your existing order tracking setup. Click tracking setup does not require any modifications.

Step One: Setup Shopify Pixel Order Tracking

Shopify Custom App Pixels are compatible with the new Shopify Checkout Extensibility upgrade, and allows us to subscribe to checkout_completed events on your order completed or thank you page.

To set up a custom app pixel in your Shopify store, complete the following steps:

Navigate to store settings in Shopify admin
Click "Customer Events" in the settings menu on the left
Click the "Add Custom Pixel" button in the top right, name the new pixel "ShopMy Checkout Tracking"
In the "Customer Privacy" section, make the following selections:
1. Permission: Not required
2. Data Sale: Data collected does not qualify as data sale
  1. ShopMy does not store or sell your customer information

Paste the following into the "Code" section to set up the ShopMy Order Tracking Integration:

analytics.subscribe('checkout_completed', event => {
  const checkout = event.data.checkout;
  const allDiscountCodes = checkout.discountApplications
    .map(discount => {
      if (discount.type === 'DISCOUNT_CODE') return discount.title;
    })
    .filter(Boolean);

  const cookies = document.cookie
    .split(';')
    .reduce((res, cookie) => ({ ...res, [(cookie.split('=')[0] || '').trim()]: (cookie.split('=')[1] || '').trim() }), {});
  const { sms_click_id } = cookies;
  const code = allDiscountCodes?.[0];
  const shopmy_data = {
    orderAmount: checkout.subtotalPrice?.amount,
    orderId: checkout?.order?.id,
    clickId: sms_click_id,
    currency: checkout.currencyCode,
    is_returning_customer: false,
    page_url: window.location.href,
    code
  };

  fetch(`https://api.shopmy.us/api/order_confirmation`, {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify(shopmy_data)
  })
    .then(r => {
      if (!r.ok) throw new Error('Invalid order request sent');
      r.json();
    })
    .then(() => {
      const now = new Date();
      document.cookie = `sms_click_id=;expires=${now.toUTCString()};path=/;`;
      document.cookie = `sms_click_time=;expires=${now.toUTCString()};path=/;`;
    })
    .catch(() => {
      // ignore the error
    });
});

Click the "Save" button in the top search bar to save the new Custom Pixel.
Click the "Connect" button on the bottom right to activate the Custom Pixel.
1. if you see the following message on the "Connect" button and you are unable to click it, make sure you have completed step 6 and saved changes thus far:
  1. ```
  The pixel cannot be connected until a custom pixel script is saved for it
```

Step Two: Remove Existing Order Tracking

Now that the Custom App Pixel is set up to integrate order tracking with new Shopify Checkout Extensibility, you will need to remove our old order tracking integration that was set up previously and will soon be deprecated.

Case 1: If you added a checkout script in Shopify admin settings > Checkout:

You can check if you have a ShopMy order tracking script in "Additional scripts" by navigating to Shopify store settings > Checkout > Additional scripts section and searching for "api.shopmy.us". If there is nothing setup here for ShopMy order tracking, skip this case and check Case 2. You likely have an order_confirmation script on your checkout page. Contact a developer on your team to get this removed.

Navigate to store settings in Shopify admin
Click "Checkout" in the settings menu on the left
Scroll to the "Order status page additional scripts" section (now deprecated)
Remove the existing ShopMy order tracking script and click "Save"

Case 2: If you added a checkout script via GTM

Disable / Remove the order tracking pixel. It is most likely labeled "ShopMy Click Tracking (2/2)"
1. The checkout script should contain a POST request to api.shopmy.us/api/order_confirmation

Case 3: If you previously manually added our order_confirmation script to your checkout page:

Remove the script tag from your checkout page that contains the POST request to api.shopmy.us/api/order_confirmation
1. the new Custom Pixel above now handles this behavior

Step Three: Request Testing

Contact your Brand Success Manager to place a test order.

Now that the new Custom App Pixel is set up to handle ShopMy Affiliate order tracking with Shopify Checkout Extensibility, and the old order tracking functionality is removed, please contact your Brand Success manager so we can verify the new Custom App Pixel is functional.

📘
By adding our integration code to your site, you are agreeing to the terms of the ShopMy affiliate network. Please review these terms here.