「 Google Search Console 」で「 AMP ページのエラーを修正してください 」とメッセージが来たので対処方法などをあれこれまとめます。

AMP とは？

AMP とは 「Accelerated Mobile Pages の略です。AMP を使用して、容量が軽く、特にモバイル端末での読み込みが速いウェブページを作成できます。」とGoogleのサイトで解説されています。GoogleやTwitterなどが共同開発していて、その仕組み、そのためのHTML規格を指しています。

WordPressの場合、対応しているテーマやプラグインも多くあります。

 Simplicity  14 tweets 5 shares 11 users

SimplicityのAMP機能の使い方。カスタマイズ方法など。

https://wp-simplicity.com/simplicity-amp/

Simplicity2.3.1からAMPに対応しました。 以下では、簡単にSimplicityでのAMP機能の使い方を説明します。 とは言っても、そこまで難しいことをする必要はないかと思います。 AMP機能を有効にする まずSimplic

 WordPress.org  856 shares 14 users

AMP

https://wordpress.org/plugins/amp/

Enable Accelerated Mobile Pages (AMP) on your WordPress site.

HTML タグの禁止された用法、無効な用法

こちらがメッセージの詳細。

ん？と思うような内容…。しばらく考えこんでしまいましたが、答えは単純でした。

本文中に半角で＜＞を使っていたのが、タグとなっていたようです。とりあえず、全部全角にしてみたところ改善しました。

同等の AMP タグがある HTML タグの使用禁止

これだけだと、私の単純なミスの修正話で終わってしまいそうなので…。こちらのエラーについても少し記載します。

AMP では、使えるタグと使えないタグ、置き換える必要のあるタグがあります。

注意するタグ

置き換える必要のあるタグ

こちらの記事にわかりやすくまとめてありましたので参考までに。

 Qiita  1 share 3 users

AMP HTML ざっくりまとめ - Qiita

http://qiita.com/lqd_jp/items/532e25454f156d77856f

# AMP とは**AMP（Accelerated Mobile Pages）** は、Googleが発表したモバイル高速化技術です。4,500社以上のパブリッシャーや、WordPress.com がパートナーに参加し、2016年...

で、具体的に置き換えについて。色々方法があると思いますが、下の例はPHPの「 preg_replace 」を使う方法。

//videoをamp-videoに置換する
$pattern = '/<video/i';
$append = '<amp-video';
$the_content = preg_replace($pattern, $append, $the_content);
$pattern = '/<\/video>/i';
$append = '</amp-video>';
$the_content = preg_replace($pattern, $append, $the_content);

AMPに対応しているか確認できるGoogleのサイトです。

https://search.google.com/test/amp

導入時期とか…

個人的にはAMP導入は今すぐ急ぐ対策ではないと思います。とは言え、プラグインやテーマでAMPを導入している場合は、エラーがあれば対処すべきだとは思います。もし同様のエラーが「 Search Console 」で表示されていたら、参考にしてください。

いちばんやさしいWordPressの教本第3版 人気講師が教える本格Webサイトの作り方 (「いちばんやさしい教本」)

posted with ヨメレバ

石川栄和,大串 肇,星野邦敏 インプレス 2017-02-24

WordPressを勉強するにあたって一番最初に購入した参考書です。掲載されている無料テーマ「Bizvektor」は非常に扱いやすいテーマです。最新版では「lightning」で解説されています。こちらも使い勝手のいいテーマです。

Amazon

Kindle

楽天ブックス

自己紹介

Dai と申しますm(_ _)m
インディーズでミュージシャンをやっていたのですがいつのまにか...

とある企業でショップのアルバイトスタッフから正社員、支店長を経てシステム部門に異動するという、開発担当としては変わった経緯を持っている方だと思います。

「Excel VBA」からスタートして、Yamaha RTX シリーズで VPN環境構築、Hyper-V環境構築、Windowsアプリ開発などを経験した後、「 WordPress 」に出会い、どっぷりハマっています(^_^)。

現在勤めているJTクラウドシステムでは、「 WordPress 」を活用したWEBサイト、業務用WEBアプリケーション開発を中心に、記事の執筆代行や掲載に必要な情報のリサーチ、映像のテロップ入れや切りはりなどの簡単な動画編集なども、まとめて行なっています。

現在、代表取締役兼二児のパパ。社畜ながらイクメン目指して、公私ともに慌ただしくしています（笑）

お問い合わせはJTクラウドシステムホームページからお願いします。

お問い合わせ