# Headless stores

## Step 1: initialize ShipScout

You will need to configure ShipScout and load the ShipScout SDK. To do so, include the following html/javascript on your site before the closing \</head> tag:

<pre class="language-javascript"><code class="lang-javascript">&#x3C;script>

    window._shipScout = window._shipScout || [];
    window.Shopify = window.Shopify || {};
    
    /* 
    Replace mystore.mystore.com with the Shopify domain (should always include
    ".myshopify.com") excluding https:// 
    */
    Shopify.shop = 'mystore.myshopify.com';

    /*
    Replace mystore.com with your domain but do not include
    a leading dot or the subdomain
    */
<strong>    window.shipScoutCookieDomain = 'mystore.com';
</strong>
&#x3C;/script>
&#x3C;script async src="https://web.shipscout.app/app.min.js">&#x3C;/script>
</code></pre>

Warning: the configuration (the code in the first script tag) must be run before the `app.min.js` is loaded. If the SDK loads before the configuration, ShipScout will not track conversions correctly.

## Step 2: update cart items with ShipScout data

To track conversions, you will need to set a custom ShipScout attribute (sometimes referred to as a line item property) on each and every item that is added to a customer's cart. Set this attribute to `window.ShipScoutLineItemProperty`.

For example, if you are using the graphql api, here is a snippet of

```javascript
// This is an illustration of the customAttributes section of the graphQl query
// If the above cookies exist then pass in those values as a customAttribute

customAttributes: [
   // Any existing custom attributes go here
   //  and add the new ShipScout custom attribute like this:
   {
      key: '_sc',
      value: (typeof window.ShipScoutLineItemProperty !== 'undefined' ? window.ShipScoutLineItemProperty : "")
   }
]
```

## Step 3: track the add to cart event

*Note: if you are using the /cart.js step, you can ignore this step.*

If you're using the GraphQL Storefront API to manage the cart state, you will need to fire the "Add to cart" event by calling `window.ShipScoutTrackAddToCart()`. It is safe to call this function repeatedly on every add to cart; only the initial event will be tracked.

```javascript
// Track the "Add to cart" event
if(typeof window.ShipScoutTrackAddToCart === "function") {
    window.ShipScoutTrackAddToCart()
}
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.shipscout.app/tasks/headless-stores.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.