この記事は7分で読むことができます。
記事サマリー
この記事を読んでわかること
-
- ChatGPTを利用してコンバージョンタグに付与する売上とメールアドレスをGTMで簡単に取得が出来る
こんな方へオススメの記事
-
- tROASを利用したいが動的に売上を取得する方法がわからない
- GTMのカスタムJSの書き方がわからない
- DOMの要素取得がわからない
- HTMLがわからない
この記事を実践するための準備
-
- Googleタグマネージャー
- ChatGPT3.5以上
目次
- 1 記事サマリー
- 2 コンバージョン値の最大化(tROAS)や拡張コンバージョンを実装したい
- 3 動的に売上やメールアドレスを取得するのはなぜ?
- 4 手順①:webサイトに、売上やメールアドレスの記述があるwebページを探す
- 5 手順②:対象のwebページを開いてHTMLソースをメモ帳に貼り付ける
- 6 手順③:ChatGPTを開いて、GTM取得用のカスタムJavaScriptを書いてもらう
- 7 手順④:GTMのユーザー定義変数でカスタムJavaScriptを書く
- 8 手順⑤:タグに値を紐づけます
- 9 補足①:プレビューツールで確認する場合
- 10 補足②:PCとSPのサイトでHTMLのソースコードが違う場合がある
- 11 補足③:データレイヤー変数やJavaScript変数があれば利用
- 12 補足④:GTMで電話番号を取得する場合
- 13 最後に
コンバージョン値の最大化(tROAS)や拡張コンバージョンを実装したい
カスタムJavaScriptを書くには、ある程度のプログラムの知識が必要になってきます。Google社から売上を利用した自動入札の「コンバージョン値の最大化」を利用して欲しい、メールアドレスを取得した計測方法の「拡張コンバージョン」を実施して欲しいと、言われることがあると思います。
しかし、いずれもGTMでカスタムJSで動的に値を取得する必要があります。今回はプログラム知識が無くてもカスタムJSを書く方法を記載します。誰でも簡単に出来ますので、是非記事通りに実践をしてください。
動的に売上やメールアドレスを取得するのはなぜ?
コンバージョンあたりの売上が同一であったり、コンバージョンするユーザーのメールアドレスが全て同じであれば静的に付与して問題ありません。しかし、ほとんどの商材はお客様毎に売上が変わったり、メールアドレスも違います。
ユーザー毎に違う値が割り当てられることを動的、同一の値が毎回入ることを静的と呼びます。この動的な値をGoogleに渡すことにより、Googleが持っているユーザーデータと突合をして、自動最適化や自動入札の精度を良くします。
例えばホテルの予約をする際の、合計金額やメールアドレスを取得する際などわかりやすいと思います。ユーザー毎に合計金額やメールアドレスが異なります。
※この画像は、お客様より許諾を頂き掲載しています。
webサイト毎に記述位置や書式などすべて違うので、毎回取得方法が違うのでは?と思うかもですが、結論すべて違います。今回は、GTMを利用してサイト毎に売上やメールアドレスを取得する方法となります。
また、HTMLソースにデータレイヤー変数やJavaScript変数があればそちらを優先したほうが良いでし、DOM要素の取得が分かる方はそちらを優先してください。今回はわからない方向けにカスタムJavaScriptでの取得方法を記載します。
手順①:webサイトに、売上やメールアドレスの記述があるwebページを探す
主に、フォームの完了ページにある場合が多いのでテストコンバージョンをする必要があると思いますので、テストコンバージョン規定を確認してください。
手順②:対象のwebページを開いてHTMLソースをメモ帳に貼り付ける
対象のページへ行ったら、Ctrl+U(コントロールボタン+U)を押しソースを確認します。売上がある場所を検索してブラウザに表示されているHTMLソースの場所を特定します。メールアドレスの場合も同様です。
対象の取得したい場所から前後10行くらいをコピーしてメモ帳に貼り付けてください。JavaScriptがわからない方向けの記事ですので10行と書いていますが、わかる方はClass属性の部分だけを貼りつけてください。
こんな感じで、取得したい前後10行のソースコードをメモ帳に貼り付ければOKです。
手順③:ChatGPTを開いて、GTM取得用のカスタムJavaScriptを書いてもらう
ChatGPTを開いて指示文を書きます。先ほどメモ帳に貼り付けたHTMLソースの下に、以下の指示文を貼り付けてChatGPTを実行してください。ChatGPTのバージョンが3.5でも動いていることが確認されています。
- 売上を取得する場合の指示文
Google タグマネージャー (GTM) で日本円の売上を取得するためのカスタム JavaScript 変数を作成したいです、そのまま貼り付けられるコードを書いてください。
- メールアドレスを取得する場合の指示文
Google タグマネージャー (GTM) でメールアドレスを取得するためのカスタム JavaScript 変数を作成したいです、そのまま貼り付けられるコードを書いてください。
ChatGPTには、こんな形で実行するだけでOKです。
しっかりと、GTMで利用出来る変数の記述で返してくれます。今度はChatGPTが書いてくれたコードをコピーしてメモ帳に貼り付けます。
手順④:GTMのユーザー定義変数でカスタムJavaScriptを書く
GTMへログインをして、変数のタブからユーザー定義変数の新規ボタンを押します。
次に、カスタムJavaScriptボタンを押します。
先ほど、ChatGPTに書いてもらったコードを貼り付けて保存ボタンを押します。
メールアドレス取得の場合も同様ですので、参考に作成してみてください。
手順⑤:タグに値を紐づけます
コンバージョン値に先ほど作成した、ユーザー定義変数を割り当てて、売上を取得する際に通貨コードがある場合は「JPY」という日本円を意味する静的な値も入れるようにしてください。メールアドレスの場合はそのまま入れて大丈夫です。保存をして公開すれば完了です。
- 売上を取得する場合(例:Googleコンバージョンタグ
- メールアドレスを取得する場合(例:Google Ads User-provided Data Event
補足①:プレビューツールで確認する場合
プレビューにして、売上やメールアドレスを取得するページへ行きます。次にWindow Loadedの中のVariablesのタブへ行きます。
売上に値が入っていれば無事に取得出来ていますので、安心して公開してください。
補足②:PCとSPのサイトでHTMLのソースコードが違う場合がある
その場合、コードの書き方が少し難しくなりますので、遠慮なく弊社サイトからヘルプをください。
補足③:データレイヤー変数やJavaScript変数があれば利用
今回はわからない方向けに書いた記事なので、ここは割愛しています。
補足④:GTMで電話番号を取得する場合
取得した電話番号の090-xxxx-xxxxなど、‐(ハイフン)を削除する必要があるのか?頭に+81(日本の国コード)を付与する必要があるのか?ですが、結論何もする必要がありません。自動で判別して頭に+81を付与してくれますし、‐(ハイフン)も削除してくれます。
最後に
最近のGoogle広告の流れでは、コンバージョン値の最大化(売上を利用)の方が入札精度が良く、なおかつChromeのCookie廃除から1stパーティデータ(メールアドレス)の取得が必須になっています。
制作会社さんにお願いをすると、数十万円の見積もりを出されたなどあり得ないことがおこっているので記事にしてみました。今回はwebサイトに売上やメールアドレスがある場合ですが、業種によってはwebサイトに表示させないものもあります。この場合どうやって基幹システムにあるデータと突合するのか?が課題になりますので、それは別の記事で記載したいと思います。
おそらく、Google Ads User-provided Data Eventの拡張コンバージョンのメールアドレス取得も、Googleが同じようにAIを利用して取得していると推測しています。そう考えるとメールアドエスは無理して手動で書かなくても良いかもしれません。
Web業界にて20年以上、大手から中堅代理店の顧問を請負。デジタルマーケティングを中心に、主に広告関係の教育や研修、コンペの相談に乗っています。またSEMのお役立ちツールもスクラッチで開発。現在も電通グループの顧問、Shirofuneのアルゴリズム作成補助など担当しています。皆さまに心から信頼されるパートナーであり続けるために日々研鑽しております。皆様に直接お会いし、お話しできる機会がありましたら、SEMの運用コンサルから無料相談まで、ぜひお気軽にお声がけください。