PR

AMP タグ「style amp-custom」の CSS 構文エラーの修正の方法

AMPタグ「style amp-custom」CSS構文エラー WordPress
記事内に広告が含まれています。

AMPタグ「style amp-custom」の CSS 構文エラーと、またまたサチコ先生からのメール。

CSS構文エラーって、今までに何回も修正したはずなのに、同じようなエラーを指摘されました。

AMPの問題って、修正してもあとからでてくるので、イタチごっこというような感覚です。

凹まずに頑張っていきましょう。

 

この記事では、

AMPタグ「style amp-custom」の CSS 構文エラーの修正の方法について解説していきます。

 

CSS構文エラーで修正の方法を探している人の参考になると嬉しいです。

 

スポンサーリンク

AMPタグ「style amp-custom」の CSS 構文エラーの原因を探す

早速エラーの原因を探してみました。

まずはサーチコンソールの画面から、原因を探ってみましょう。

CSS構文エラー

 

 

URLをクリックすると、右画面にエラーが出ている箇所がピンクで表示されます。

 

でも、見にくい・・・。

そこで、AMP Validatorで調べてみました。

AMP

 

原因の箇所がひと目で分かります。

79行目の@importが原因のようです。

また、このエラーの箇所の前後を見てみるとgoogleのフォントなど文字に関する記述があります。

目次をカスタマイズするときにCSSを書き換えたのが原因ではないかと考えました。

そこで、wp管理画面から外観→カスタマイズ→追加CSSを確認してみました。

 

すると、

toc

 

となっていました。

やっぱり原因はこれだったんだと革新できました。

そこで、@importを削除しました。

@importだけ削除したら、エラーが出たので、赤で囲っている部分をすべて削除しました。

それが下の画像です。

 

toc cxss

 

AMP Validatorで修正を確認

サチコ先生にエラーだよと言われたURLをすべてAMP Validatorで確認しました。

さっきエラーが出ていた79行目を見てみると、

AMP Validatorでエラーの確認

エラーがなくPASSと表示されていました。

 

サーチコンソールの画面の修正を検証をクリックすると、検証が開始されました。

AMPエラー

あとは結果を待つだけです。

 

AMP問題の修正

検証が開始されてから4日後、「AMP問題が修正されました」というメールが届きました。

AMPエラー 修正

安心できました。

AMPタグ「style amp-custom」CSS構文エラーの修正:まとめ

AMPタグって、本当に難しいですね?

この記事では、AMP タグ「style amp-custom」の CSS 構文エラーの修正の方法を解説してきました。

私のブログでは、@importがエラーになっていましたが、AMPのCSS 構文エラーは、他にもいろんなエラーがあります。

 

一つ一つ対応していくしか方法はありません。

原因を突き止めるのに一日かかることもあります。

凹まずに、頑張っていきましょうね。

 

 

 

error: Content is protected !!