# 틱톡 픽셀

## 관련 문서 <a href="#undefined" id="undefined"></a>

* **픽셀 개발 가이드:** <https://business-api.tiktok.com/portal/docs?id=1739585702922241>
* **틱톡 광고 성과 측정 가이드:** <https://shorturl.at/uzCP2>
* **샵바이 변수 조회 가이드**: <https://admin-remote.shopby.co.kr/popup/variable-guide>
* **틱톡 픽셀 헬퍼:** [**https://chromewebstore.google.com/detail/tiktok-픽셀-도우미/aelgobmabdmlfmiblddjfnjodalhidnn?pli=10**](https://chromewebstore.google.com/detail/tiktok-픽셀-도우미/aelgobmabdmlfmiblddjfnjodalhidnn?pli=10)

## 틱톡 픽셀 예시

### 상단 공통

```javascript
<!-- 예시 코드 -->
<script>
  !(function (w, d, t) {
    w.TiktokAnalyticsObject = t;
    var ttq = (w[t] = w[t] || []);
    (ttq.methods = [
      "page",
      "track",
      "identify",
      "instances",
      "debug",
      "on",
      "off",
      "once",
      "ready",
      "alias",
      "group",
      "enableCookie",
      "disableCookie",
    ]),
      (ttq.setAndDefer = function (t, e) {
        t[e] = function () {
          t.push([e].concat(Array.prototype.slice.call(arguments, 0)));
        };
      });
    for (var i = 0; i < ttq.methods.length; i++)
      ttq.setAndDefer(ttq, ttq.methods[i]);
    (ttq.instance = function (t) {
      for (var e = ttq._i[t] || [], n = 0; n < ttq.methods.length; n++)
        ttq.setAndDefer(e, ttq.methods[n]);
      return e;
    }),
      (ttq.load = function (e, n) {
        var i = "https://analytics.tiktok.com/i18n/pixel/events.js";
        (ttq._i = ttq._i || {}),
          (ttq._i[e] = []),
          (ttq._i[e]._u = i),
          (ttq._t = ttq._t || {}),
          (ttq._t[e] = +new Date()),
          (ttq._o = ttq._o || {}),
          (ttq._o[e] = n || {});
        var o = document.createElement("script");
        (o.type = "text/javascript"),
          (o.async = !0),
          (o.src = i + "?sdkid=" + e + "&lib=" + t);
        var a = document.getElementsByTagName("script")[0];
        a.parentNode.insertBefore(o, a);
      });

    ttq.load("{{픽셀아이디를 입력해주세요}}"); // 틱톡에서 발급 받은 픽셀 아이디 입력
    ttq.page();
  })(window, document, "ttq");
</script>
```

### 장바구니 페이지

```javascript
<!-- 예시 코드 -->
<script>
  try {
    const {
      deliveryGroups = [],
      price: { buyAmt = 0 },
    } = sb.cart;

    const contents = [];

    if (deliveryGroups.length > 0) {
      deliveryGroups
        .flatMap(({ orderProducts }) =>
          orderProducts.flatMap((product) =>
            product.orderProductOptions.map(({ orderCnt }) => ({
              content_name: product.productName,
              content_id: product.productNo,
              quantity: orderCnt,
              price: product.buyAmt,
            }))
          )
        )
        .forEach((content) => contents.push(content));

      ttq.track("AddToCart", {
        contents,
        content_type: "product",
        value: buyAmt,
        currency: "KRW",
      });
    }
  } catch (error) {
    console.error("An error occurred:", error);
  }
</script>
```

### 주문 완료 페이지

```javascript
<!-- 예시 코드 -->
<script>
  try {
    if (sb.order) {
      const {
        orderNo,
        payInfo: { payAmt },
        orderOptionsGroupByPartner,
      } = sb.order;

      const tikTokOrderItems = orderOptionsGroupByPartner.flatMap(
        ({ orderOptionsGroupByDelivery }) =>
          orderOptionsGroupByDelivery.flatMap(({ orderOptions }) =>
            orderOptions.map((options) => {
              const {
                productNo: content_id,
                productName: content_name,
                price: { immediateDiscountAmt: discount, buyPrice: price },
                orderCnt: quantity,
              } = options;

              return {
                content_id: String(content_id),
                content_name,
                price,
                quantity,
              };
            })
          )
      );

      ttq.track("CompletePayment", {
        contents: tikTokOrderItems,
        content_type: "product",
        value: payAmt,
        currency: "KRW",
      });
    }
  } catch (error) {
    console.error("An error occurred:", error);
  }
</script>
```

### 회원가입 완료 페이지 <a href="#undefined-5" id="undefined-5"></a>

```javascript
<!-- 예시 코드 -->
<script>
  ttq.track("CompleteRegistration");
</script>
```

### 주문서 작성/결제 페이지 <a href="#undefined-6" id="undefined-6"></a>

```javascript
<!-- 예시 코드 -->
<script>
  ttq.track("InitiateCheckout");
</script>
```


---

# 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://marketing-help.nhn-commerce.com/conversion-tracking-setup/shopby-ads-script/tiktok-pixel.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.