0
Help us understand the problem. What are the problem?

More than 1 year has passed since last update.

posted at

【WordPress】個別ページの改ページページャーのデザインを変更する

個別記事ページ用のファイルsingle.php
改ページ(ページ区切り)を挿入し、そのページャーを表示するには
wp_link_pages()というWordpress関数を利用する。

<?php the_content(); ?>
<?php wp_link_pages(); ?>

手順

1.管理画面上で、改ページを挿入する
スクリーンショット 2021-08-17 22.11.38.png

2.この状態で表示すると
スクリーンショット 2021-08-17 22.15.37.png

3.このままだとデザインを変更する時に、やりづらいのでphpでclassやタグを挿入する。

<?php
  $args = array(
    'before' => '<div class="pager">',
    'after' => '</div>',
    'link_before' => '<span>',
    'link_after' => '</span>'
  );
  wp_link_pages($args);
?>

4.そうすると下のようなHTMLが出力される
html
<div class="pager">
<span class="post-page-numbers current" aria-current="page">
<span>1</span>
</span>
<a href="http://sample/2/" class="post-page-numbers">
<span>2</span>
</a>
</div>

5.これでクラスやタグに合わせてCSSで装飾しやすくなる

Register as a new user and use Qiita more conveniently

  1. You can follow users and tags
  2. you can stock useful information
  3. You can make editorial suggestions for articles
What you can do with signing up
0
Help us understand the problem. What are the problem?