158 人が現在オンライン
158 人が現在オンライン
Google アナリティクスのアカウント設定、プロパティ、ビューやフィルタ設定などについて、ユーザー同士で意見交換ができます。解析を通して浮かんだ質問やアイディアを投げかけ合って、よりデータ分析の知識を高めていきましょう。
ガイドを表示
star_border
返信

iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

中級者 ✭

表題のとおりですが、

iframe内にある、<input type="submit"  value="送信する" > をイベントトラッキングで計測する方法

を知りたいのですが、そもそも可能でしょうか?

 

もし難しければ、

・iframe内のイベントトラッキング方法

<input type="submit"  value="送信する" >のイベントトラッキング方法

どちらかだけでもわかる方がいたらご教授いただきたいです。

 

実装はタグマネで考えております。

 

よろしくお願いいたします。


受理された解決策
ベストアンサーのマーク済み.
解決策
トピック作成者cocoさんが付与
8月

Re: iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

セミ プロフェッショナル ✭ ✭

KAUL様

 

同一ドメインですので、iframeの中に関しては問題なく通常の要素と同じように計測ができます。

 

タグマネでフォームのsubmitをどうやってGoogleアナリティクスのイベントを取るかですが、一番簡単なのは、<input type="submit"  value="送信する" > の要素のクリックをタグマネのトリガーとして使用することです。

<input id="button1" type="submit"  value="送信する" >  のように要素に任意のidををつけ、タグマネ(Googleタグマネージャ)のトリガーで「Click ID  等しい  button1」 と設定することで、送信ボタンのクリックをトリガーにできます。

google_advertisercommunity_170809_01.jpg

 

 

あとは、タグの設定をするのですが、通常のGoogle Analyticsタグの設定(ページビュー)を行っている状態で、追加でGoogle Analyticsのタグを作成します。

google_advertisercommunity_170809_02.jpg

 

 

 

トラッキングタイプをイベントとして、イベントカテゴリなどを設定し、先ほど作成したトリガーを選択すれば、送信ボタンがクリックされた時に、Googleアナリティクスのイベントとして送信されトラッキングをすることができます。

 

こちらの公式ヘルプもご参照ください。

https://support.google.com/tagmanager/answer/6106716?visit_id=1-636378551475603563-2335189645&rd=1

 

なおブラウザによっては、イベントが発生する前に遷移してしまうこともあります。

その対策の参考URLも貼っておきますので、ご参照ください。

(※MacのSafariでiframe内のSubmitをテストしてみたところ、私の環境では問題なく測定はできました。)

 

Google Analyticsでクリックイベントが取れない?! – D2C dot Weblog – デジタル・マーケティングの技術&事例ブログ Google アナリティクスにデータを送信する  |  ウェブ向けアナリティクス(analytics.js)  |  Google Developers

 

※問題が解決された際は解決済みなどのフィードバックを頂けると嬉しいです。

元の投稿で解決策を見る


すべての返信

Re: iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

[ 編集済み ]
セミ プロフェッショナル ✭ ✭

KAUL様

 

こちらご確認なのですが、ページ内のiframe自体は編集権限のあるサイトでしょうか?また、ドメインは同じになりますでしょうか?


編集権限のない外部のサイトですと、そのiframeの中の要素にタグマネをつかって、アクセスできませんのでトラッキングができません。

 

もし、同じサイト内の別のページをiframeで呼び出す場合は、inputのsubmitを計測することができます。
ただ、親ページと、iframeで呼び出した子ページ内に2回Googleアナリティクスのコードが出てしまうと、同時に計測されてしまうので注意が必要と思います。

 

よろしくお願いいたします。

 

 

※問題が解決された際は解決済みなどのフィードバックを頂けると嬉しいです。

Re: iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

中級者 ✭
まれまる様

ご返信ありがとうございます。

はい、編集権限があるサイトです。また、同じドメインになります。

inputのsubmitを計測する方法を教えていただけますでしょうか?

よろしくおねがいいたします。
ベストアンサーのマーク済み.
解決策
トピック作成者cocoさんが付与
8月

Re: iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

セミ プロフェッショナル ✭ ✭

KAUL様

 

同一ドメインですので、iframeの中に関しては問題なく通常の要素と同じように計測ができます。

 

タグマネでフォームのsubmitをどうやってGoogleアナリティクスのイベントを取るかですが、一番簡単なのは、<input type="submit"  value="送信する" > の要素のクリックをタグマネのトリガーとして使用することです。

<input id="button1" type="submit"  value="送信する" >  のように要素に任意のidををつけ、タグマネ(Googleタグマネージャ)のトリガーで「Click ID  等しい  button1」 と設定することで、送信ボタンのクリックをトリガーにできます。

google_advertisercommunity_170809_01.jpg

 

 

あとは、タグの設定をするのですが、通常のGoogle Analyticsタグの設定(ページビュー)を行っている状態で、追加でGoogle Analyticsのタグを作成します。

google_advertisercommunity_170809_02.jpg

 

 

 

トラッキングタイプをイベントとして、イベントカテゴリなどを設定し、先ほど作成したトリガーを選択すれば、送信ボタンがクリックされた時に、Googleアナリティクスのイベントとして送信されトラッキングをすることができます。

 

こちらの公式ヘルプもご参照ください。

https://support.google.com/tagmanager/answer/6106716?visit_id=1-636378551475603563-2335189645&rd=1

 

なおブラウザによっては、イベントが発生する前に遷移してしまうこともあります。

その対策の参考URLも貼っておきますので、ご参照ください。

(※MacのSafariでiframe内のSubmitをテストしてみたところ、私の環境では問題なく測定はできました。)

 

Google Analyticsでクリックイベントが取れない?! – D2C dot Weblog – デジタル・マーケティングの技術&事例ブログ Google アナリティクスにデータを送信する  |  ウェブ向けアナリティクス(analytics.js)  |  Google Developers

 

※問題が解決された際は解決済みなどのフィードバックを頂けると嬉しいです。

Re: iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

中級者 ✭
まれまる様

詳しくおしえていただきありがとうございます!

いろいろな方法を調べておりましたが、一番納得がいくというか、イメージがつく気がしました!

実際に試して、またご報告させていただければと思います。

よろしくおねがいいたします。

Re: iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

中級者 ✭
まれまる様

試してみたのですが、うまくいきませんでした。。。

ただ調べて見ると、子ページの方に、タグマネージャーのコードが入っていませんでした。
これが原因でしょうか?汗

Re: iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

セミ プロフェッショナル ✭ ✭

KAUL 様

 

すみません、ご案内した方法だと、子フレームにもタグマネージャーが必要ですね。

フレームを厳密にjavascriptで指定できればできそうな気もするのですが、ちょっといまだ未検証です。

 

子フレームにタグマネージャーが貼れれば試していただいて、デバッグの方法として、以下をご確認ください。

 

  • 親ページでタグマネが動いているか?(プレビューツールが表示されるか)
  • Googleアナリティクスの通常タグを設定できているか(ページビューがリアルタイムで確認できるか)
  • クリック時にトリガーがうまく動いてるか

 

設定の間違いがある場合、原因がタグなのか、トリガーなのかデバッグを行う必要があります。

 

プレビューツールを使って、クリックの時にタグが設定表示されているのか、されていなければ、クリック時にトリガーの条件がどうなっているのかを確認してみてください。

 

ただし今回の場合クリックするとフォームが遷移されてページが変わるため、プレビューツールでクリックの状態を見ることができないかと思います。そこで、一つの方法として、フォームを以下のように変えると、フォームの送信をしないようにできます。

 

<input type="submit"  value="送信する" >

<input type="button"  value="送信する" >

※フォームの内容が送信されませんので、テスト環境として行ってください。

 

送信ボタンをクリックするとプレビューツール内の左側に gtm.click と表示されますので、それをクリックしてタグが配信されているか、トリガーの条件がどうなっているかを確認できます。

 

よろしくおねがいいたします。

Re: iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

中級者 ✭

まれまる様

 

ご回答ありがとうございます。

 

上記の方法を試してみようと思ったのですが、子ページにタグマネを埋め込むことで、ページビューが二倍になるのではないかと懸念しております。
こちらは、
①二倍になってしまうのか?
②二倍にならないためにはどうしたらよいか?
こちらについてもご教授いただけたらと幸いです。

お手数おかけ致しますが、何卒よろしくおねがいいたします。

Re: iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

[ 編集済み ]
セミ プロフェッショナル ✭ ✭

KAUL様

 

例えば以下のケースだと、

 

親 http;//example.com/parent_page.html

子 http://example.com/child_frame.html

 

parent_page.htmlが読み込まれた時点で、child_frame.htmlも読み込まれますので、両方のページが別々に記録されます。

これ自体はそれほど問題ないと思いますが、このページに来た場合、すぐに離脱しても2ページ見たことになるので、直帰としてカウントされず、直帰率に影響があります。

 

これを回避する方法として、parent_page.htmlにGoogleアナリティクスコードが出力されないように、タグマネージャーで設定ができると思います。 その場合、child_frame.htmlのみが計測され、parent_page.htmlは全くカウントされません。

 

どちらをとるかは計測したい内容、指標によって異なるかと思いますので、どちらが良いとは一概には言えないかと思います。

 

dataLayer変数を使って、クリックしたときにイベントを発生させると行けそうでもあるのですが、

結局要素にonclickのイベントなどを直接 記述する必要があるので、タグマネージャを使用せずに子ページにクリック時のイベントを直接記述するのが、一番スマートかもしれません。 よろしくお願いいたします。

 

※問題が解決された際は解決済みなどのフィードバックを頂けると嬉しいです。

Re: iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

[ 編集済み ]
中級者 ✭

もれまる様

子フレームにそのままタグマネを設置する形がベストだと考えたので、実装したら無事にクリックをイベントで計測できました!
ありがとうございました!

Re: iframe内にある、<input type="submit" value="送信する" > をイベントトラッキングで計測する方法

[ 編集済み ]
セミ プロフェッショナル ✭ ✭

KAUL様

 

無事にトラッキングができ、よかったです!

フィードバックいただきありがとうございます。また何かありましたらご質問ください!