【Simplicity】下部のページ送りの表示をWp Pagenaviプラグインと置き換える方法
【この記事の目次】－ 必要な部分だけ見たいときにどうぞ － [表示する]
Simplicityというテーマは実によくできていますね。本当に至れり尽くせりで有効化するだけで基本的なことは全て備わっているというのが使用させていただいている私の印象です。
ただ、どんなに良いテーマでも少し位はカスタマイズして独自のものにしたい！と思うのは当然のこと。
今回は一覧の一番下に表示されるページナビ（ページ送り）を他のプラグインを使った表示に切り替える方法です。
ページ送りを表示するプラグインで有名なものに「Wp Pagenavi」があります。たくさんページがある場合には１．２．３．４．５．１０．２０．３０・・・みたいに数字を省略して表示できるのが魅力のプラグインです。
ただ、これを導入要領通りに設定してもSimplicityでは表示が置き変わらず、また、表示できてもテーマで設定されている情報が優先されて「Wp Pagenavi」のオプションが適用されません。これを解消してきちんと表示する方法を紹介します。
Simplicityでページ送りの表示をWp Pagenaviプラグインと置き換える方法
置き換え作業の手順は
- 「Wp Pagenavi」プラグインをインストールする
- Simplicityの標準ページャーを非表示にする
- 「Wp Pagenavi」が表示されるようにする
になります。順を追って説明しますが、１はプラグインの追加で検索すれば出てくるのでインストールして有効化すれば終了です。
２と３は同じ部分をカスタマイズしますから同時に行うといいです。
- ダッシュボードから「外観」→「テーマの編集」をクリックします
- 子テーマを使っている場合はテーマを「Simplicity2」へ変更します
- 一覧から「list.php」をクリックします
- 以下のコードを削除します
- 以下のコードを追加します
- 変更を保存します
Simplicity標準のページャーを表示するコードです。テストではこれを削除しないと２重に表示されるばかりではなく、「Wp Pagenavi」のオプション設定もスキップされてしまいます。
<?php
////////////////////////////
//エントリーのページャー
////////////////////////////
if ( is_list_pager_type_responsive() ) {
//レスポンシブタイプのページャー関数の呼び出し
responsive_pagination();
} else {
//旧タイプのページャー
get_template_part('pager-paginate-links');
}
?>「Wp Pagenavi」を設置するためのPHPコードを先ほど削除した場所へ挿入します。言語の違いによる問題を解決するために
<?php wp_pagenavi( array( 'options' => PageNavi_Core::$options->get_defaults() ) ); ?>もしもSimplicityの標準ページャーと同じように中央表示したい場合は
<div align="center"><?php wp_pagenavi( array( 'options' => PageNavi_Core::$options->get_defaults() ) ); ?></div>これで設定は完了です。あとは「Wp Pagenavi」の設定で調整してくださいね。
気を付けること
きっちりテストしてませんが、Simplicityに搭載されているページャーはレスポンシブ対応なのですが、ひょっとすると「Wp Pagenavi」は対応しておらず、ページ幅に収まらないことがあるかもしれません。
ページャーそのものを変更するのではなく、標準で表示されるのは４ページ分と前後への矢印、これを少しだけカスタマイズしたい場合にはfunctions.phpの以下の記述を修正します。
かなり下のほうにありますから根気よく探してください
//レスポンシブなページネーションを作成する
if ( !function_exists( 'responsive_pagination' ) ):
function responsive_pagination($pages = '', $range = 4){
$showitems = ($range * 2)+1;
global $paged;
if(empty($paged)) $paged = 1;
//ページ情報の取得
if($pages == '') {
global $wp_query;
$pages = $wp_query->max_num_pages;
if(!$pages){
$pages = 1;
}
}
if(1 != $pages) {
echo '<ul class="pagination" role="menubar" aria-label="Pagination">';
//先頭へ
echo '<li class="first"><a href="'.get_pagenum_link(1).'"><span>First</span></a></li>';
//1つ戻る
echo '<li class="previous"><a href="'.get_pagenum_link($paged – 1).'"><span>Previous</span></a></li>';
//番号つきページ送りボタン
for ($i=1; $i <= $pages; $i++) {
if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) )) {
echo ($paged == $i)? '<li class="current"><a>'.$i.'</a></li>':'<li><a href="'.get_pagenum_link($i).'" class="inactive" >'.$i.'</a></li>';
}
}
//1つ進む
if ( $pages == $paged ) {
$next_page_num = $paged;
} else {
$next_page_num = $paged + 1;
}
echo '<li class="next"><a href="'.get_pagenum_link($next_page_num).'"><span>Next</span></a></li>';
//最後尾へ
echo '<li class="last"><a href="'.get_pagenum_link($pages).'"><span>Last</span></a></li>';
echo '</ul>';
}
}
endif;長いコードですが、コードの上の方にある「4」という数字が表示するページの数になっています。これを任意の数字に変更することで表示数が変更できます。
ついでに「次へ」「前へ」「先頭へ」「末尾へ」などの表示を行う記号も変更できますよ。
※functions.phpの編集に失敗すると一切の作業ができなくなりますから慎重に行ってくださいね。
いつでもご相談・サイトカスタマイズの依頼を受け付けています
Wordpressのカスタマイズ、不具合解消のご相談はすべてココナラのダイレクトメッセージからお受けしております。まずはこちらのバナーからお気軽にお問い合わせください。
※一度もココナラを使ったことがない方はココナラへの無料登録が必要です。こちら
から登録後、上のリンクをクリックする、またはココナラトップページから「ひまあーと」を検索してお問い合わせください。
【スポンサーリンク】
記事の拡散にご協力をお願いします
閲覧いただきありがとうございました。役に立つ情報でしたら是非SNSでシェアをお願いします