JavaScript・PHP・Vue.jsのサンプルやWordPressのテーマ・無料フォント、ブログの運営方法等の紹介

アクセス数が増えない。まさかAMP(アンプ)対応が原因だったとは!

この記事を簡単に書くと…

  • WordPressではプラグインを使えば簡単にAMPページを生成できる
  • AMPページにもGoogleアナリティクスのコードを入れないとカウントされない
  • AMPの構文チェックにはGoogle Chromeがおすすめ
ブログランキング・にほんブログ村へ

アクセス数が増えない。まさかAMP対応が原因だったとは!

AMP(アンプ)対応していますか?
AMPはAccelerated Mobile Pagesの略で、モバイル用の高速で表示させる為のページのことになります。GoogleはAMPを推奨しており、スマホでの検索結果でも、最近ではキャッシュされたAMPページの表示が多くなってきています。

・AMP ページの Google 検索ガイドライン (Google 公式サイト)
https://support.google.com/webmasters/answer/6340290?hl=ja

 

そんなAMP対応ページを、WordPressではプラグインを使うことで簡単に実装できます。公式のAMPプラグインをインストールして有効にするだけ。それだけで、AMP対応のページが自動で生成されます。

・WordPress.org プラグインページ
https://ja.wordpress.org/plugins/amp/

 

私もとりあえずAMPに対応させる為に、WordPressのプラグインで対応するようにしていました。まさかアクセス数が増えなくなることも知らずに(実際には増えなくなるのではなく、カウントされていないだけです(^^;)。。。

 

AMPページがカウントされていなかった

そして数ヶ月が経ちました。
何だか、なかなかアクセス数が増えません。むしろ下がっていく傾向にあります。
頑張って、なるべく内容の濃いコンテンツを定期的にアップするようにしているのですが、なかなか増えてくれません。勝手に時期的な要因もあると思い込んでいたのです。

そんなある日、AMPについて調べていると、WordPressのプラグインで自動で生成されるAMPページには、Googleアナリティクスのコードが埋め込まれていないことを知ったのでした!

AMPに対応させると、GoogleがAMPページをキャッシュしていきます。
Googleにキャッシュされると、ユーザーがスマホなどで検索した際に、AMPページが表示されることがあります。

つまり、AMPページを閲覧したユーザーは、アクセス数にカウントされていないことになるのです。かなり初歩的なミスですね(^^; ということで、AMPページにもGoogleアナリティクスのコードを入れましょう!

 

フックを利用してコードを挿入

AMPのプラグインにはテンプレートがあり、そのファイルの中に直接書き込めばコードを挿入することはできますが、AMPのプラグインが更新される度に、テンプレートを修正しなければなりません。

その為、フックを利用して、記事の中にGoogleアナリティクスのコードを挿入するようにしましょう。以下のサイトで紹介されているように、function.phpにソースを追記します。

・フックが使える!WordPressのAMPプラグインを使ってAMPページをGoogleアナリティクスで計測する方法
https://www.imamura.biz/blog/25576

 

そしてfunction.phpをアップロードすれば、AMPページもきちんとカウントされるようになります。これにより、今まででよりも30~35%程のアクセス数が増加して、アクセス数が下がる前の水準くらいに戻ることができました。(本当は、前の水準よりも増えていることが望ましいですが。。。)

ついでに、Google アドセンスを使っている方は、アドセンスもAMPページ用に埋め込む必要があります。

・AMP 広告ユニットを作成する
https://support.google.com/adsense/answer/7183212?hl=ja

 

WordPressでのAMPページの確認方法

WordPressでAMPページを確認するには、URLの最後に「/amp」と入れることで、AMPページを確認することができます。AMPページをカスタマイズする際に、動作確認も含めて確認しておきたいですね。

あとは、AMPページにしっかりと対応したコードになっているかを確認するには、Google Chromeを使いましょう。Google ChromeでAMPページを表示させ、URLの最後に「#development=1」と記述します。

つまりWordPressの場合には、http://example.com/archive/1000/amp#development=1 などとなりますね。そして、Google Chromeのウィンドウ右上にある三個の点(設定)をクリックして、「その他のツール」→「デベロッパー ツール」をクリックします。

すると右側に、色々とソースが表示されたりしますので「Console」タブをクリックします。これでAMPの構文が正しく記述されているかを、確認することができます。正しく書かれていれば「AMP validation successful.」と表示されます。

エラーが表示される場合には、エラー内容に従って修正していきましょう。

 

まとめ

WordPressのプラグインを使うことで、とても簡単にAMPページを生成することは可能ですが、それだけではダメだということですね。他にも、プラグインで生成されるAMPページはとてもシンプルなので、関連ページやランキングページをさせたり、色々とカスタマイズをしておきたいところですね。

・AMP 公式サイト
https://www.ampproject.org/ja/

この記事をSNSでシェアする

関連記事

こちらの記事も読まれています

コメントする

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

Follow us on Twitter Subscribe RSS Follow us in feedly
NATURAL PRESS

カテゴリー

このサイトについて

JavaScript・PHP・Vue.jsのサンプルや参考リンク、WEBサイト(ホームページ)で使えるアイコンや写真等の素材をダウンロード出来ます。

他にも、無料で使えるブロガーやアフィリエイター向けの、WordPressマガジンテーマ「NATURAL PRESS」を公開しています。ダウンロードや更新情報は、こちらのサイトで公開しています。

また、「WEB上手」は全ページリンクフリーですのでご自由にリンクしていただけます。リンクしていただけますと嬉しいです。

WordPress Theme NATURAL PRESS by WEB-JOZU.com