WordPressプラグインに頼らずAnalyticsコードを貼り付ける

<head>タグ内に加える

テーマのheader.phpにHTMLを直接書いてしまう手もありますが、テーマファイルをあまり汚したくない場合はfunctions.phpに以下のように加えます。

function adds_head() {
  echo "<script async src='https://www.googletagmanager.com/gtag/js?id=UA-******-*'></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-******-*');
</script>
";
}
add_action('wp_head', 'adds_head', 0);

UA-******-*の箇所は自分のトラッキングIDに置き換えてください。

最後のadd_action()の記述で<head>タグのほぼ先頭に挿入します。

<head>タグ内にAnalyticsコードを書くことのデメリット

解析を確実に取るなら<head>タグに入れることをAnalyticsも公式に推奨していますが、<head>にJSファイルの読み込みを入れると Google PageSpeed Insights にレンダリングブロックとして指摘されます。

確実な解析よりレンダリングブロック対策を優先する場合、以下のように<body>の末尾に入れ替えるよう書きます。

<body>タグ末尾に加える

function adds_footer() {
  echo "<script async src='https://www.googletagmanager.com/gtag/js?id=UA-******-*'></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-******-*');
</script>
";
}
add_action('wp_footer', 'adds_footer', 0);

内容はほぼ変わらず、add_action()のアクションフックをwp_footerにした程度です。

AWSを利用した導入事例のご紹介

実際に構築を行ったAWSの事例を紹介しています。導入の目的に近い事例をご覧いただくと、実際の構成例やメリット、注意点などが把握できます。

ブックオフコーポレーション株式会社様
第一生命保険株式会社様
株式会社電通様
株式会社LIFULL様
株式会社リブセンス様
TBSアナウンス部様
明治大学様
拓殖大学様