Google Analytics トラッキング コードの設定 方法

今回は子テーマをせっかく作ったのでそれを利用してGoogle Analytics トラッキング コードの設定 をします。

ちなみに良く見かける方法は、親テーマの「header.php」へ直接書き込んだりする方法です。
もちろん手軽ではありますが、親テーマのアップデートでコードが無くなってしまいます。

それから、プラグインでGoogle Analytics トラッキング コードを設定する方法もありますが、プラグインって何かと問題を起こすし重くなるので、ほんとうに使いたい機能以外は極力避けたいと思っています。
これは好みの話なので、プラグインを使ってももちろんOKだと思います。
検索してみると下の2つが良く使われているプラグインみたいです。
・Google Analytics by Yoast
・All in One SEO Pack

子テーマを使った Google Analytics トラッキング コードの設定

では、初心者にもわかる「子テーマを使ったトラッキング コードの設定」を紹介します。
子テーマに便利な「functions.php」ファイルがあります。
このファイルには自分で関数を定義追加することができます。
なので、自分でGoogle Analytics トラッキング コードをheadに貼り付ける関数を登録してしまおうという方法です。

『twentyelevenの子テーマの作り方』や『twentyseventeenの子テーマの作り方』の方法で子テーマを作ってあると「functions.php」が作ってあるはずです。
親テーマのスタイルシートを読み込む際に以前は @import: を使用して親テーマのスタイルシートをインポートしていましたが、これはもはや良い方法ではありませんと言われています。
親テーマのスタイルシートを読み込む正しい方法は、子テーマの 「functions.php」 で wp_enqueue_script()を使用する方法です。したがって子テーマには 「functions.php」 を作成する必要があります。

で、その「functions.php」にしたのコードのようにコピペするだけです。

//Gole Analytics Code設定
function set_gac() { ?>
    <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-XXXXXXXX-X', 'auto');
        ga('send', 'pageview');

    </script> 
<?php }
add_action('wp_head', 'set_gac');

これで親テーマがアップデートされても上書きされないのでメンテナンスが楽になります。

以上、子テーマを使ったGoogle Analytics トラッキング コードの設定方法でした。