AMPページに通常のGoogleアナリティクスコードは設置できませんが。設置しても動作しないということです。
Googleアナリティクスコードはjavascriptなので、AMPページでは使えません。
AMPページにGoogleｃを設置するには、AMP用ページを超簡単に作成するWPプラグインの組み合わせによる方法があるのですが、当サイトのテーマは「Simplicity」を使用しており、プラグイン無しでAMPページに対応しているので、この方法は使わず、AMP用ページにGoogleアナリティクスをエラー無く設置する方法を参考にやってみたのですが、どうもうまくいきません。
いろいろ試行錯誤してみてGoogleアナリティクスコードの設置ができましたので、その記録です。
「Simplicity」のAMPページは「single-amp.php」を修正する
「Simplicity」にはカスタマイズ用に「子テーマ」が用意されています。
親テーマはそのままに、子テーマでカスタマイズ出来ればと思い、「footer-insert.php」にアナリティクスコードを設置したのですが、まったく反映しません。
原因は「footer-insert.php」はAMPページには関係ないからでした。
「single-amp.php」をよく見てみると１３行目に
<script async custom-element=”amp-analytics” src=”https://cdn.ampproject.org/v0/amp-analytics-0.1.js”></script>
の記述は既にされているので <head> 内はこのままでいいので、 </body> 直前にアナリティクスコードを設置するといいわけです。
私は次のように設置しました。
<script type=”application/json”>
{
“vars”: {
“account”: “UA-○○○○○○○-2”
},
“triggers”: {
“trackPageview”: {
“on”: “visible”,
“request”: “pageview”
}
}
}
</script>
</amp-analytics>
尚、アナリティクスコードは通常プロパティのコードだと、データが統合されるので、AMP用のプロパティを追加してUA-○○○○○○○-2にしました。
設置してすぐテストしてみます。
自分でAMPページにアクセスして「リアルタイム」で確認します。
親テーマのファイルを修正したので、忘れないようにメモを残しておきます。
AMPページは検索順位に影響するか
AMP化はGoogleなどが進めているプロジェクトですが、モバイル検索でAMPページが有利になることは無いと言われています。
検索結果に影響しないのであれば、AMPページ対応する必要性についていろいろ議論がありそうですが、今後の全体の流れを見ていく必要はありそうです。
せっかくAMPページが出来たので、モバイル検索の結果とPC検索とを比較してみました。
検索ワードは記事タイトルそのままですが、何故か４位表示と残念な順位です。
モバイル検索でも同じく４位。上の３つはAMPではありません。
PC検索とまったく変わらない順位結果になっています。
やはりAMPページだからといってモバイル検索で有利になるということは、今のところ無さそうです。
プラグインを使ったAMPページの広告コードとアナリティクスの設置
プラグインを使ってAMPページ対応させる場合、プラグインは「AMP」だけをインストールするだけでいいようです。
「Simplicity」を使っていない別サイト１個をAMP化してみました。
AMP用の広告コードの設置しているサイトも多いと思いますが、広告コードはプラグインを使用しなくても簡単にAMP用のコードを設置できます。
例えば、adsenseの場合は通常のJavaScriptのコードの下に、次のコードを加えるだけです。
type=”adsense”
data-ad-client=”ca-pub-○○○○”
data-ad-slot=”○○○○“>
</amp-ad>
アナリティクスは、テーマのファイルをいろいろ修正してみましたがうまくいきませんでした。
結果的にはすごく簡単な方法でできました。
プラグインの「AMP」内にある［templates］フォルダ内にある［single.php］に、AMP用ページにGoogleアナリティクスをエラー無く設置する方法の通り
を<head>直下に記入します。
そして</body>手前に先に説明した
<script type=”application/json”>
{
“vars”: {
“account”: “UA-○○○○○○○-2”
},
“triggers”: {
“trackPageview”: {
“on”: “visible”,
“request”: “pageview”
}
}
}
</script>
</amp-analytics>
を記入します。
コメント