# Installing Tags in Shopify

## Installing Tags in Shopify

> For Shopify app integration setup, see also [Shopify Integration](/en/integrations/shopify.md).

## Basic Tag Installation

### 1. Find the theme.liquid template

In the Shopify admin dashboard, select "Online Store" → "Themes", then select "Edit code" from the "…" button

### 2. Install the Ptengine basic tag under

Please paste the Ptengine basic tag in the red box area on the right side of the image below.

#### **Example of Basic Tag**

```js
<!-- Ptengine Tag -->
<script src="https://js.ptengine.com/xxxxxxxx.js"></script>
<!-- End Ptengine Tag -->
```

> **DANGER**
>
> **⚠️ Caution**
>
> The xxxxxxxx part above is your project ID, which differs for each Ptengine project.
>
> Please replace it with your own project's ID.
>
> For more details, please refer to [this article](/en/getting-started/othertag/tag-shopify.md).

#### **How to Obtain the Ptengine Basic Tag**

## Event Installation

Simply installing the basic tag above is not enough to aggregate behavioral data such as **purchase completion and cart addition**, which are common on e-commerce sites.

Therefore, if you also want to check event data and conversion data on Ptengine, we also recommend setting up events.

### Implementing Event Collection Tags

#### 1. Select "Settings" in the Shopify Admin Dashboard

#### 2. Select "Customer events"

#### 3. Set a Pixel Name

Click the black "Add custom pixel" button in the top right, and set the pixel name in the popup. (In the figure below, we have set it to "pt tracking on checkouts" as an example)

Then click "Add pixel".

#### 4. Save

Paste the code below in the Code section, and save by clicking "save" in the top right.

> **DANGER**
>
> **⚠️ Caution**
>
> **Be sure to replace** `const sid` **with your own Ptengine project ID!!!**

```js
// Code to paste
function trackEvent(eventType, eventProperties, cb) {
  const sid = "Enter your profile ID";
  // Enter your project ID!
  const area = "jp";
  const options = eventProperties || {};

  loadPtengineScript(sid, area)
    .then(() => {
      console.log("Ptengine script loaded successfully");
      window.ptengine && window.ptengine.track(eventType, options);
      cb && typeof cb === "function" && cb();
    })
    .catch((error) => {
      console.error("Ptengine script loading failed:", error);
    });
}

function loadPtengineScript(sid, area) {
  return new Promise((resolve, reject) => {
    if (window.ptengine) {
      resolve();
    } else {
      const url = window.location.href.replace(
        /\/wpm@[a-zA-Z0-9]+\/web-pixel-[a-zA-Z0-9]+@[a-zA-Z0-9]+\/sandbox\/modern/,
        ""
      );
      window._pt_sp_2 = [];
      _pt_sp_2.push(`setAccount, ${sid}`);
      _pt_sp_2.push(`setPVTag,${url},replace`);

      const script = document.createElement("script");
      const isCheckoutPage = window.location.href.includes("checkouts");
      const sandboxQuery = isCheckoutPage ? "" : "?sandbox";
      script.src = `https://js.ptengine.${area}/${sid}.js${sandboxQuery}`;
      script.onload = () => resolve();
      script.onerror = () => reject(new Error("Script loading failed"));
      document.head.appendChild(script);
    }
  });
}

analytics.subscribe("checkout_completed", (event) => {
  const checkout = event?.data?.checkout;
  const checkoutTotalPrice = checkout?.totalPrice?.amount;
  const checkoutItems = checkout?.lineItems;
  const checkoutOrderId = checkout?.order?.id;
  const uid = event?.data?.clientId;

  const eventProperties = {
    totalPrice: checkoutTotalPrice,
    totalorderid: checkoutOrderId,
  };

  const identifyCallback = () => {
    checkoutItems.forEach((checkoutItem) => {
      ptengine &&
        ptengine.identify(uid, {
          totalPrice: checkoutTotalPrice,
          totalorderid: checkoutOrderId,
          totalquantity: checkoutItem?.quantity,
          totaltitle: checkoutItem?.title,
          totalid: checkoutItem?.id,
          totalsku: checkoutItem?.variant?.sku,
          totalProductType: checkoutItem?.variant?.product?.type,
        });
    });
  };
  trackEvent("checkout_completed", eventProperties, identifyCallback);
});

analytics.subscribe("search_submitted", (event) => {
  trackEvent("search_submitted");
});

analytics.subscribe("collection_viewed", (event) => {
  trackEvent("collection_viewed");
});

analytics.subscribe("product_viewed", (event) => {
  trackEvent("product_viewed");
});

analytics.subscribe("product_added_to_cart", (event) => {
  trackEvent("product_added_to_cart");
});

analytics.subscribe("product_removed_from_cart", (event) => {
  trackEvent("product_removed_from_cart");
});

analytics.subscribe("cart_viewed", (event) => {
  trackEvent("cart_viewed");
});

analytics.subscribe("checkout_started", (event) => {
  trackEvent("checkout_started");
});

analytics.subscribe("checkout_contact_info_submitted", (event) => {
  trackEvent("checkout_contact_info_submitted");
});

analytics.subscribe("checkout_address_info_submitted", (event) => {
  trackEvent("checkout_address_info_submitted");
});

analytics.subscribe("checkout_shipping_info_submitted", (event) => {
  trackEvent("checkout_shipping_info_submitted");
});

analytics.subscribe("payment_info_submitted", (event) => {
  trackEvent("payment_info_submitted");
});

```

#### 5. Publish

Finally, click the "Connect" button in the top right to publish the code set in Step 4.

### About Event Tag Firing Timing

## Important Notes

When using Ptengine with Shopify, please be sure to check the following points.

### **1. Please install the Ptengine basic tag directly in "Shopify themes"**

Please install the Ptengine basic tag directly in Shopify themes (theme.liquid).

Installing via Google Tag Manager may not allow event measurement due to Shopify's specifications.

Therefore, we do not recommend installing through tag managers such as GTM, and it is outside the scope of support.

### **2. Do not add page-by-page transmission restrictions or conditions**

We do not recommend modifying the Ptengine basic script to fire only on specific pages or restricting firing based on URL conditions.

Please understand that we cannot investigate the cause or provide support for any data measurement issues that occur in such cases.

### **3. If you change the theme, you need to reinstall the tags**

In Shopify, when you change a theme, the contents of theme.liquid are reset.

Therefore, if you switch themes or apply a new theme, please reinstall the Ptengine basic tag in the new theme as well.

Please note that if you do not reinstall the tag, Ptengine measurement will not be performed.


---

# 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://helps.ptengine.com/en/getting-started/othertag/tag-shopify.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.