【WordPress】WordPress Popular Postsでのランキングを任意の場所に表示させる方法とは？？

　WordPressのプラグインで、記事のランキングを表示してくれるプラグインとして有名なのは「WordPress Popular Posts」だと思います。

基本的にこのプラグインは、ウィジェットに追加項目ができるので、そこから追加していく…という感じになりますが、このランキングを任意の場所に表示させることができる…というのをご存知でしょうか。

そこで今回は、WordPress Popular Postsでのランキングを任意の場所に表示させる方法についてご紹介したいと思います！

WordPress Popular Postsでのランキングを表示させるコード

　WordPress Popular Postsでのランキングを表示させるには、以下のPHPコードを記述することで可能になります。

<?php
	if ( function_exists( 'wpp_get_mostpopular' ) ) wpp_get_mostpopular();
?>

こちらでとりあえずはランキングを表示させることができます。
ただ、これだとカスタマイズはできないので、今回はランキングのカスタマイズができる記述方法について紹介していきます！

見本コード

試しに以下のように設定してみました。

<?php
	$wpp = array (
	'range' => 'weekly',
	'limit' => 5,
	'post_type' => 'post',
	'stats_views' => '1',
	'thumbnail_width' => '100',
	'thumbnail_height' => '100',
	'wpp_start' => '<ul>',
	'wpp_end' => '</ul>',
	'post_html' => '<li>{thumb}<div>{stats}{title}</div></li>',
); ?>

このコードで設定したものは、

<?php wpp_get_mostpopular($wpp); ?>

上記のコードで表示させることができます。
設定コードの2行目にある$wppで紐づけされている…ということですね！

今回は上記の見本コードを元に解説していきたいと思います。

集計期間を設定

　まずランキングの集計期間を設定します。
見本コードでいう3行目の
‘range’ => ‘daily’
この部分が設定箇所になります。

ここに
・daily(日ごと)
・weekly(週ごと)
・monthly(月ごと)
・all(全日)
の中か表示させたいものを当てはめる…といった感じです！

表示件数を設定

　続いてランキングの表示件数を設定する値についてですが、見本コードの4行目にある
‘limit’ => 5
こちらが表示件数を設定する箇所になります。
ここの数値を変更することで、表示件数を変えることができます！

例えば、ランキングを10件表示したい場合は
‘limit’ => 10
とすることで10件表示させることができる…ということですね。

投稿もしくは固定ページのどちらを集計するか設定

　続いて5行目にある
‘post_type’ => ‘post’
こちらで投稿もしくは固定ページのどちらを集計するか設定するか設定しています。
投稿のみの場合はpostを、固定ページの場合はpageを、投稿・固定ページ両方を集計させる場合はpost,pageとすることで設定可能です！

閲覧数を表示

　もし閲覧数をランキングに表示させたい場合は、見本コード6行目で設定してある
‘stats_views’ => ‘1’
こちらの値を1にしておきましょう。

もし閲覧数を表示させたくない場合は上の数値を0とすることで閲覧数を非表示にすることができます。

サムネイル画像の大きさを設定

　ランキングに表示させるサムネイル画像の大きさを設定するには、7～8行目にある
‘thumbnail_width’ => ‘100’,
‘thumbnail_height’ => ‘100’,
こちらの数値を変更することで可能になります。

今回は100px × 100pxで表示させる設定で上記のように記述しました。

ランキングのリストの設定

　もしランキングにCSSを設定したい場合などの時に使えるのが、見本コード9～10行目に記述してある
‘wpp_start’ => ‘<ul>’,
‘wpp_end’ => ‘</ul>’,
こちらの設定。

これで、ランキングのリストの開始タグと終了タグをそれぞれ設定しているのですが、CSSを設定したい場合は開始タグの<ul>に対してidかclassを設定しておけばよい…ということですね(^^)

ランキングの表示スタイルを設定

　最後にランキングの表示スタイルの設定。
こちらは11行目に書かれている
‘post_html’ => ‘<li>{thumb}<div>{stats}{title}</div></li>’,
こちらで設定しています。

ここでサムネイル画像・閲覧数・タイトルの表示方法を好きなようにカスタマイズすることができます！

例えばサムネイル画像を表示させたくないな…なんて時には
‘post_html’ => ‘<li>{stats}{title}</li>’,
上のように{thumb}を記述しなければOK…という具合ですね。

まとめ

　以上がWordPress Popular Postsを好きなところに表示させるためのコードおよびランキング表示のカスタマイズ方法でした！

今回紹介したコードを応用すれば、週ごとや月ごとのランキングをタブで切り分けて表示させる…なんてこともできたりするので、ご自身の理想にあった形で実装してみてはいかがでしょうかo(^^)o