WordPress

【WordPressワードプレス】一覧ページに「ページネーション」を表示する方法|Prime Strategy Navi

2021年1月9日

 

こんにちは、イケゾーです。

WordPressの記事一覧ページにおいて、「前のページ」「次のページ」などとページを分けて表示することがあります。

これをページネーションページャーと呼び、今ではほとんどのサイトで使われています。

今回は、ページネーションとは何か?から実際に設置するまでの手順を解説します。

 

この記事はこんな人におすすめ!

  • WordPressのページネーションって何?
  • WordPressのページネーションを設置したい

 

【WordPressワードプレス】一覧ページに「ページネーション」を表示する方法|Prime Strategy Navi

この記事では、ソースコードを実際に掲載して解説していきます。

 

ワードプレスおすすめ参考書
【WordPress(ワードプレス)初心者におすすめ本】「仕事の現場でサッと使える! デザイン教科書」のレビュー

続きを見る

当ブログでは、WordPressテーマ 「WING(AFFINGER5)」 を使用しています。

 

「ページネーション」とは

記事が多くなってきたとき、記事一覧ページで全件表示してしまうと見づらくなり、読み込み速度が低下してしまいます。そこで、ページを分けて表示する機能をページネーションと呼びます。

記事を複数のページに分けて表示する機能のことだね
イケゾー

 

記事一覧ページに「ページネーション」を表示する方法|Prime Strategy Navi

では、早速やっていきましょう。

 

この記事を読んでできること

  • 記事一覧ページにページネーションを設置します。

 

プラグイン「Prime Strategy Navi」を有効化する

管理画面から「Prime Strategy Navi」をインストールし、有効化してください。

手順が不安な方はこちらの記事をご確認ください。

初めての「プラグインのインストール」
【WordPress(ワードプレス)】プラグインのインストール方法|初心者向けに丁寧解説

続きを見る

プラグインの有効化ができたらテンプレートの編集をしよう
イケゾー

 

テンプレートを編集

次に、テンプレート「archive.php」を編集していきます。

front-page.php
<?php
if( function_exists ('page_navi')):
  page_navi();
endif;
?>

 

function_exists()

引数にしている関数が定義されているか確認するためのものです。プラグインが有効化されているかを確認します。

page_navi()

プラグインで定義されている関数です。この記述だけで、ページネーションが自動生成されます。

デフォルトでは、1ページあたり記事10件が表示されるようになっています。

記事が10件以下の場合は、ページネーションが表示されませんので、記事を増やしてご確認ください。

次は、記事の表示件数を設定しよう
イケゾー

 

1ページに表示する件数を指定する

1ページに表示する件数は、管理画面から「設定」▶︎「表示設定」▶︎「1ページに表示する最大投稿数」に入力して保存します。

 

ワードプレスおすすめ参考書
【WordPress(ワードプレス)初心者におすすめ本】「仕事の現場でサッと使える! デザイン教科書」のレビュー

続きを見る

まとめ

以上で、ページネーションの設置ができました。ユーザのためにも必須の機能ですね。

 

イケゾー
最後まで読んでいただき、ありがとうございました。
ご不明点やご意見は、コメントやTwitterにて、お寄せください 🙂
では、またお会いしましょう

  • この記事を書いた人

ikezooo

ご訪問ありがとうございます。 Ikezoooブログ「WEB積み上げ先生」を運営している30歳です。こちらでは、完全初心者からのプログラミング学習を発信しています。

-WordPress

© 2021 IkezoooBlog