ページネーションには下記の物があり、特徴は下記になります。
タイプ | 見た目 | 動作概要 | 向いている場所 |
PHPタイプ | ページの先頭から書き直す為、画面が変わる | phpプログラムの為、ページネーション操作のたびにサーバから新しいページを読み込む | カテゴリ、検索結果等のリスト系ページ |
Jqueryタイプ | その場所でページ内容が変わる為、見やすい | 総てのデータをクライアントに送り、Jqueryで何を表示するか?のページ制御を行う。
サーバは見に行かない。 |
投稿、カスタム投稿、固定ページ |
ここでは「phpタイプ」を投稿等で使った場合に発生する問題の解決方法を解説します。
カテゴリページ(category.php)や検索結果ページ(search.php)等のリスト系ページでは、初めから複数投稿が表示される事が前提で作られています。よって「PHPタイプ」を設定するだけで、ページ送りを実現する事ができます。
一方、投稿ページ(single.php)、固定ページ(page.php)及びカスタム投稿(single-××.php)ではメインQueryは1つのコンテンツを表示する前提で作られています。
よって、これらのページにWp_Queryで新たにリストを抽出し、PHPタイプでページネーションを行う為には下記の追加設定が必要になります。
2.Wp_Query生成時にどのページを表示させるのか?を指定する。
以上の具体的な設定方法を下記に解説します。
1.ページ送り機能をONにする
例えばこのサイトのsynologyカテゴリを表示して、ページネーション結果のURL変化を見て下さい。
■1ページ目:https://nw.t-spirits.com/category/synology/
■2ページ目:https://nw.t-spirits.com/category/synology/page/2/
■3ページ目:https://nw.t-spirits.com/category/synology/page/3/
そうです。URLがページ毎に切り替わっていますネ。
しかし投稿、固定、カスタム投稿ページでは、この様なURLの切替えをやらないという設定になっています。
そこで、まずはこの設定を変更する必要があります。
functions.phpに下記を記述します。
/* 投稿ページにページネーションを入れる為の設定 */ function my_redirect($redirect_url){ if(is_single()){$redirect_url = false;} else{return $redirect_url;} } add_filter('redirect_canonical','my_redirect');
■関数名「my_redirect」は任意名称です。
■上記は「is_single()」の時は、「$redirect_url」を「false」にする事により、ページ送りを可能にさせています。
■どのページをページ送りを可能にするか?は下記の判定関数で指定して下さい。
判定関数 | 解説 |
is_single() | 投稿ページ |
is_page() | 固定ページ |
is_singular(‘××’) | ××というカスタム投稿 |
以上で機能はONになったのですが、Wp_Queryでリストを生成する時に、nページ目を表示しなさいという設定が必要になります。
2.Wp_Query生成時にどのページを表示させるのか?を指定する
下記サンプルは
■現在の投稿と同じカテゴリの投稿リストを取得
■現在の投稿は表示しない
■表示順番はid順
■1ページに10個表示し、ページ送りを可能にする
という表示リストを抽出します。
<?php $cat_slug = get_the_category()[0] -> slug; ?>
<? php $paged = ( get_query_var('page') ) ? get_query_var('page') : 1; ?>
<?php $args = array(
'category_name' => $cat_slug,
'post__not_in' => array(get_the_ID()),
'orderby' => 'id',
'posts_per_page' => 10,
'paged' => $paged, );
?>
<?php $my_query = new WP_Query( $args );?>
上記の「$paged = ( get_query_var(‘page’) ) ? get_query_var(‘page’) : 1;」は下記の動作を行います。
「get_query_var()」は現在のページを呼び出す関数で、これが設定されてない場合は1を$pagedにセットします。
よって始めは1が入り、nページ目はnが入ります。
この値をWP_Queryのパラメータ「 ‘paged’」にセットします。
3.具体的なプログラム例
具体的なプログラムサンプルは下記になります。
<!-- 投稿コンテンツの表示プログラム部分は省略します -->
<?php $cat_slug = get_the_category()[0] -> slug; ?> <!-- 現在の投稿のカテゴリを抽出 -->
<?php $paged = ( get_query_var('page') ) ? get_query_var('page') : 1; ?> <!-- 現在のページ番号を抽出 -->
<?php $args = array( /* リストの生成条件の設定 */
'category_name' => $cat_slug,
'post__not_in' => array(get_the_ID()),
'orderby' => 'id',
'posts_per_page' => 10,
'paged' => $paged, );
?>
<?php $my_query = new WP_Query( $args );?> <!-- 表示リストの取得 -->
<?php my_pagenavi($my_query);?> <!-- ページナネーションをCALL -->
<?php if($my_query->have_posts()):?>
<?php while ($my_query->have_posts()):$my_query->the_post(); ?>
<!--サブループの中の処理-->
<?php endwhile;?>
<?php endif; ?>
<?php wp_reset_postdata(); ?> <!-- 必ずQueryをリセットします-->
以上で投稿ページの下にページネーションができる関連投稿一覧が表示されるようになりました。