wordpressでページネーションをさくっと実装する方法

カテゴリー︎: 【WordPress】

wordpressでページネーションをつける方法

今回は、 functions.php に記述するのではなく

single.php に直接記述する方法

single.php とはwordpressの仕様上、single.phpが存在すれば

投稿記事を表示することができる phpファイルである

single.php 内のページネーションを表示したい箇所に記述する

<div class="pagination">
<?php if(get_previous_post()): ?>
<span class="kiji"><?php previous_post_link('%link','前の記事', TRUE); ?></span>
<?php endif; ?>

<?php if(get_next_post()): ?>
<span class="kiji"><?php next_post_link('%link','次の記事', TRUE); ?></span>
<?php endif; ?>
</div><!-- pagination end -->

たったこれだけで

ページネーションを実装できる

次にcssで

ページネーションの子要素を両端に配置する設定

.pagination {
  width: 400px;
  margin: 0 auto;
  display: flex;/* 親要素をflex */
  justify-content: space-between;/* 子要素を両端に配置する */
}

上記のようにcssに

「display: flex;」

「justify-content: space-between;」

を指定することで

右側と左側に配置することができる

つまり

前の記事は左側寄せ

次の記事は右側寄せ

ということ

お試しあれ〜

PAGE TOP