1. HOME
  2. ブログ
  3. 雑記
  4. Googleタグマネージャで読了率を試す(できる逆引き・実践技240 P335)

BLOG

ブログ

雑記

Googleタグマネージャで読了率を試す(できる逆引き・実践技240 P335)

 

今回のテーマ Googleタグマネージャで読了率を計測してみた

 

できる逆引き Googleアナリティクス Web解析の現場で使える実践ワザ240 ユニバーサルアナリティクス&Googleタグマネージャ対応

参考書籍『できる逆引き Googleアナリティクス 実践技240』P335

 

 

◇Googleタグマネージャで読了率を計測する

直帰したページについては滞在時間は取得できません。

特設ランディングページについては、ジックリ読んだのか否か、直帰の質が問題になります。

この直帰の質によっては特設ランディングページの改善が必要です。

 

 

そこで、「読了率」を計測してこの判断を可能とします。

今回参考にする書籍では、1分後にスクロール位置が当該ページの95%以上であれば

読了とします。そして、読了である場合に集計するイベントトラッキングを構築、読了数をカウントします。

何をもって読了したとするかはそれぞれのページで個別に定義しながら、プログラミングする必要があります。

 

 

【手順】 変数、トリガ、イベントの命名は、各プロジェクトの命名規則にしたがってください

①【変数の作成】読了フラグ変数を使用可能とします。「変数」を使って宣言します。

Google_Tag_Manager03

 

 

②【トリガの作成】30秒後に読了フラグがtrueになる場合にタグを発火させる「トリガ」を作成する

Google_Tag_Manager04

 

 

③【タグその1】ページ全体の95%以上到達した場合に読了と判定するjavascriptを作成する

Google_Tag_Manager05

<script>
VAR_IsReadThrough = false;

$(window).bind(“scroll”,function(){
scrollHeight = $(document).height();
scrollPosition = $(window).height() + $(window).scrollTop();
if((scrollHeight – scrollPosition)/scrollHeight <= 0.05){
VAR_IsReadThrough = true;
}
});
</script>

 

 

④【タグその2】読了フラグ=trueをカウントするイベントタグを作成する

Google_Tag_Manager06

Google_Tag_Manager07

 

 

⑤動作確認

Google_Tag_Manager08

 

Google_Tag_Manager09

 

Google_Tag_Manager10

 

このように、タグマネージャによって、javascriptによるデータ計測の幅が広がります。

アイデア次第でさらに高度なデータ計測が可能です。

 

この読了率を始め、技術的には枯れ始めております。

より精緻なデータを取得するためにも、今後、積極的に活用したい技術です。

 

 

追記)20170501

Uncaught TypeError: $ is not a functionなどのエラーが出る場合は、

下記のサイトを参考にデバッグしてみてください。

 

http://structured-p.info/jquery/258

http://bugpixel.net/output/web/jquery-error/

http://www.finefinefine.jp/jquery/kiji2117/

 

 

 

 

speech-bubble Googleタグマネージャの導入・実装・緊急不具合でお困りごとはございませんか??

ぜひ、弊社へ気軽にご相談くださいませ。きっと、お役に立てると思います。

[contact-form-7 id=”6″ title=”GTM問い合わせ”]

 

 

関連記事