WordPressでブログ記事や商品一覧を表示する際、ユーザーにどの範囲のコンテンツが表示されているのかを明示するために「全◯件中◯件〜◯件目を表示」という形式で情報を出力する方法をご紹介します。
背景と目的
一覧ページでは通常、複数の記事や商品が表示されます。その中で、何件のコンテンツが存在し、現在は何件目から何件目を見ているのかを明示的に表示することで、訪問者の利便性が向上します。今回はその実装方法をステップごとに解説します。
必要な変数を設定する
まず、現在のページ番号と、1ページあたりに表示したい投稿数を取得します。これにはWordPressの get_query_var() 関数を使用します。
$paged = get_query_var('paged') ? get_query_var('paged') : 1;
$posts_per_page = get_query_var('posts_per_page');
このコードで、現在のページ番号が $paged に、1ページ当たりの表示投稿数が $posts_per_page にそれぞれ格納されます。
全投稿数を取得する
次に、WordPressのグローバル変数 $wp_query から、全投稿数を取得します。
global $wp_query;
$total_posts = $wp_query->found_posts;
$wp_query->found_posts には、現在のクエリにマッチする投稿の総数が格納されています。
表示中の投稿の開始番号と終了番号を計算する
続いて、表示中の投稿の開始番号と終了番号を計算します。
$start_num = (($paged - 1) * $posts_per_page) + 1;
$end_num = min($paged * $posts_per_page, $total_posts);
このコードでは、(ページ番号 – 1) * 1ページあたりの投稿数 + 1 で開始番号を、min(ページ番号 * 1ページあたりの投稿数, 総投稿数) で終了番号を計算しています。
「全◯件中◯件〜◯件目を表示」という形式で出力する
最後のステップです。計算した数値をもとに、実際に文字列として出力します。
echo "全" . $total_posts . "件中" . $start_num . "件〜" . $end_num . "件目を表示";
サンプルコード
上記のステップを組み合わせたサンプルコードが以下となります。
// グローバル変数 $wp_query を使用する
global $wp_query;
// 現在のページ番号を取得。paged変数が設定されていなければ1とする
$paged = get_query_var('paged') ? get_query_var('paged') : 1;
// 1ページに表示する投稿数を取得
$posts_per_page = get_query_var('posts_per_page');
// 現在のクエリでの総投稿数を取得
$total_posts = $wp_query->found_posts;
// 表示中の投稿の開始番号を計算
$start_num = (($paged - 1) * $posts_per_page) + 1;
// 表示中の投稿の終了番号を計算。総投稿数と現在のページでの最後の投稿番号の小さい方を取得
$end_num = min($paged * $posts_per_page, $total_posts);
// 「全◯件中◯件〜◯件目を表示」という形式で情報を出力
echo "全" . $total_posts . "件中" . $start_num . "件〜" . $end_num . "件目を表示";
これで、「全◯件中◯件〜◯件目を表示」という情報が出力されるようになります。このコードを、例えばテーマの archive.php や index.php のループの前や後に追加することで、訪問者にわかりやすく現在の表示範囲を知らせることができます。
まとめ
この記事では、WordPressで一覧ページに「全◯件中◯件〜◯件目を表示」というページネーションの情報を表示する方法をステップごとに解説しました。コードはシンプルで、テーマファイルに追加するだけで簡単に実装できます。ユーザーエクスペリエンスの向上に是非お役立てください。