【AFAD】Shopifyとの成果連携

③カスタムピクセルへShopify専用成果タグを設置する

③グループ計測タグをShopify（詳細管理ページ）へ設置します

・Shopifyへログインいたしまして左メニュー「商品管理」商品 > 説明で「htmlを見る」を選択します。

３．リダイレクタ設定を行う方法
※グループ計測タグを設置する方法を利用しない場合はこちらをご設定ください
※グループ計測タグを設置する方法の場合は不要となります、

４．Shopify専用成果タグを作成します。

・グループ成果タグを取得します。
　タグ管理>グループ成果タグ一覧より対象グループのJSタグより取得します。

・Shopify専用成果タグのフォーマットに取得したグループ成果タグの情報を入力します。設置していただきたいタグ
■Shopify専用成果タグフォーマット

analytics.subscribe('checkout_completed', (event) => {
  const checkout = event.data.checkout;
  const checkoutTotalPrice = checkout.totalPrice?.amount;
  const allDiscountCodes = checkout.discountApplications.map((discount) => {
    if (discount.type === 'DISCOUNT_CODE') {
      return discount.title;
    }
  });
  const allItemTitles = checkout.lineItems.map(item => item.title);
  const firstItem = checkout.lineItems[0];
  const firstItemDiscountedValue = firstItem.discountAllocations[0]?.amount;
  const customItemPayload = {
    quantity: firstItem.quantity,
    title: firstItem.title,
    discount: firstItemDiscountedValue,
  };
  const paymentTransactions = event.data.checkout.transactions.map((transaction) => {
    return {
      paymentGateway: transaction.gateway,
      amount: transaction.amount,
    };
  });
var uqid   = "●●●●●●●";
var gid    = "●●●●●●●";
const maxLength = 200;
var uid    = event.data?.checkout?.order?.id;  // Assign order ID to uid
var uid2   = allItemTitles.join(',').substring(0, maxLength);
  var af     = "";
  var pid    = "";
  var amount = checkoutTotalPrice;
  function insertScript(script) {
    script.onload = function() {
      if (typeof fpcAction === 'function') {
        var fa = new fpcAction(script.id);
        fa.protocol = 'https:';
        fa.groupAction(gid, af, [uid, uid2], pid, amount, uqid);  // Use groupAction
      }
    };
    document.head.appendChild(script);
  }
  var a = document.createElement("script");
  a.src = "//●●●●●●●/ac/action_js.php"; 
  a.id = "afadaction-" + Date.now();
  insertScript(a);
  
  const payload = {
    event_name: event.name,
    event_data: {
      totalPrice: checkoutTotalPrice,
      discountCodesUsed: allDiscountCodes,
      firstItem: customItemPayload,
      paymentTransactions: paymentTransactions,
    },
  };
});

・取得したグループ成果タグ内の記述をShopify専用成果タグフォーマットの●●の箇所に上書きを行います。
■変更する箇所

４． Shopify専用成果タグをカスタムピクセルへ設置します。
・Shopifyへログインいたしまして左メニュー内>設定を選択します。