Simplicityを2.4.1にバージョンアップしました。
主な変更点は以下。
- AMPページにアイコン追加
- 外部URLを利用した画像でもAMPエラーが出ないように仕様変更
- AMPページでスキンのamp.cssを読み込む処理追加
- アフィリエイトのインプレッション画像はdisplay: inline-block;に（詳細）
- ブログカードスタイルの調整
AMPページにアイコン追加
以前は、テキストで表示していた「カテゴリ」などを、Simplicityの通常投稿に合わせた、アイコンをSVGで追加しました。
これにより、AMPページでも以下のようなワンポイントアイコン表示がされるようになりました。
ちなみに、通常ページの「AMPロゴマーク」も変更しました。
以前は、Push7のロゴマークを流用していたのですが、AMPロゴに変更しました。
外部URLを利用した画像でもAMPエラーが出ないように仕様変更
以前は、AMPページでwidth・height属性のないIMGタグではAMPエラーが出ていたと思います。
けれど今バージョンから、AMPエラーが出ないように変更しました。
ただ、AMPエラーは出なくなりますが、width・height属性のないIMGタグは、自動的に幅と高さが300pxに設定されて以下のように表示される仕様になります。
これは、WEB制作に慣れていない方の場合は、AMPエラーを修正するのも大変と思い、とりあえず画像の表示は多少変わろうとも、「なるべくへAMPエラーの出にくいものにしよう」ということからです。
もし、意図通りのAMP画像表示にしたい場合は、自前で外部URLを呼び出しているIMGタグにwidth・height属性を指定してください。
AMPページでスキンのamp.cssを読み込む処理追加
スキンフォルダ内にamp.cssを作成すれば、AMPページでamp.cssで書かれたスタイルが読み込まれるように機能追加しました。
スキンなどで、AMPページの表示の変更したい場合は、amp.cssファイルを利用してください。スキンフォルダ内に、amp.cssがない場合は、無視されるので、利用しない場合はそのままでもOKです。
スキンの詳しい仕様は以下。
あとがき
今回の修正で、AMPページのエラーは、かなり出にくくなったのではないかと思います。
ただ、まだ、何かしらエラーが出たり、表示がおかしい場合は、フォーラムに該当ページのURLを掲載の上、ご報告いただければ、幸いです。
僕の環境では、もうAMPエラーは0なので、いろいろな使い方をされているブログの、いろいろなサンプルをいただければ、コードで吸収できそうなところは吸収して、エラーなし表示させたいと思います。
コメント
2.4.1リリースお疲れ様です!!
ついに外部画像も縦横サイズがつきましたね
これでAMPエラーがまた減りますね!!
2.4安定版でも書いたのですが
AMPにするかをさらに迷ってしまいました
広告ウィジェットが表示されない点とアクセス解析です
アクセス解析はプラグインを使っているので反映されない・・・(javascript)
広告はスマホとPCで分ける必要があるので広告ウィジェットを使っています(表示されないのをさっき知った・・・)
AMP有効化したいけどできない・・・
解決できれば有効化してみます
2.4.1リリースお疲れ様でした!!
ニュースサイトや、トレンド系のサイトでない限り、そこまでアクセスに影響しないかなとは個人的に思っています。
アクセス解析プラグインを使用していると、計測できないのはどうしようもないかもしれません（自前でタグを挿入するカスタマイズをするしか）。
広告ウィジェットで、広告を設定していたとしても、以下の方法で、表示だけはできると思うのですけどできないでしょうか？（ウィジェットでの細かな設定はできないけど）
SimplicityのAMPページに表示するアドセンスの設定方法
ニュースサイトや、トレンド系のサイトでない限り、そこまでアクセスに影響しないかなとは個人的に思っています。
そうなんですよね
正直AMPの情報量が少ないので
どうなるかが不安ではあります
もう少し待ってみたら良いかなとか思っています
さすがにSEOまで影響してくるとするしかないとは思いますが・・・
広告ウィジェットで、広告を設定していたとしても、以下の方法で、表示だけはできると思うのですけどできないでしょうか？（ウィジェットでの細かな設定はできないけど）
参考ページありがとうございます!!
勉強してみます!!
お世話になります。いつも便利に利用させていただいております。
バグ報告です。ヘッダー画像を表示しているときにAMP表示しますと、
ヘッダー画像のサイズが乱れます。
https://gyazo.com/d5f8be11194a53f2087abcf5442482b1
よろしくお願い致します。
サイトのソースをみると、httpsサイトなのに、ロゴ画像のURLがhttpで読み込まれています。
なので、ロゴ画像が外部サイトの画像として処理されています。
なので、テーマカスタマイザーから、ロゴ画像の再設定を行えば、画像のURLもhttpsとなり問題が解決するかと思います。
というか、今あらためてサイトを見てみたら、ロゴ画像がhttpsになっているようなので、自己解決したっぽい。
ただ、一応同様の問題が起こった方が、検索でこの書き込みを見ることがあるかもしれないので、解決方法を記しておきます。