【タグ発火】GTM設定

前提

このページではチャットボット用サンキューページにタグ発火するための設定をまとめています
GTMがtheme.liquidに埋まっていない場合、theme.liquidにGTMタグの設置をお願いします
- お客様のイベント（ShopifyPixel）にてGTMタグを設定頂く必要がありません

手順

GTMのトリガー設定
1. コムチャット用サンキューページのURLを指定したページビュートリガーを作成
2. ページURLは活用するページのURLに適宜修正下さい
3. 最後の「?」は必ずつけるようお願いします。サンキューページに誘導する際、必ずパラメータを付与するためです

GTMの変数設定

添付のように新規のユーザー定義変数を設定する
1. 変数のタイプ：URL、要素タイプ：クエリ、クエリキー：以下の表の中で必要なものをそれぞれ設定
2. 変数名は自由に変更頂いていかまいませんが例えば「CC_｛変数名｝」として頂くとわかりやすいかと思います。 ※上記の添付はCC_transaction_id

チャットボット用サンキューページに引き継がれるパラメータ情報

クエリキー	値に出力される内容	値の例
transaction_id	注文番号	1001
currency	注文時の通貨	JPY
value	購入金額（税込）	3300
tax	税金	300
shipping	送料	0
coupon	クーポンコード	NEW500
id	SKU ※Google&YouTubeアプリで出力される商品id情報と同じ	shopify_JP_8632705777950_14864320758046
name	商品名	THE ハックルベリー - 化粧水
brand	ブランド名	CommChat
category	アイテムカテゴリー	ChatBot
variant	バリアント情報	350ml
price	商品単価	3000
quantity	数量	1
customer_id	顧客番号	1010

もし他の変数を出力してほしいという場合、CSチームにご連絡下さい

タグ設定
1. トリガーは1で設定したチャットボット用サンキューページとし、タグを設定する
2. タグ内に出力したい値は変数として記述する
  1. 例）Meta広告
    Plaintext
```
<script>
  fbq('track', 'Purchase', {
    value: {{CC_value}},
    currency: '{{CC_currency}}',
    content_ids: '{{CC_transaction_id}}',
  });
</script>
```
    1. {{変数名}}については上記の2-aで設定された変数名を指定して下さい
  2. 例）Google広告
    Plaintext
```

<script>
  gtag('event', 'conversion', {
      'send_to': '[タグID]',
      'value': {{CC_value}},
      'currency': '{{CC_currency}}',
      'transaction_id': '{{CC_transaction_id}}'
  });
</script>
```
    1. [タグID]はGoogle広告管理画面で出力したいタグのIDを指定して下さい
    2. {{変数名}}については上記の2-aで設定された変数名を指定して下さい
  3. 例）a8.net
  Plaintext
```
<span id="a8sales"></span>
<script src="//statics.a8.net/a8sales/a8sales.js"></script>
<script>
a8sales({
"pid": "[プログラムID]",
"order_number": "{{CC_transaction_id}}",
"currency": "JPY",
"items": [
{
"code": "a8",
"price": 1,
"quantity": 1,
},
],
"total_price": "{{CC_value}}"
});
</script>
```
  1. プログラムIDはa8.netに指定されたIDを活用下さい
  2. {{変数名}}については上記の2-aで設定された変数名を指定して下さい
【参考例】
※こちらはアドエビスを利用されている際の例となります。ご利用中の広告媒体にあわせて設定をお願いいたします。
GTM設定のプレビュー確認
1. プレビューモードでチャットボット用サンキューページに遷移し、ちゃんとタグ発火できているか確認する
GTM設定の公開
1. これで作業完了です