Shopifyカスタムイベント、Googleコンバージョンタグの設定方法！

新しいチェックアウト(Checkout extensibility)にアップグレードすると、
「注文状況ページ」の追加スクリプトが無効となります。
既存の設定のままでは、Google広告の管理画面でCVが計測できなくなってしまいます。

そこで、Shopify「お客様のイベント」から「カスタムピクセル」を作成し新たにCV設定を行います。

下記のコードでは、購入完了（チェックアウト）をCVとして設定したコードになります。

色のついた箇所をGoogleコンバージョンタグに置き換えることで計測ができるようになります。

【重要】実際に計測できるようになりましたが、下記のコードを実装したことによる損害などは補償しておりません。
判断・実装は自己責任となりますためご留意ください。

// Created by FeedArmy V1.05
const script = document.createElement('script');
script.setAttribute('src', 'https://www.googletagmanager.com/gtag/js?id=AW-111111111');
script.setAttribute('async', '');
document.head.appendChild(script);

window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-111111111', {'allow_enhanced_conversions':true});

analytics.subscribe("checkout_completed", (event) => {
  gtag('set', 'user_data', {
    email: event.data?.checkout?.email,
    phone: event.data?.checkout?.phone,
    address: {
      first_name: event.data?.checkout?.shippingAddress?.firstName,
      last_name: event.data?.checkout?.shippingAddress?.lastName,
      street: event.data?.checkout?.shippingAddress?.address1,
      city: event.data?.checkout?.shippingAddress?.city,
      region: event.data?.checkout?.shippingAddress?.province,
      postal_code: event.data?.checkout?.shippingAddress?.zip,
      provinceCode: event.data?.checkout?.shippingAddress?.provinceCode,
      country: event.data?.checkout?.shippingAddress?.country,
      countryCode: event.data?.checkout?.shippingAddress?.countryCode,
    }
  });

  gtag('event', 'conversion', {
    send_to: 'AW-111111111/abcdefg111111111',
    transaction_id: event.data?.checkout?.order?.id,
    value: event.data?.checkout?.subtotalPrice?.amount,
    currency: event.data?.checkout?.subtotalPrice?.currencyCode,
  });
});