AMPに対応しているページだけ、フォントカラーが変更されていないという事態が発生しました。
当ブログのモバイルページのサイドバーには「カスタムHTML」が挿入されてあるんですが、
仮にHTML内に下記のように記述すると、
<span style=”color: #ff0000;”>こんにちは</span>
↓
こんにちは
と、フォントの色が赤になりますが、このフォントカラー指定がAMP対応ページのみ反映されていないという状態です。
AMP対応ページだけフォントカラーが変更されない原因は？
当ブログではAMP対応ページとAMP非対応ページを使い分けているんですが、AMP対応ページのみフォントの色が変わりません。
どうやらAMP対応ページでは、「span style」を用いてカラーコードを変更した場合、不具合によって色の変更が反映されないことがあるようです。
原因は不明ですが・・・（苦笑）
そこでCSSでカラーを指定したところ、無事に直りました。
AMP対応ページでもフォントカラーを変更する方法
CSSに下記のようにコードを入力します。
.zzz {color: #ff0000;}
セレクタの「zzz」の箇所はご自身が覚えやすいような表記でOKです。
そしてHTML内の記述は下記の通り。
<span class=”zzz”>こんにちは</span>
上記のような方法で、AMP対応ページでもフォントカラーの変更を反映させることが可能です。
もちろんAMP非対応ページでもフォントカラーはきちんと変更されています。
さいごに
今回はAMP対応ページでフォントカラーが変更にならないときに解決方法についてお伝えしました。同じような現象が起こっている方は是非参考にしてみてください。
