サーチコンソールで「ステータスエラー」が出たので、解決してみました。

この記事は2020年5月現在のものです。

解決を試みた当時はWord Pressテーマ「Luxeritas」を使っていましたが、今は違うテーマです。でも多分、解決の方法とテーマはそんな関係ないと思うので、同じエラーの出た方、よかったら参考にしてください。

エラーの原因は、人によって見出し文字やプラグインが問題だったりすることがあるようですが、私の場合、結論から言うとエラーの原因は「Amazonアソシエイトの商品リンク」の中にAMPで使えないCSSがあることでした。

以下解決までにやったことです。

サーチコンソール に「AMP関連の問題が検出されました」とメールが来る

まず、サーチコンソールに、下記のこんなメッセージが届きます。

「許可されてない属性または属性値がHTMLタグにあります」と書いてあります。どう言うことかと言うと

「あなたのブログ記事の中に「AMP」の設定では使用不可の(エラーになる)「何か」が使われてるから、そこを直してくださいね」

ということです。

じゃ、まずその「何か」をまず探します

「AMPの問題を解決する」をクリックする

メッセージの下にあるブルーの「AMPの問題を解決する」をクリックすると以下の表示が現れます

URLをクリックしてエラーを確認する

ページ下の方のURL(赤丸のところ)をクリックすると、どこに問題があるのか下記のように右側に表示されます

右の表示に色付きの「エラー個所」が出てこない場合は、スクロールして色がついてる部分を探してください

ページ内の インスタンス を確認する

赤枠の部分「< >」をクリックすると、画面が横にスクロールしてエラーが何個あるか確認できます。

私の場合は1/4なので、4つエラーがありました。

「インスタンス」ってなに?

「ページ内のインスタンス1/4」の「インスタンス」は、簡単に言うと実際のブログの記事に表示されてる「動作のある部分」のことです。

とりあえず「動作のあるもの、部分」のことなんだなってイメージできればOKです!

たとえば今回は、記事中にある「商品リンク」や「動画、画像」なんかのことですね。

「インスタンス」= 動作のある部分 →「記事の中のリンクや、動画(引用、画像)」

記事内で「商品リンク」や「引用画像や動画」などを使うために Word Pressのエディターに決められた入力方法でコードを埋め込んでますよね? 

そうすることで「画像リンク」を表示させたり、「テキストリンク」を使ったりして記事を書いていると思いますが、 

インスタンスは正に、動作のあるそれのことです

なので、何がエラーの原因なのかを探すとき、リンクや、引用、動画などの動作のあるものを疑ってみてください。

で、さきほどの、色付きでエラーを指摘された部分がブログ記事の中のどの部分なのかわかりました

– 今回のエラーの原因 –
AMP表示の邪魔をする「何か」は、「Amazonアソシエイトの商品リンク」でした
商品リンクのコードの中に、AMPで使用できないCSS「 !important 」が入っていることが原因でした。

(✳︎AMPで使用できないCSSは他にも色々ありますのでご注意ください)

【解決】AMPを無効化にする方法

Word Pressで「AMP 無効化」に設定します。

手順は、記事を書くエディター画面の右側にある、「文章」をクリックして、一番下までスクロールします。「AMP無効化」を開いてチェックすします。

かんたん!解決しました。

拡大してみました。ここにチェックを入れると、ページ単位でAMPを無効化できます

今回の解決方法はこれで終わりです。

【おまけ】問題のある Amazonリンク を他のデザインに張り替えてみる

ここで、今まで「Amazon」だけだった商品紹介リンクを、「楽天市場」や「Yahoo!ショッピング」も一緒に紹介できるようにしてみます!

まず、エラーのあるAmazonの商品リンクを削除します

削除したあとは、もしもアフィリエイト「かんたんリンク」を使って、同じ商品の紹介リンクを作り直してブログに貼り付けます。

こんな感じです↓お買い物できる範囲が増えました。

(これは画像です実際の広告リンクではありません)

利用したのは、もしもアフィリエイト「かんたんリンク」です。

ブログをやってて、まだもしもアフィリエイトに登録していない人は無料で登録できて、商品リンクが使えるので試してみるのもおすすめですよ。どんなところなのかリンクを貼っときますね



もしもアフィリエイトの「かんたんリンク」の特徴は、Amazonだけでなく、楽天市場とYahoo!ショッピングのリンクも一緒に表示できることです。(✳︎無料で登録できます・利用するために提携が必要です)

✳︎「もしもアフィリエイト」は、AMP非対応です

リンクを2つ並べて「AMP有効」にしてみる

「AMP無効はいやだ!!絶対 有効にさせたい!!」というかたは、ちょっと強引ですがAMPで表示ができる別のリンクを付け足してください。

もしもアフィリエイトの「 かんたんリンク 」他に「 Amazonの商品テキストリンク」で同じリンク を作って並べて使います

もしもアフィリエイトの「かんたんリンク」はAMP非対応ですが、削除するともったいないので置いとくことにします。

「Amazonのテキストリンク」と、「かんたんリンク」を両方載せると以下の写真のようになります…若干しつこいように思いましたが、意外と大丈夫。

AMP表示のテストをすると、もしもアフィリエイトの「かんたんリンク」の部分が「リンク」の文字のみになって正しく表示されてません、でも「Amazonアソシエイトのテキストリンク」は問題なく表示されてますね。

「AMPテスト」で確認してみる

最後に、AMPテストで、リンクを並べたページが合格するか試してみます

一応、有効になりました。

どうしてもAMPを使いたい場合は、かなり強引ですが多分これで大丈夫だと思います。

Amazonアソシエイトのリンクと、もしもアフィリのリンクを一緒に並べて良いものなのか、不安なんですけど、他の記事でも混ぜて使ってるので恐らく大丈夫だと思います。

今回は以上です!

そして、後日メールが届きましたよ↓

後日の結果!

大丈夫でした!無事、修正されました!


 

こんにちはSHIROです。 大手アパレル勤務でたくさんの人と関わり後輩を育ててきた経験をもとに、職場の人間関係や仕事の悩みについて書いています。 ストレス解消方法はバスタイムに精油の香りで癒されることです。