こんにちは。すずきです。
「WordPressの固定ページに、子ページを表示させたい」
という悩みが最近ちょくちょくありました。
ページ数の多いサイトなどを作る際は、区分毎にまとめたページがあると見やすく、目的のページにも辿り着きやすいと思ったからです。
色々調べた結果、簡単に実装することができたので今回はその方法を紹介します。
「functions.php」への記述は必要なく、「page-○○.php」への記述のみで簡単に実装できます。
目次
子ページ一覧の表示方法
テンプレートファイルを用意する
まずは使用しているテーマ内に子ページ一覧を表示するためのファイルを作成します。
「page-○○.php」の形式であればなんでも大丈夫です。
自分は「page-parent.php」としています。
index.php
style.css
page-parent.php管理画面でテンプレート選択できるようにする。
ファイルを作成したら、1行目に下記のコードを記述します。
<?php
/*Template Name: 親ページテンプレート*/
?>これで、管理画面からテンプレートの選択ができるようになりました。
子ページ一覧を出力するコードを記述する。
子ページ一覧を出力するコードが以下になります。
<ul>
<?php
$parent_id = get_the_ID();
$args = array(
'posts_per_page' => -1,
'post_type' => 'page',
'orderby' => 'menu_order',
'order' => 'asc',
'post_parent' => $parent_id,
);
$common_pages = new WP_Query( $args );
if( $common_pages->have_posts() ):
while( $common_pages->have_posts() ): $common_pages->the_post();
?>
<li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php
endwhile;
wp_reset_postdata();
endif;
?>
</ul>出力結果
終わりに
固定ページに子ページ一覧を表示させる方法を紹介しました。
ページに紐づく子ページ一覧を表示しているので、親ページが複数あるサイトでもテンプレートを1つ作れば対応できます。
