WordPressの投稿一覧でPV数が多い投稿のデザインを変える方法

WordPressの投稿一覧をイジるのが好きなのですが、なんか記事をズラ~っと並べるだけだとつまんないので、PV数が多い投稿(例えば10万PV以上とか)だけデザインを変えるってのをやってみました。


投稿のPV数の取得

まずは投稿のPV数をカウント&取得します。これは僕がいつも愛用している「WordPress Popular Posts」というランキングプラグインを使用します。

WordPress Popular Posts

このプラグインを入れれば自動で投稿や固定ページ、設定すればカスタム投稿の閲覧数をカウントしてくれます。閲覧数を表示させるにはループの中に以下のコードを入れれば表示されます。

投稿一覧のループを改造

次に投稿一覧のループ部分を改造。まぁ改造といっても超簡単で、wpp_get_views()で記事の閲覧数を取ってきてif文で閲覧数が****数以上か?ってのを判別させるだけ。

こんな感じですね!僕のブログはPVが超少ないのでとりあえず100で(笑)

これをまた記事部分のhtml部分にこんな感じで組み込めば、閲覧数100以上の記事にover100というクラスが付くので、cssでbackground-colorをyellowにしてみました。

こんなんですね、で、これで記事一覧を開くと・・・

1

出来ました!これでPVが100以上の記事は黄色が付いて”人気記事だ”ってのが一目で分かりますね。

あとはまあelseifとか使って100以上、1000以上、100000以上みたいな感じで色分けしてもいいかも。コメント数とかイイネ数とかも取れる方法が有るっぽいから、そんなんでも分けてみたら面白いかもしれませんね!

いや〜やっぱ投稿一覧をイジるの楽しいわ〜