コメント機能の複数ページ用ページネーションを実装（the_comments_pagination）

WP4.4以降のコメント機能の複数ページ用ページネーションthe_comments_pagination()の使い方

設定

設定＞ディスカッション＞他のコメント設定をこのようにして、10ページ中5ページ目を表示して検証しています。
1ページあたり50件のコメントを含む複数ページに分割し、最後のページをデフォルトで表示する
古いコメントを各ページのトップに表示する

仕様

コメント用のページネーション関数であるthe_comments_pagination()は内部的にpaginate_comments_links()を利用しているため両方の引数が使えます。

<?php the_comments_pagination( $args ); ?>

パラメータ	初期値	仕様
screen_reader_text	Comments navigation （JP：コメントナビゲーション）	スクリーンリーダー用テキスト

他は、paginate_comments_links()と同様です。
※表示は利用言語によって異なる。日本語は（JP:）

仕様のまとめ

paginate_comments_links()とpaginate_links()の仕様のまとめ
これに上記の、screen_reader_textが加わります。

パラメータ	初期値	説明
base	add_query_arg( ‘cpage’, ‘%#%’ )
format	（空）	ページネーションの構造を指定
total	$max_page	全体のページ数
current	$page	現在のページ番号
echo	true
show_all	false	true の場合、すべてのページ番号を表示 false の場合、現在のページ付近のページ番号の短いリスト。’end_size’ と ‘mid_size’ 引数でコントロール
end_size	1	ページ番号のリストの両端（最初と最後）にいくつの数字を表示するか指定
mid_size	2	現在のページの両側にいくつの数字を表示するか。ただし現在のページは含みません。
prev_next	true	「前へ」「次へ」のリンクを含むかどうか。
prev_text	__(‘« Previous’)	前のページへのリンクとして表示する文字列（’prev_next’ 引数が trueの場合）
next_text	__(‘Next »’)	次ページへのリンクとして表示する文字列（’prev_next’ 引数が trueの場合）
type	plain	戻り値の形式をコントロール ‘plain’ – 改行文字によって区切られたリンクの文字列を返します。 ‘array’ – 表示を完全にコントロールできるようにページ送りのリンクを配列に入れて返します。 ‘list’ – HTMLの ul タグを使ったリストを返します。
add_args	false	追加のクエリ引数の配列
add_fragment	comments	それぞれのリンクに付け加える文字列
before_page_number	（なし）	ページ番号の直前に付け加える文字列
after_page_number	（なし）	ページ番号の直後に付け加える文字列

初期値

<?php
	the_posts_pagination( array(
		'base'               => add_query_arg( 'cpage', '%#%' ),
		'format'             => ,
		'total'              => $max_page,
		'current'            => $page,
		'show_all'           => true,
		'end_size'           => 1,
		'mid_size'           => 1,
		'prev_next'          => true,
		'prev_text'          => __( '« Previous', 'textdomain' ),
		'next_text'          => __( 'Next »', 'textdomain' ),
		'screen_reader_text' => __( 'Comments navigation', 'textdomain' ),
		'type'               => 'plain',
		'add_args'           => false,
		'add_fragment'       => '#comments',
		'before_page_number' => '',
		'after_page_number'  => '',
	) );
?>

get_the_comments_pagination()も同様ですが出力しないため、echoが必要になります

標準のコードと出力されるHTML

<?php the_comments_pagination(); ?>

全10ページの5ページ目をみてる時のソース

<nav class="navigation comments-pagination" role="navigation">
	<h2 class="screen-reader-text">コメントナビゲーション</h2>
	<div class="nav-links">
		<a class="prev page-numbers" href="https://example.com/category-name/post-slug/comment-page-4/#comments">« 前へ</a>
		<a class="page-numbers" href="https://example.com/category-name/post-slug/comment-page-1/#comments">1</a>
		<span class="page-numbers dots">…</span>
		<a class="page-numbers" href="https://example.com/category-name/post-slug/comment-page-3/#comments">3</a>
		<a class="page-numbers" href="https://example.com/category-name/post-slug/comment-page-4/#comments">4</a>
		<span aria-current="page" class="page-numbers current">5</span>
		<a class="page-numbers" href="https://example.com/category-name/post-slug/comment-page-6/#comments">6</a>
		<a class="page-numbers" href="https://example.com/category-name/post-slug/comment-page-7/#comments">7</a>
		<span class="page-numbers dots">…</span>
		<a class="page-numbers" href="https://example.com/category-name/post-slug/comment-page-10/#comments">10</a>
		<a class="next page-numbers" href="https://example.com/category-name/post-slug/comment-page-6/#comments">次へ »</a>
	</div>
</nav>

装飾用CSSクラス

.comments-pagination {}
.comments-pagination .nav-links {}
.comments-pagination .nav-links .page-numbers {}
.comments-pagination .nav-links .current {}
.comments-pagination .nav-links .dots {}
.comments-pagination .nav-links a.page-numbers {}
.comments-pagination .nav-links a.page-numbers:hover {}
.comments-pagination .nav-links a.prev.page-numbers,
.comments-pagination .nav-links a.next.page-numbers {}
.comments-pagination .nav-links a.prev.page-numbers:hover ,
.comments-pagination .nav-links a.next.page-numbers:hover {}

.navigation / .screen-reader-text / .nav-links これらのクラスは、他でも使われているため、単独で指定するより継承された方が良い。

Codex

WP4.4まではthe_post_navigation()が使われていました

コメント機能の前後ページ用ページネーションを実装（the_comments_navigation）

設定

仕様

仕様のまとめ

初期値

標準のコードと出力されるHTML

装飾用CSSクラス

Codex

WP4.4まではthe_post_navigation()が使われていました

#タグ