> For the complete documentation index, see [llms.txt](https://docs.antsomi.com/developers-guide/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.antsomi.com/developers-guide/3rd-party-integrations/shopify/tracking-shopify-website-events.md).

# Tracking Shopify website events

### Tracking StoreFront

Download the file `cdp-tracking-script.liquid` and put it in the folder Snippets: [link](https://drive.google.com/file/d/1jOt9MSqzfRNFB-kYvt1LQmPhO7HY9mef/view?usp=sharing)

### Tracking Checkout Event

Step by step go to Order status page setting: Home > scroll end page > click button Go to checkout setting > Order status page

Download the file `cdp-order-status.liquid` and Insert it into the Order Status page:[ link](https://drive.google.com/file/d/1fr20gc7icNp1ioMgpJjhLTdcxdN6bMfw/view?usp=sharing)

### Script pubsub function

Download the file `cdp-pubsub.js` and put it in the folder Assets: [link](https://drive.google.com/file/d/1Oi_VJPzMGjjte24ULDuTyfqP_jpnHPzB/view?usp=sharing)

### Insert the script into the file

#### 1. Script get cart

Insert the script below into the file `theme.liquid` (If the theme hasn't returned the JSON data within the cart yet).

```html
<script id="cart-json">
  var xhr = new XMLHttpRequest();
  xhr.open('GET', 'https://shopify.antsomi.com/cart.json', true);

  xhr.onload = function () {
    if (xhr.status >= 200 && xhr.status < 300) {
      var response = JSON.parse(xhr.responseText);
      document.getElementById('cart-json').textContent = JSON.stringify(response, null, 2);
    }
    else {
      console.error('Request failed:', xhr.status, xhr.statusText);
    }
  };
  xhr.onerror = function () {
    console.error('Connection error');
  };
  xhr.send();
</script>
```

#### 2. Event Remove Cart

Go to the file `Assets/cart.js` and call the `publish()` function in the CartRemoveButton class.

```javascript
class CartRemoveButton extends HTMLElement {
  constructor() {
    super();
    this.addEventListener('click', (event) => {
      event.preventDefault();
      this.closest('cart-items').updateQuantity(this.dataset.index, 0);
      let indexItem = this.dataset.index;
      let e = { 
        data : {
          index : +indexItem
        }
      };
      publish("antsomi:removeCart", e); //Call the 'publish' function in the CartRemoveButton class
    });
  }
}
```

#### 3. Event Sign-In

Go to the file `customers/login.liquid` in the folder Templates.&#x20;

Insert the script at the end of the page:

```html
<script>
  let btnLogin = document.querySelector('#customer_login button');
  btnLogin.addEventListener('click', function(){
    sessionStorage.setItem('loginSubmitted', 1);
  })
</script>
```

#### 4. Event Sign-up

Go to the file `customers/request.liquid` in the folder Templates.&#x20;

Insert the script at the end of the page:

```html
<script>
  let btnLogin = document.querySelector('#create_customer button');
  btnLogin.addEventListener('click', function(){
    sessionStorage.setItem('registerSubmitted', 1);
  })
</script>
```
