AMPのプラグインを設定しよう！アドセンスの対応方法も！

こんにちは、ゴトーです。

本日はワードプレスのAMPプラグインを設定します。アドセンスの対応方法も紹介します。

AMPプラグインは有効化のみ

いつも通り、管理画面の「プラグイン」⇒「新規追加」にして「AMP」とプラグイン検索ボックスに入力します。

AMPのプラグインはこれです。これを「有効化」すれば完了です。

AMPのプラグインに関しては以上で終わりです。気になる方だけ、下に進んでみてください。

AMPってなに？

ページの無駄を省いて高速化して読み込みを早くするのがAMPです。特にグーグル的には対応してようが対応していまいが関係ないらしいですが、AMPに対応したことで離脱率が低くなったりする点などは今まで通り評価していくということです。

かなり大雑把に説明しましたが、そういうことです。

百聞は一見に如かず！ということで、この記事のURL末尾に「363.html/amp」赤文字部分を付け足してみてください。それで表示されたページがAMP対応ページです。

検索結果のタイトル横に「AMP」表示があるものに関しては、対応しているページとのこと。(いまだにスマホで確認できてないのはなぜ・・・？)　実際に特化型ブログに導入しましたが、アクセスの半分はAMP対応ページになっています。是非、AMPは導入しましょう！

AMP用のアドセンス広告の作り方

通常のアドセンスコードの下に、

<amp-ad width=”300″ height=”250″
type=”adsense”
data-ad-client=”ca-pub-あなたのアドセンスID”
data-ad-slot=”広告の番号”>
</amp-ad>

を埋め込みましょう。参考までに僕の場合は、

<center>
スポンサーリンク
</center>
<script async src=”//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script>
<!– 広告① –>
<ins class=”adsbygoogle”
style=”display:block”
data-ad-client=”ca-pub-自分のアドセンスID”
data-ad-slot=”広告ナンバー”
data-ad-format=”auto”></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<amp-ad width=”300” height=”250”
type=”adsense”
data-ad-client=”ca-pub-自分のアドセンスID”
data-ad-slot=”広告ナンバー”>
</amp-ad>

凄く長くなってしまいました。「QuickAdsense」などのプラグインを使っている方は、そちらに埋め込んでおけば今まで通り変わらず使っていけます。

僕の場合、レシポンシブ広告にしていたのですが、AMP対応ページになったら赤文字の通りに300×250のサイズのみが表示されています。

「2個連続で広告が表示される」ということはないので、安心してください。アドセンス広告がAMP対応するまでの応急処置になりそうですね！＊このページのアドセンス広告もAMP対応にしてあります。

アナリティクスはAMPにも埋め込む必要あり！

実は普通にアナリティクスコードを埋めている場合、AMP対応ページのアクセスを図ることができません。同じアナリティクスコードでいいので、「プラグイン」⇒「AMP」⇒「編集」からCSSに、直接コードを埋め込む必要があります。

JetPackのサイト統計情報であれば、そのままAMP対応ページも合わせてのアクセスを解析してくれているので、AMPについてはそっちでいいや。ということでもいいと思います。

CSSをいじる作業なので、頑張ってください！「AMP　アナリティクス」と検索をかければ出てくるので、そちらを参考にどうぞ！

ありがとうございました！

AMP対応は大変ですね！12月からAMP対応にして様子を見ていますが、特に変わった様子はありません。

一応、持っている特化型ブログ1個だけアナリティクスコードを埋め込みました。時間が出来たらトレンドブログやその他特化型ブログもAMP対応をしていきます。

お疲れさまでした！