WordPress 人気記事ランキングを表示する

WordPress で人気の記事をランキング表示してくるプラグイン「WordPress Popular Posts」。

今日はこちらの概要と表示のカスマイズ方法をご紹介します。

WordPress Popular Posts のインストール
ウィジェットの設定
表示のカスタマイズ

WordPress Popular Posts のインストール

まずは WordPress Popular Posts をインストールしていきます。

プラグイン＞新規追加から、検索窓で「WordPress Popular Posts」と入力します。

検索結果から「WordPress Popular Posts」をインストールします。

ウィジェットの設定

WordPress Popular Posts を有効化したら
外観＞ウィジェットから「+（ブロックを追加）」をクリックすると「WordPress Popular Posts」が追加できるようになります。

表示のカスタマイズ

functions.phpに下記のように記述してサイトデザインに合うように表示をカスタマイズすることができます。

function my_wpp_custom_html($mostpopular, $instance)
{
foreach ($mostpopular as $popular) {
// リンクを取得
$output .= '<div class="blog-item"><a href="' . get_the_permalink($popular->id) . '">';
        // アイキャッチ画像・日付・タイトルを取得
        $output .=
        '<div class="blog-item-img">' . get_the_post_thumbnail($popular->id, 'full') . '</div>' .
        '<div class="blog-item-txt">' .
            '<div class="date">' . get_the_time('Y.m.d', $popular->id) . '</div>' .
            '<h4 class="postttl">' . esc_html($popular->title) . '</h4>' .
            '</div>';
        // フィールド名「info-field」のカスタムフィールドの値を取得
        $output .= '</a></div>';
}
return $output;
}
add_filter('wpp_custom_html', 'my_wpp_custom_html', 10, 2);