ふんばりフロントエンジニアのブログ

新米フロントエンジニアのふんばっている日々と備忘録です。

Google Analyticsでオプトアウトした時はこうなるよ

こんにちは〜〜

今回はGoogle Analyticsでオプトアウトするときの設定をご紹介します。

Google Analyticsは今や多くのWebサイトで活用されているアクセス解析ツールです。

そしてオプトアウト、というのはGoogla Analyticsにサイト閲覧者の情報を送らないようにするための設定のこと。

つまりユーザーが「自分の情報を提供したくないから、アクセス解析に入れないで!」というのがGoogle Analyticsでいう所のオプトアウトです。

しっかりドキュメントを見れば載っている事なので参考にするまでもないことかもしれませんが一応、残しておきます。

Google Analyticsのオプトアウト方法はドキュメントに載ってる!

f:id:ma1129nm:20181022140339p:plain

はい、という事でGoogle Analyticsでオプトアウトをするための方法はドキュメントにしっかり記載してくれています↓

高度な設定 - ウェブ トラッキング(analytics.js)  |  ウェブ向けアナリティクス(analytics.js)  |  Google Developers

このように、windowプロパティに「ga-disable-トラッキングID」を追加し、その値を「true」にする事でオプトアウトの設定が完了します。

ただ、これだけではそのページでだけオプトアウトが設定されることになり、他のページに飛んでしまった時やブラウザを閉じてまたアクセスしてきた時にこのwindowプロパティは消えてしまいます。

じゃあcookieを使うか、と考えながらドキュメントをスクロールして見てみると...
f:id:ma1129nm:20181022140811p:plain

これまた親切に、cookieを使ったオプトアウトの例を書いてくれています。

ただ、cookieの設定は適宜変える必要がありますね。

そして注意点としてタグマネージャー のjsだけでなく、しっかりanalytics.jsも読み込んであげてください。

つまりこのような感じになりますね。

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXX-YY', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

<!-- Google Tag Manager -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-KXPVFMN"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','XXX-YYYY');</script>
<!-- End Google Tag Manager -->

そして、このGoogle Analyticsを読み込む前に先ほどのwindowプロパティを変更する必要があります。

そうしないとオプトアウトされないので注意しましょう。

これらの設定ができ、ページを確認して↓のようになっていればオプトアウトは完了です。
f:id:ma1129nm:20181022141643p:plain

このログはGoogle Analyticsデバッグ用jsを読み込むことで吐き出すことができます。

開発段階でのみ使用することを推奨されており、かなり便利なもの。

デバッグ  |  ウェブ向けアナリティクス(analytics.js)  |  Google Developers

このように、analytics.jsをanalytics_debug.jsとするだけでデバッグモードになるのでぜひ利用してみてくださいね。