WordPress

【WordPress(ワードプレス)】子ページの情報を取得(post_parent)して表示するサブクエリ|コード公開

 

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

サブクエリとは何か
【WordPress(ワードプレス)】メインクエリとサブクエリとは?初心者向け解説

続きを見る

先日アップした記事「サブクエリとは何か」に、具体例を追加して解説をしていきます。こちらの記事では、「カテゴリを指定して最新記事を取得して表示する」方法を解説しました。

今回は、「固定ページに、その子ページの情報を取得して表示する」方法を解説します。

 

【WordPress(ワードプレス)】子ページの情報を取得(post_parent)して表示するサブクエリ

この記事では、サブクエリの具体例と使い方を解説しています。

 

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

  • WordPressの「サブクエリ」ってなに
  • サブクエリの具体例を知りたい
  • 子ページの情報を取得するサブクエリの作成方法を知りたい

 

 

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

続きを見る

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

 

 

WordPressのサブクエリとは

サブクエリとは、メインクエリ以外のクエリのことです。

メインクエリはURLによって自動で投稿データを取得するモノですが、他の投稿データを取得したい場合もあります。他の投稿データを取得したい場合は、サブクエリを自分で発行する必要があります。

詳しくはこちら
【WordPress(ワードプレス)】メインクエリとサブクエリとは?初心者向け解説

続きを見る

 

子ページの情報を取得(post_parent)して表示するサブクエリ

まずは、完成版ソースコードを見てみましょう。コードの右に「一言コメント」を入れているので、なんとなくわかるだけでOKです。

その次に解説をじっくり読んで、もう一度ソースコードを見ると、一連の流れが理解できます。

 

完成版ソースコード

page.php
$parent_id = get_the_ID();// 記事のIDを取得する


$args = array(
  
'posts_per_page' => -1,// 取得したい記事数(全件取得)
  
'post_type' => 'page',// 取得したい投稿タイプ(固定ページ)
  
'orderby' => 'menu_order',// 取得する順番(固定ページの並び順)
  
'order' => 'ASC',// 並び替え(昇順)
  
'post_parent' => $parent_id,// 親ページのIDを指定して、その子ページの情報を取得
);


$my_query = new WP_Query( $args );



<?php

if ( $my_query->;have_posts()):
	
while ( $my_query->;have_posts() ): $my_query->;the_post();
		
the_title();// タイトルを表示
		
the_content();// 本文を表示
	
endwhile;

endif;

wp_reset_postdata();

?>

 

 

ソースコード解説

ではコードを解説していきます。

 

'posts_per_page' => -1

取得したい記事数を指定します。上記の例の-1は、全件取得するという意味になります。

'post_type' => 'page'

取得したい投稿タイプを指定します。「page」は固定ページ、「post」は投稿ページになります。

'orderby' => 'menu_order'

取得した情報を並び替えるときに、何をもとに並び替えるかを指定します。
'menu_order'は固定ページ編集画面で設定した「並び順」をもとに並び替えます。

'order' => 'ASC'

'orderby'で指定した情報をもとに、昇順'ASC' / 降順'DESC'で並べ替えるかを指定します。

'post_parent' => '$parent_id'

表示したい子ページが紐づく親ページの記事IDを指定すると、その親ページに紐づく子ページの情報を取得できます。

$my_query = new WP_Query( $args );

サブクエリの作成と発行をします。

ループ部分

WordPressお決まりの記述です。(>>詳しくはこちら)

wp_reset_postdata()

サブクエリ実行した後、メインクエリに戻すときに必要な記述です。

 

 

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

続きを見る

 

【応用】関数化してリファクタリング

これまでで必要な機能は実装できましたが、あと一歩頑張りましょう。

作成したソースコードを見てみると、テンプレート内にサブクエリの記述が長くなってしまい視認性が悪いですね。

一連のコードをfunctions.phpに関数化して、テンプレートの記述をスッキリさせましょう。関数化することで、同じ処理を別のテンプレートでも共通して使用することができます。

 

リファクタリング前

page.php
$parent_id = get_the_ID();// 記事のIDを取得する


$args = array(
  
'posts_per_page' => -1,// 取得したい記事数(全件取得)
  
'post_type' => 'page',// 取得したい投稿タイプ(固定ページ)
 
 'orderby' => 'menu_order',// 取得する順番(固定ページの並び順)
 
 'order' => 'ASC',// 並び替え(昇順)
  
'post_parent' => $parent_id,// 親ページのIDを指定して、その子ページの情報を取得
);

$
my_query = new WP_Query( $args );




<?php

if ( $my_query->;have_posts()):
	
while ( $my_query->;have_posts() ): $my_query->;the_post();
		
the_title();// タイトルを表示
		
the_content();// 本文を表示
	
endwhile;

endif;

wp_reset_postdata();

?>

 

 

リファクタリング後

子ページを取得する関数を「functions.php」に移行して、出力部分は新規作成した「content-common.php」に移します。

 

functions.php
function get_child_pages( $number = -1 ){

$parent_id = get_the_ID();

	
$args = array(
	  
'posts_per_page' => $number,
	  
'post_type' => 'page',
	  
'orderby' => 'menu_order',
	  
'order' => 'ASC',
	 
 'post_parent' => $parent_id,
	
);

	
$child_pages = new WP_Query( $args );
	
return $child_pages;

}

 

page.php
<?php

$common_pages = get_child_pages();

if ( $common_pages->have_posts()):
  
while( $common_pages->have_posts() ): $common_pages->the_post();
    
get_template_part( 'content-common' );
  
endwhile;

wp_reset_postdata();

endif;

?>

 

 

content-common.php
the_title();// タイトルを表示

the_content();// 本文を表示

 

 

まとめ

 

 

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

  • この記事を書いた人

ikezooo

愛知県30歳のフリーランスエンジニア。 サイト制作とブログで生き抜く。 ブログでは、月10〜15万ほど稼いでいます。 SEO検定3級保有。

-WordPress