例えばメールでAMPエラーのメッセージが届いたら、そこにはリンクがあるかと思います。リンクをクリックしたらどのページにAMPエラーが出ているかわかりますよね。

そこになぜエラーが出ているか詳細な状況と原因・解決方法が書かれています。以下をチェックしていただけますか。

そしてAMPエラーが出ているリンク先URLを置いていただけたらテーマ側で対応できる範囲、対応してもらえてきている状況だったりします。

 

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

上記リンクでampページをテストすれば以下のエラーが検出されますよね。

HTML タグの禁止された用法、無効な用法
属性「width」はタグ「col」で使用できません。
行 302:0 　<col span="1" width="12" /></colgroup>
行 380:0　<col span="1" width="12" /></colgroup>

行を選択すれば以下のコードが表示されます。

<h2>乗用車ランキング</h2>
<p>&nbsp;</p>
<table border="1" width="100%" cellspacing="0" cellpadding="2">
<colgroup>
<col span="1" width="12" /></colgroup>
<tbody>
<tr>
<td class="tablettl" align="center" width="158">順位</td>

amp-不具合について/#4193

【タグ「amp-iframe」の属性「width」に無効な値「」が設定されています。】

詳細を教えていただけたら、わいひらさんが詳細を調べまわることなく、状況をみて対処してくれる・対処法を教えてくれるはずです。

冒頭にもありますように、以下

できれば不具合・カスタマイズ対象ページのURLを掲載してください

よろしくお願いします。

ちなみにwidthの値がカラ。ってことですか？どのようなiframeを読み込んでるのかな？と思ったんですが。※リンクを置くをスゴク嫌がるかたもいるので。

やっぱりリンクを置いていただくのが詳細な情報を一度にチェックできるのでイチバン解決が早いと思います。

AMPエラーに関しては、実際のURLがないと、ちょっとどうしようも対処のしようがないかもしれません。
実際にどのようなタグが書かれていて、どのようなエラーメッセージが出ているか詳細に見る必要があるので。

ただ、エラーメッセージから推測すると、Googleマップ（もしくはその他iframeを使用するツール）とかを利用していてwidth属性に100%とかが入っているのではないかと思います。
AMPでは、width属性には、％指定はできずpx数でしか指定できません（単位は不要で数字のみ）。
いずれにせよ、確かなことは実際のページを見てみないとわからないです。

すいません。

エラーメッセージに焦ってしまい、URLを載せ忘れていました。

https://moikkani.com/2017/11/20/wrongname/?amp=1

お忙しい時に手間をかけてしまい申し訳ないです。

よろしくお願いします。

教えて頂いたAMPテストを実施した結果、

【タグ「amp-iframe」の属性「width」に無効な値「」が設定されています。】と表示されました。

該当箇所はどれもAmazonJSを使用して、商品の貼り付けを行った箇所の様です。AmazonJSを無効化して様子を見た方がいいでしょうか？

AMPやコードに関する知識が乏しく、ご迷惑をおかけしますがアドバイスを頂ければありがたいです。

おそらく、Amazonパーツのiframeタグに「 width="120" height="240"」といったような属性が入っていないのが原因のように思います。
手っ取り早く修正するには、記事内のAmazon iframeに属性を追加すると良いかもしれません。

コード側で何とかできないかは、今日は遅いので明日でも見てみようと思います。

コード部分を見てみたら、思いのほか早く修正できそうだったので、直してみました。
https://github.com/yhira/cocoon/archive/master.zip
よろしければ、試してみていただけると幸いです。

Google Search Consoleで「タグ「amp-img」に属性「class」が複数含まれています。」という警告が表示されました。

確認したところ、画像を配置した際に付与されるclass
※例：class="aligncenter size-medium wp-image-851"

とは別に、amp化された際に付与されるclass
※例：class="amp-lightbox amp-lightbox-gallery"

が同じaタグ内に記載されているのが原因でした。
※現象が起こったURL → https://nagasaki.pw/sns_badcomment-853/?amp=1

↓↓↓
<amp-img class="amp-lightbox amp-lightbox-gallery" lightbox src="https://～.jpg" width="500" height="500" alt="" sizes="(max-width: 500px) 100vw, 500px" class="aligncenter size-medium wp-image-851"></amp-img>

手動でclassを設定した際も重複してしまうのですが、classを消す以外に対策があればご教授いただけると助かります。

https://search.google.com/test/amp?hl=ja&id=FJJNZnPc5m4QRagtur2YxA

エラーはでてないようです。

手動でclassを設定した際も重複してしまうのですが、classを消す以外に対策があればご教授いただけると助かります。

今後の事でしたら

<img class="hoge geho" class="gehoho hogege"

投稿画面テキストエディタ上でこのような書きかたをせず、以下のように書けばエラーはでませんよ。

<img class="hoge geho gehoho hogege"

ちなみにCocoonのスタイル：インラインとかでしたら、このように重複しないんですけど…。

https://gyazo.com/6dd4a47563f7421ee68f22ae0d026272

かうたっくさん、お返事いただきありがとうございます！

警告が出ていたのはAMPテストではなくGoogle Search Consoleの方でした。

「class」をまとめたいのですが、AMP化の際に自動的に追加された「class」なので手がつけれず困っていました。

> amp化された際に付与されるclass
> ※例：class="amp-lightbox amp-lightbox-gallery"

インラインスタイルについてもありがとうございます！
私も基本はそこを使っていますが、今回は普通に挿入した画像で症状が出ました ? 

ほんとですね。タイトル『 AMPページでの不具合』　これをみればAMPエラーともとれますが、もっと大きなカテゴリで言えば、タイトル通りですね

追加の詳細情報に感謝です！

ご報告ありがとうございます。
AMPエラー対応したものをアップしておきます。
https://github.com/yhira/cocoon/archive/master.zip

「Cocoon設定→キャッシュ削除」から「AMPキャッシュの削除」を実行してバリデーターなどで試してみてください。
https://validator.ampproject.org/

かうたっくさん、わいひらさん、ご確認いただきありがとうございます！

さっそく修正データまでご準備いただき嬉しかったです ? 

今後ともよろしくお願いいたします。

もしよろしければ、最新版を適用後「動作したか」だけでも書き込んでいただけると助かります。

こんばんは、お世話になっております。

まつのすけさんと全く同じエラー通知が来ており、ちょうどフォーラムで質問しようとしていました。

そして、AMPエラー対応したテーマをアップして、バリデーターを試したところ無事にPASSしました。

現在、サーチコンソールで新たに検証してもらっています。

「保留」となっていますので、また報告したいと思います。

横から失礼しました。

申し訳ございませんでした。

最新版を適用し、AMPキャッシュも削除したところ、「class」の重複が無くなりました。
※ソースコード上での目視確認です。

Google Search Console の方はインパラさん動揺、再検証に時間がかかるようですが、指摘箇所が書き換わったので問題なさそうです。

インパラさん、まつのすけさん、動作報告ありがとうございます！

うまく修正できていたようでよかったです。

Google Search Consoleは、バリデーターで問題なければ、そのうちエラー表示は消えると思います。