閲覧ページ数をcookieに保存するJavascriptタグの活用法

閲覧ページ数によってGoogleAnalyticsやMixpanelのタグを発行する方法をまとめます。

閲覧ページ数をcookieに保存するJavascriptタグ

まず、閲覧ページ数をcookieに保存するJavascriptのタグをサイトに設置します。

<script>
function setCookie(name, value) {
 var cookie = name + "=" + value + "; path=/; domain=." + location.hostname.replace(/^www\./i, "");

 document.cookie = cookie;
}

function getCookie(name) {
 var cookies = document.cookie.split(";"),
 toReturn;

 for (var i = 0; i < cookies.length; i++) {
 var cookie = cookies[i].trim();
 if (cookie.indexOf(name + "=") === 0) {
 toReturn = cookie.substring((name + "=").length, cookie.length);
 }
 }
 return toReturn;
}

(function() {
 var pageviewCount = getCookie("pageviewCount");

 if (typeof pageviewCount === "undefined") {
 pageviewCount = 1;
 } else {
 pageviewCount++;
 }

 setCookie("pageviewCount", pageviewCount);

})();
</script>

ファーストパーティcookie変数の設定

Googleタグマネージャーに閲覧ページ数を受け取るための変数を設定します。

pageviewCountというファーストパーティcookie変数を設定します。

<img src="https://kurose.me/wp/wp-content/uploads/2019/04/firstpartycookie-variable-1024x561.png" alt="" width="680" height="373" class="alignleft size-large wp-image-670" />

一定ページ数以上閲覧したときに発火するトリガーの設定

トリガーを設定します。今回は3ページ以上閲覧したユーザー用のトリガーを設定します。

トリガータイプは、「ページビューのウィンドウの読み込み」を選択してください。

<img src="https://kurose.me/wp/wp-content/uploads/2019/04/morethan3pv-1024x561.png" alt="" width="680" height="373" class="alignleft size-large wp-image-668" />

そして、pageviewCountが3以上のときに発火するようにします。

このトリガーによって発行されるGoogleAnalyticsのイベントやMixpanelのイベントのタグをGoogleタグマネージャーに設定すれば完了です。

一定ページ数閲覧したユーザーとそうでないユーザーを比較分析する際などに使えます。

参考:The Magic of Google Tag Manager and Cookies

Ruby on Railsをこれから本格的に勉強したい人は「エンジニアになるための600時間のプログラミング学習に耐え抜くコツ」という記事がおすすめです。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする