wordpressにAMPプラグイン入れるのちょっとまって!

AMP(Accelerated Mobile Pages)という言葉聞いたことありますか?
GoogleとTwitterで共同開発されGoogleが推奨していて簡単に言うと「スマートフォンなどモバイルページを高速表示させる仕組み」的な感じです。

最近は、検索でもAMP対応した記事が検索結果に並んでいます。
赤枠内の雷マークがAMP対応の記事ということです。

Google様が「AMP対応を推奨する!」と言えば「おっしゃる通り!」とすぐに対応するしかないですよね!?
検索にも影響するかもしれないと思うと早めに対応しなければと思ってしまいます。

そこでAMP対応にすることにしました!
AMP化できるwordpressのプラグインをインストールします。

ちょっと待ってください!!!
今回は最後まで、この記事を読んでください。決してこの段階で「私もAMP対応しよう💛」と行動を起こさないでください!

順を追って説明します。
[chat face=”3a03145cd984df0f1a46ea4fda596dc4.gif” name=”キッズくん” align=”left” border=”red” bg=”red”]今回は若干興奮してるよ!  [/chat]

wordpressにAMPプラグインをインストール

こちらのAMPプラグインは、AMPプロジェクトで紹介されているプラグインです。

インストールは普通にインストールします。

無事インストールされました。(満足♪)

それではサイトを確認します。
ページのアドレスの後に「#development=1」を付けたすことでAMP対応のページが見れます。

AMP対応後サイトを確認してみる

「なんだこれ?」

一瞬レイアウトが崩れてるのかと思いました。

基本、写真と文字だけです。
JavaScriptやcssも制限され、静的に表示されます。

インターネットの初期の時代に戻った感じです。
これだけ、そっけない感じになると読み込みも早くなりますわ!!

cssできれいにレイアウトしていても、cssがリンクされていない感じです。
みなさん、どんな感じか見たいですよね?
とても見せれる状態ではありません。

その他にも問題があります!

アドセンス広告が表示されていな~い!

対処法としましては、レイアウトもAMP用に若干レイアウトは別にできます
アドセンスもAMP用ページの head タグ内にコードを挿入したり…

あーめんどくさ~い!

ということで、今回はAMPはパス!不採用!

ではAMPのプラグインは解除!

ちょっと待った~!
[chat face=”3a03145cd984df0f1a46ea4fda596dc4.gif” name=”キッズくん” align=”left” border=”red” bg=”red”] びっくりするな?どうしたの?[/chat]

アドセンス広告が表示されていない?

今までの流れでは、AMPをインストールしてレイアウトが変わりすぐにAMP対応はやめようとした。という流れですが、実はこの時点ではアドセンス広告が表示されていないことに気付いておらず、しばらくレイアウト修正しながらAMP対応にしておりました。

しばらくして、アドセンス広告料に影響が出ていたので、「検索順位かな?」とスマホで軽く検索すると、今までとはそこまで順位変動はありませんでした。

タイトル横に雷マークが付いていてAMP対応になってるのを確認してページを確認しました。

何か足りない?何か足りない?アドセンス広告がな~い!
と叫びました…

AMPの問題はここからです…

実はここでAMPプラグインを停止しますと、現在インデックスされている検索項目からアクセスできなくなるのです!

検索でインデックスされているAMPのページと元のアドレスが違うためです。

「ページが見つかりません」と表示されます。

再度、インデックスされれば回復はしますが、収益化している場合は数日間表示されない…無理無理無理!絶対無理!

GoogleのSearch Consoleで「Fetch as Google」対応してもすぐには全ページインデックスされません。

対策としてAMPは解除せず、そのままで…

AMPを停止するとページのアクセスを遮断することになるので、AMPは停止しません

その代わり、今後新しくページをインデックスされる時にAMPページのURLを出力しないようにします。そうすることで、時間をかけて元のアドレスがインデックスされていきます。

AMPのプラグインを修正します。
amp/includes/amp-frontend-actions.phpのファイルを修正します。

こちらの部分を
add_action( ‘wp_head’, ‘amp_frontend_add_canonical’ );

下記のように最初の部分に//を入れてコメントアウトします。
// add_action( ‘wp_head’, ‘amp_frontend_add_canonical’ );

これでAMPプラグインはAMPページのメタ情報を出力しなくなります。
AMPを止めることなく自然と元のアドレスがインデックスされていきます。
現在AMPのページはなくなっていますので、この方法でよかったと思います。

皆さんは、AMP対応にされる場合は良く理解して対応してください。
この度は若干、取り乱してしまいましたが、最後まで読んでいただきありがとうございました。

AMP化してもそんなにレイアウトが変わらないサイトやブログもあります。
cssでいろいろレイアウトしていなければレイアウトも変わらない可能性もあります。

アドセンス広告に関しましては、AMP対応のコードに変えて挿入してください。