サイドバーにサムネイル付き人気記事一覧WordPress Popular Posts

WordPress Popular Posts

プラグインを利用して人気記事一覧をサイドバーに表示させる

プラグインを選ぶ上での注意点

最新記事や人気の記事一覧をサイドバーに表示させたい場合、ウィジェットでサムネイルつきで表示してくれるプラグインは探してみると、数は結構あります。

最新記事をアイキャッチ画像/サムネイル付きで表示させたい場合は、以下の記事にて紹介していますので、参考にしてみて下さい。

一方、投稿内で表示させるプラグインは、関連記事表示のものはそれなりにあるものの、最新記事、となると、数はそれほど見かけませんでした。

どちらにしても、選択する上での注意点としては、
生成されるimgタグにwidth、heightがあるものを選んだ方が良い、
ということ。

ココのところこのサイトのページ表示の高速化にはまり、いろいろ試行錯誤していたのですが、GoogleのPageSpeed Insightsで計測した際、画像でひっかかっているモノを見てみると、「width、heightがタグにない」という理由のもの、多数。

その中の5件が、サイドバーに表示させていた、Jetpackプラグインの人気投稿一覧のサムネイル画像。
確認したところ、Jetpackの人気投稿一覧プラグインにはimgタグにwidth、heightがありませんでした・・。

もちろん、速攻で変更!
少し調べて、後述のプラグインにしましたので、そのレポートです。

プラグインWordPress Popular Postsでサイドバーにサムネイル付人気記事一覧を表示

Jetpackの人気記事一覧プラグインの代わりに入れたのが、このプラグイン。

バズ部さんの

「WordPress Popular Posts で人気記事を表示する方法」http://bazubu.com/how-to-add-popular-posts-23487.html

を参考にさせていただきました!

アイキャッチ画像ではなく、投稿内の最初の画像をサムネイルとして表示させたかったので、Wordpress Popular Postの設定画面で、Pick image front を First image on post に変更しました。
Wordpress popular posts設定画面

サイドバーウィジェットでサムネイルのサイズを23x23pxに指定するなど、いろいろ設定をしますと、
Wordpress popular postsサイドバーウィジェットでの設定

サイドバーウィジェット上の表示は下のようになりました。Wordpress popular posts 表示

imgタグにも width、height がちゃんと入っています!
Wordpress Popular Posts imgタグ

PageSpeed Insights の”画像についての修正課題”から5件がなくなっていました♪

ではでは、お役に立てれば幸いです(^^)

Published:2015/02/08

Written by

サイドバーにサムネイル付き人気記事一覧WordPress Popular Posts」への1件のフィードバック

コメントを残す