WordPressの基本構造の概念図

WordPressの基本の理解で最も重要なことは、構造の理解です。理解するためには、図で示すことが最も近道です。
WordPressは、クエリーとループから成り立っています。

クエリー:データの検索
ループ:データの表示

WordPressの入門時に一番初めに理解すべきことは、メインクエリーとメインループですが、メインクエリーは「WordPressコア」と呼ばれる基本部分に包含されていて、通常はカスタマイズできないということです。(メインクエリーをカスタマイズするには、「フック」という特別なカスタマイズ方法を用います。)

WordPressの基本構造の概念図

WordPressのカスタマイズを理解の第一歩は、テーマの中にあるメインループを見つけ出し、ループの中の記述を自分の好みに合うようにカスタマイズし、実感をつかむことです。

<?php 
if ( have_posts() ) {
	while ( have_posts() ) {
		the_post(); 
		//
		// この部分が記述(カスタマイズ)部分
		//
	} // end while
} // end if
?>

上記のコードのif ( have_posts() )から} // end ifまでがメインループの記述で、その内側の部分がカスタマイズ部分で、ここに、たとえば、the_title();と書けば、投稿のタイトルが表示され、the_content();と書けば、投稿の本文が表示されるわけです。

<?php 
if ( have_posts() ) {
	while ( have_posts() ) {
		the_post(); 
		//記述(カスタマイズ)部分
          the_title();
          the_content();
		//
	} // end while
} // end if
?>

もう一つ重要なポイントは、このメインループが実行される手前の段階で、「WordPressコア」の中のメインクエリーが、既に実行を完了しており、その結果がオブジェクトと呼ばれるデータの塊に保持されているということです。この塊から具体的なデータを抜き出す命令が、the_title();the_content();です。このとき、データは複数件あるので、これをメインループで回して表示しています。

WordPressのカスタマイズで頻繁に出てくるサブループについては、上記の概念図に併記すると理解が深まります。
メインクエリーが「WordPressコア」の中にあって、自動的に実行されるものであるのに対し、サブクエリーは、自分でコードを書く(カスタマイズする)ことが必要ですが、行っている処理は、メインクエリーと同じです。(両方ともWP_Queryが実行されている同じ処理。)

サブクエリーの結果は、オブジェクトに出力され、それを表示するのがサブループです。メインループとサブループの書き方は、ほぼ同じです。

上記の概念図では、左から右へ「クエリー」「ループ」「表示」と情報が転送され、全体としては、上から下へ「メイン」「サブ」と処理が進んでいくことを図示しています。

親子サブクエリーのカスタマイズ事例 先祖・子孫の表示。

カスタム投稿タイプの先祖の表示。

前回※1 「投稿のカスタムフィールドに関連付けられた投稿の表示」で、ブログ記事に文献の情報を関連付ける事例を紹介しました。(実際の画面サンプルはこちらです。)

この例では、「第八章 月島の商業」が関連付けられていますが、この上の階層である「第三編 明治以降の月島」と最上位階層である書籍名の「月島発展史」を併せて表示しています。

カスタム投稿タイプ「参考文献」は、親子関係を持った木(ツリー)構造になっていて、最初に関連付けされた「第八章 月島の商業」をキーに、祖先(父母→祖父母)の階層を表示しています。

リスト37639は、カスタム投稿タイプの祖先を表示するコードです。

カスタム投稿タイプの子孫の表示。

カスタム投稿タイプ「参考文献」の全体を一覧表示する場合は、階層のトップのIDを指定し、それをキーに子孫の階層を上から順番に検索して表示します。(実際の画面サンプルはこちらです。)

リスト37639は、投稿の子孫を表示するコードです。WordPressのテンプレートタグ「get posts」を使って子孫を検索しています。 

タクソノミーの祖先と子孫の表示

木(ツリー)構造を持つタクソノミーの全体を表示する事例を紹介します。(実際の画面サンプルはこちらです。)

たとえば「中央区」を選択した場合、祖先に東京都、子孫に月島3丁目があります。これらの表示をクリックするとどちらにでも移動できるようにすると便利です。また、自分が現在どの階層にいるかも解りやすくなります。

リスト36732は、タクソノミーの祖先と子孫の両方を表示する事例です。現世代の「中央区」を指定すると、まずその先祖を表示し、次に子孫を表示します。

コード例

リスト37639 カスタム投稿の先祖を表示

呼び出す側

$par2->gen_id = '18661';
$par2->post_type = 'reference' ;
$user = new Model37639() ;
    $user->generation($par2) ;

呼び出される側(クラス)

class Model37639 extends WP_Query
{
	public function generation($par2)
	{
		$ance = array() ;
		$ance = get_ancestors($par2->gen_id, $par2->post_type) ;
		//$cnt = count($ance);
		$ance = array_reverse($ance) ;
		$k = 0 ;
		While ( !empty($ance[$k])) {
			$par2->id = $ance[$k] ;
			$par2->k = $k  ;
			$View_obj = new View37639a($par2) ;
			$k = $k +1 ;
		}//endwhile
	}//endfunction

}//endclass

class View37639a
{
	public function __construct($par2)
	{
		$postslist = get_post($par2->id) ;
 		setup_postdata($postslist);
		echo $postslist->post_title."<br>\n" ;
		
	}//endfunction
}//endclass

リスト37639 の実行結果


ID: 18661
先祖
k=0 18444月島発展史
k=1 18665第三編 明治以後の月島
現世代
k=2 18661第八章 月島の商業

リスト37642 カスタム投稿の子孫を表示

呼び出す側

$par2->gen_id = '18444';
$par2->post_type = 'reference' ;
echo "<br>\n".'ID: '.$par2->gen_id."<br>\n" ;
$user = new Model37642() ;
    $user->generation($par2) ;

呼び出される側(クラス)

class Model37642 extends WP_Query
{
	public function __construct()
	{
//コンストラクタは、なぜ今回使わないのか。
	}//endfunction
	
	public function generation($par2)
	{

//現世代を表示
		echo '現世代'."<br>\n" ;
		$par2->id = $par2->gen_id ;
		$par2->k = 0 ;
		$View_obj = new View37642a($par2) ;
		
//子孫を表示
		echo '子孫'."<br>\n" ;
		$this->children($par2) ;		
	}
	
	public function children($par2)
	{
//抽出処理
		$k = $par2->k ;	
		$args = array(
			'post_type' => $par2->post_type ,			
			'post_parent' => $par2->id ,
			'orderby' => 'menu_order',
			'order'   => 'ASC',
		);
		$the_query = get_posts($args) ;
		if(empty($the_query)){
			return ;
		}
//ループ処理
		$k = $k +1 ;
		foreach($the_query as $query){
			$par2->id = $query->ID ;
			$par2->k = $k ;			
			$View_obj = new View37642a($par2) ;
			$this->children($par2) ;//再帰処理。
		}
		
	}//endfunction
}//endclass

class View37642a
{
	public function __construct($par2)
	{
		$postslist = get_post($par2->id) ;
 		setup_postdata($postslist);
		echo 'k='.$par2->k.' '.$par2->id ;
		echo $postslist->post_title."<br>\n" ;
		
	}//endfunction
}//endclass

リスト37642 の実行結果


ID: 18444
現世代
k=0 18444月島発展史
子孫
k=1 18669第二編 江戶時代の月島
k=2 18675第一章 石川島佃島の塡築
k=1 18665第三編 明治以後の月島
k=2 18445第二章 月島、新佃島の填築
k=2 18661第八章 月島の商業

リスト36732 タクソノミーの先祖と子孫を同時表示

呼び出す側

$par2->gen_id = '9790';
$par2->entity_name = 'region' ;
echo "<br>\n".'ID: '.$par2->gen_id."<br>\n" ;
$user = new Model36732() ;
    $user->generation($par2) ;

呼び出される側(クラス)

class Model36732//計算するクラス。
{
	public function __construct()
	{
//コンストラクタは、なぜ今回使わないのか。
	}//endfunction
	
	public function generation($par2)
	{
		$ance = array() ;
		$ance = get_ancestors($par2->gen_id, $par2->entity_name) ;
		//$cnt = count($ance);
		$ance = array_reverse($ance) ;

//////先祖が存在しない場合、$anceは中身は空なので、次の処理へ進む。
//先祖を表示。
echo '先祖'."<br>\n" ;
		$k = 0 ;
		While ( !empty($ance[$k])) {
			$par2->id = $ance[$k] ;
			$par2->k = $k ;
			$View_obj = new View36732a($par2) ;
			$k = $k +1 ;
		}//endwhile

//現世代を表示
echo '現世代'."<br>\n" ;
		$par2->id = $par2->gen_id ;
		$par2->k = $k ;
		$View_obj = new View36732a($par2) ;
		
//子孫を表示
echo '子孫'."<br>\n" ;
		$this->children($par2) ;		
	}
	
	public function children($par2)
	{
//抽出処理
		$k = $par2->k ;	
		$args = array(
			'parent' => $par2->id ,	
		);
		$the_query = get_terms($par2->entity_name, $args) ;
		if(empty($the_query)){	
			return ;
		}
//ループ処理
		$k = $k +1 ;
		foreach($the_query as $term){
			$par2->id = $term->term_id ;
			$par2->term = $term ;//$par2に追加。
			$par2->k = $k ;//$par2に追加。
			$View_obj = new View36732b($par2) ;
			$this->children($par2) ;//再帰処理。
		}
		
	}//endfunction
}//endclass

class View36732a//表示するクラス。
{
	public function __construct($par2)
	{
		$term = get_term($par2->id , $par2->entity_name ) ;
		echo 'k='.$par2->k.' '.$par2->id ;
		echo $term->name."<br>\n" ;
	}//endfunction

}//endclass

class View36732b//表示するクラス。
{
	public function __construct($par2)
	{
		echo 'k='.$par2->k.' '.$par2->id ;
		echo $par2->term->name."<br>\n" ;
	}//endfunction

}//endclass

リスト36732 の実行結果


ID: 9790
先祖
k=0 7079全国
k=1 2740東京都
現世代
k=2 9790中央区
子孫
k=3 10160日本橋人形町二丁目
k=3 10161日本橋箱崎町
k=3 10162日本橋小網町
k=3 10163日本橋人形町三丁目
k=3 10164日本橋中洲
k=3 10506築地4丁目
k=3 10507築地6丁目
k=3 10508築地7丁目
k=3 10509新川2丁目
k=3 2747銀座二丁目
k=3 2748八丁堀三丁目
k=3 2749新富1丁目
k=3 2750京橋三丁目
k=3 2751日本橋人形町一丁目
k=3 2752新川1丁目
k=3 7442八丁堀二丁目
k=3 9788築地2丁目
k=3 9789月島3丁目
k=3 9880佃1丁目
k=3 9903八重洲一丁目
k=3 9907日本橋本町一丁目
k=3 9908八重洲二丁目
k=3 10058銀座八丁目
k=3 10059銀座七丁目
k=3 10061銀座三丁目
k=3 10062銀座四丁目
k=3 10063銀座五丁目
k=3 10064銀座六丁目
k=3 10076日本橋本町四丁目

サブクエリーのカスタマイズ事例(2)

今回は、投稿データに関連付けられたタクソノミーや別の投稿を表示する方法について紹介します。

リスト内容備考
リスト37209投稿のカスタムフィールドに関連付けられた投稿の表示meta_queryの裏返し
リスト37211投稿に関連付けられたタクソノミーの表示tax_queryの裏返し

リスト37209は、投稿のカスタムフィールドに関連付けられた投稿の表示の事例です。
ブログ記事のような投稿データに、別の投稿データを関連づけて表示したい場合があります。
この事例は、前回※1 紹介したmeta_queryの裏返し(参照元と参照先が入れ替わった)事例です。

リスト37211は、投稿に関連付けられたタクソノミーの表示の事例です。
ブログ記事のような投稿データには、タクソノミー(カテゴリー、タグ)を関連づけて記事の分類分けをしますが、このとき、ブログ記事のタイトルの上部や本文の末尾などにタクソノミーを表示したい場合があります。
この事例は、前回※1 紹介したtax_queryの裏返し(参照元と参照先が入れ替わった場合)事例です。

参考記事

※1 サブクエリーのカスタマイズ事例(1) meta_queryとtax_query2020-06-04

コード例

リスト37209 Destinationパターン(Post→Post)

class code37209
{
	public function __construct()
	{	
		$user = new Model37209() ;
	}//endfunction
}//endclass

class Model37209 extends WP_Query
{
	public function __construct()
	{
		$args = array(		
			'post_type' => 'post',
			'post__in' => array('18348'),//IDを配列で指定。
		);
		$the_query = new WP_Query($args) ;		

//ループ~表示処理(Viewクラス)の呼び出し。
		if($the_query->have_posts()){
			While($the_query->have_posts()){
				$the_query->the_post();
					$view_obj = new View37209($par) ;
			}
		}//endif
	}//endfunction

}//endclass

class View37209
{
	public function __construct($par)//$parはいらない。
	{
		the_title() ;
		echo "<br>\n" ;
		
//次の処理の準備
//投稿に関連付けられているカスタムフィールドのIDを取得する。
	$myposts = get_post_meta(get_the_ID(), 'ref', false) ;//'ref'を指定。
	if (!empty($myposts)){
		$par->foreign_key = $myposts ;
		$user = new Model37209a($par) ;
	}else{
		return ;
	}
		
	}//endfunction
}//endclass

class Model37209a
{
	public function __construct($par)
	{	
		$args1 = array(
			'post__in' => $par->foreign_key,//配列をそのまま記述
			'post_type' => 'reference',//DPP
		);
		$the_query = new WP_Query($args1) ;//WP_Query	

//ループ~表示処理(Viewクラス)の呼び出し。
		if($the_query->have_posts()){
			While($the_query->have_posts()){
				$the_query->the_post();
					$view_obj = new View37209a($par) ;
			}
		}//endif
	}//endfunction

}//endclass

class View37209a
{
	public function __construct($par)
	{

		the_title() ;
		echo "<br>\n" ;
		
	}//endfunction
}//endclass

リスト37209 の実行結果

築地(西仲通り商店街)明治時代の埋め立て工事により出来上がった町。
第八章 月島の商業
月島再発見学

リスト37211 Destinationパターン(Post→Term)

class code37211
{
	public function __construct()
	{	
		$user = new Model37211() ;
	}//endfunction
}//endclass

class Model37211
{
	public function __construct()
	{
		$args = array(		
			'post_type' => 'post',
			'post__in' => array('18348'),//IDを配列で指定。
		);
		$the_query = new WP_Query($args) ;		

//ループ~表示処理(Viewクラス)の呼び出し。
		if($the_query->have_posts()){
			While($the_query->have_posts()){
				$the_query->the_post();
					$view_obj = new View37211($par) ;
			}
		}//endif
	}//endfunction

}//endclass

class View37211
{
	public function __construct($par)
	{
		the_title() ;
		echo "<br>\n" ;

//次の処理の準備
//投稿に関連付けられているタクソノミーのIDを取得する。
			$myterms = wp_get_object_terms(get_the_ID(), 'region');
			if (!empty($myterms)){
				$foreign_key = array() ;
				foreach ($myterms as $post){
					array_push( $foreign_key , $post->term_id);
				}
			}else{
				return ;
			}//endif		
		
		$par->foreign_key = $foreign_key ;
		$user = new Model37211a($par) ;
		
	}//endfunction
}//endclass

class Model37211a
{
	public function __construct($par)
	{

		$args = array(		
			'include' => $par->foreign_key,
		);
		$the_query = get_terms('region', $args) ;		

//ループ~表示処理(Viewクラス)の呼び出し。
		foreach ($the_query as $term){
			$par->term = $term ;
				$view_obj = new View37211a($par) ;			
		}
	}//endfunction

}//endclass

class View37211a
{
	public function __construct($par)
	{
		echo $par->term->name."<br>\n" ;
		
	}//endfunction
}//endclass

リスト37211 の実行結果

築地(西仲通り商店街)明治時代の埋め立て工事により出来上がった町。
月島3丁目

サブクエリーのカスタマイズ事例(1) meta_queryとtax_query

リスト37167は、meta_queryの事例。
リスト37179は、tax_queryの事例です。

この記事を参照している記事

サブクエリーのカスタマイズ事例(2)

コード例

リスト37167 Sourceパターン(Post→Post) meta_query

class code37167
{
	public function __construct()
	{
		$args = array(
			'model' => '37167',
			'view' => '37167',
			'post_type' => 'post',
			'field' => array('ref'),//参考文献
			'field_value' => array('18661'),//第八章 月島の商業
		);
		$user = new Controller37167($args) ;
	}//endfunction
}//endclass

class Controller37167
{	
	
	public function __construct($args)
	{
//////配列をオブジェクトに変換
		$par =(object)$args;
//////Modelメソッドの呼び出し
			$model_name = 'Model'.$par->model ;	
			$model_obj = new $model_name($par) ;
	}//endfunction
}//endclass

class Model37167
{
	public function __construct($par)
	{
		$args = array(		
			'post_type' => $par->post_type,
			'meta_query' => array(
			'relation' => 'OR',
				array(
					'key' => $par->field[0],
					'value' => $par->field_value[0],
				)
			)
		);
		$the_query = new WP_Query($args) ;

//ループ~表示処理(Viewクラス)の呼び出し。
		if($the_query->have_posts()){
			While($the_query->have_posts()){
				$the_query->the_post();
					$view_name = 'View'.$par->view ;
					$view_obj = new $view_name($par) ;
			}
		}//endif
	}//endfunction

}//endclass

class View37167
{
	public function __construct($par)
	{
		the_title() ;
		echo "<br>\n" ;
	}//endfunction
}//endclass

リスト37167 の実行結果

築地(和風スナック)沢の鶴の看板。月島三丁目。
築地(西仲通り商店街)明治時代の埋め立て工事により出来上がった町。

リスト37179 Sourceパターン(Term→Post) tax_query

class code37179
{
	public function __construct()
	{
		$args = array(
			'model' => '37179',
			'view' => '37179',
			'tax' => array('region','genre'),//タクソノミー名:地域、ジャンル
			'field_value' => array('9790','10274'),	//タクソノミーの値:中央区、商店街		
			'post_type' => 'post',//投稿タイプ:ブログ記事
		);
		$user = new Controller37179($args) ;
	}//endfunction
}//endclass

class Controller37179
{	
	public function __construct($args)
	{
//////配列をオブジェクトに変換
		$par =(object)$args;
//////Modelクラスの呼び出し
		$model_name = 'Model'.$par->model ;	
		$model_obj = new $model_name($par) ;
	}//endfunction
}//endclass

class Model37179//投稿を表示
{
	public function __construct($par)
	{

		$args = array(		
			'post_type' => $par->post_type,
			'tax_query' => array(
			'relation' => 'OR',
				array(
					'taxonomy' => $par->tax[0],				
					'field' => 'term_id',
					'terms' => $par->field_value[0],
				),
				array(
					'taxonomy' => $par->tax[1],				
					'field' => 'term_id',
					'terms' => $par->field_value[1],
				)
			)
		);
		$the_query = new WP_Query($args) ;

//ループ~表示処理(Viewクラス)の呼び出し。
		if($the_query->have_posts()){
			While($the_query->have_posts()){
				$the_query->the_post();
					$view_name = 'View'.$par->view ;
					$view_obj = new $view_name($par) ;
			}
		}//endif
	}//endfunction
}//endclass


class View37179
{
	public function __construct($par)
	{
		the_title() ;
		echo "<br>\n" ;
	}//endfunction
}//endclass

リスト37179 の実行結果

茂原(榎町商店街)カラフルな看板建築建物群。
浅草橋(おかず横丁)昔ながらの商店街。重厚な看板建築。
関内(アートビル)1階にあったベンチはメリーさんの指定席。
川崎南町(名画通り)路地にまっすぐに伸びる側溝。
信濃町(味の名店街)レトロ感漂う駅前ビルの地下。
日立(日立銀座通りの写真)駅構内の写真展。
長崎丸山(銅座市場跡)現在は取り壊されています。
板橋(プラザ板橋)1階はL字型の飲食街。
板橋(坂下マーケット)ゲートだけが残っています。
板橋(トンネルマーケット)立喰いそば屋脇のトンネル。
成増(成増マーケット)すずらん通りの昭和の空間。
町田(仲見世飲食街)商店街とつながっています。
町田(仲見世商店街)西のアメ横とよばれています。
佐原(カメラの三越)3階建て。天体望遠鏡。
船橋(仲通り商店会)Y字路の商店街。
歌舞伎町(三経ビル)ポストモダン建築。
上野(アメ横センター地下食品街)日本の中の異国。
池袋(ロサ会館)昭和43年に竣工した娯楽ビル。
池袋(のとや会館)ヤミ市の最後の賑わいの頃に開業。
銀座(名店「三州屋銀座店」)1968年創業の老舗割烹。
銀座(金春小路)かつては置屋や待合が並ぶ花街。
銀座(路地の中の自動ドア)通り抜けできます。
銀座(豊岩稲荷)130年以上前の銀座煉瓦街時代の名残。
銀座(三愛ビル)1963年開業の銀座のランドマーク。
銀座(出世地蔵尊)昭和27年のキャバレー「美松」の火事で移転。
銀座(キャバレー美松跡地)現在の三越百貨店新館がある場所。
銀座(三原小路隣の袋小路)2階建ての長屋形式の店舗。
日本橋(老舗カレー店)開業50周年
日本橋(鳥萬)戦前の建物。4階建てのように見える3階建て。
日本橋(大勝軒)昭和32年の建築。緑のタイル。
日本橋(老舗割烹「嶋村」)嘉永3年(1850年)創業。金ぷら
日本橋(アダルトグッズ店)TENGAあります。
日本橋(理容室跡)木々が生い茂る中のサインポール。
日本橋(雀荘)オフィス街の中に10軒近く。
日本橋(花街跡)横丁や路地に遊興の歴史。
小岩(駅裏の商店街)小さな小島のような一画。
北千住(商業ビルの通路)1階部分に数か所。日常的な通路。
北千住(駅前の商業ビル)1階に飲食店や商店、2階と3階は住居部分。
高田馬場(女神の像)昭和37年の駅前再開発。
王子(スーパー「ほりぶん」)王子のシンボル。
王子(いなり通り)かつて花街があった場所の商店街。
人形町(小春軒)山県有朋のお抱え料理人が創業。
人形町(金刀比羅宮)芳町芸妓組合、新田新作が寄進。
人形町(浜田家)芳町唯一の料亭
人形町(思案橋)吉原へ行こうか、芝居に行こうか。
人形町(桃乳舎)芸術的な看板建築。桃のマーク。
人形町(高尾稲荷社)高尾大夫の霊を祭っている稲荷神社。
人形町(キラク)1951年開業。年季の入った看板と暖簾。
人形町(歯科医院のゴミ箱)特注の備え付けタイプ。
人形町(㐂寿司)かつての花街の記憶が残る建物。
人形町(よし梅本店)戦火を免れて残った店。
大塚(三業通り)看板がリニューアル。芸者さんのモニュメント。
錦糸町(旅館の建物)建物の屋上のネオン看板。
築地(日の出湯)佃小橋から見える煙突付きマンション。
築地(和風スナック)沢の鶴の看板。月島三丁目。
築地(西仲通り商店街)明治時代の埋め立て工事により出来上がった町。
築地(旅館大宗)純和風。周囲は、高層ビルが建ちち並びます。
築地(看板建築)3階建て。正面から見ると2階建て。
築地(築地場外市場)寺院の建物と市場の建物がつながっています。
築地(天婦ら「おかめ」)昭和初期からある料理屋です。
築地(料亭「新喜楽」)芥川賞や直木賞の選考会場。
亀戸(亀七通り商店街)大看板。両側にゲート。
福富町(長者町八丁目共同ビル)マッサージ店の看板。
福富町(福仲ビル)商店街共同建築。2階と3階は居住部分。
天王町(横浜洪福寺松原商店街)朝獲れの鯖。
磯子(浜マーケット)戦後の闇市が発展してできました。
磯子(丸山市場)美空ひばりの生家の近く。
新川(於岩稲荷田宮神社)花柳界や歌舞伎関係者が参詣。
新川(新川大神宮)酒問屋が信仰。待合と芸妓屋が集中していた場所。
新川(料理屋「増田や」跡)現在は居酒屋チェーンの店舗。
丸の内(長者町繊維街)看板が連なります。
荒木町(車力門通り)荒木町三業地の入口。
藤岡(割烹料理屋「花月」)仲町の通り。料理屋が建ち並ぶ一画。
相模原(タンクトップ)西門商店街。日用品の店舗。
武蔵小杉(センターロード小杉)超ミニスカスッチー。
門前仲町(清住庭園東側共同ビル)3階建ての長屋建築。
綱島(駅ビル商店街)昭和レトロな雰囲気。
新富町(正金アパート)昭和の初期からあるアパート。
新富町(路地)昔ながらの路地。飲食店の看板。
新富町(花街跡)新富座の開業とともに芸妓、置屋が増加。
新富町(新島原遊廓跡地)外国人のための遊廓。
巣鴨(地蔵通り商店街)巣鴨名物「お地蔵様の赤パン」。
麻布(元麻布の長屋)高層マンションとのアンバランスな対比。
吉祥寺(のれん小路)かつては小さな飲み屋が連なっていた横丁。
吉祥寺(ハモニカ横丁)終戦直後の闇市の姿。
新橋(ニュー新橋ビル)闇市跡にできた雑居ビル。
日暮里(繊維問屋街)コスプレ人気で活況を呈しています。
浅草(浅草地下街)700円の理髪店。昭和の匂いの残る地下街。
長崎丸山(銅座市場)通り抜けられません。
戸部(岩亀横丁)「がんき」の屋号を持つ寿司屋、サウナ。
南千住(三ノ輪商店街)荒川区随一の大商店街。
日本橋(理髪店)昭和5年築の看板建築。モダンなデザイン。
日本橋(麻雀クラブ富士)昭和25年頃は「パチンコ富士」でした。
日本橋(八重洲の飲み屋街)八重洲のあの日。
日本橋(ビデオボックス)都会の真ん中に密集。
京橋(雀荘)幻想的な水色の建物。モダンな玄関の部分。
京橋(レトロな商店街)戦前の看板建築がひっそりと残る一画。
京橋(京橋柳町遊里跡地)吉原の元祖。関が原の合戦後。
京橋(江戸歌舞伎発祥の地)江戸三座。猿若中村座。
白山(仲通り商店街)かつての銘酒屋があったあたり。

WP_Queryの拡張

サブクラスにおいてWP_Queryを使うことのメリットは、拡張(継承)してカスタムクラスを作れることです。Rakhitha Nimesh Ratnayake(ラーキサ・ニーメシュ・ラーネヤク)は、その著書「WordPressによるWebアプリケーション開発」の中で、WP_Queryクラスの継承の用例を示しています。*1

リスト37188は、ラーネヤク氏が示した用例を本書のテーマに即してアレンジしたものです。
通常、WP_Queryを使うときは、次のように配列にすべてのフィルタリング条件を記述しなければなりませんが、リスト37188では、Modelクラスの中にこの記述を書いているので、呼び出す側は、1行のコードのみで済みます。

たしかに、同じフィルタリング条件を何度も繰り返し使う場合はこの方法が有効であり、クラスを継承すれば、少し異なる条件の場合も含めて抽象化できるかもしれません。

しかし、あらゆるパターンのサブクエリー(投稿の場合、タームの場合、親子の場合)と表示をすべて網羅的に抽象化するためには、もう一工夫必要です。

リスト36618は、リスト37188をアレンジし、この課題を解決するための方法です。

呼び出す側に、フィルタリング条件を羅列しますが、そこには値を直接記述します。これを受け取ったModelクラスは、その値をWP_Queryのフィルタリング条件にあてはめます。
この方法のメリットは、面倒なWP_Queryの記述から解放されるということです。
さらに、表示するViewクラスの名称なども呼び出す側の条件に加えることにより、サブクエリーから表示までを一貫して抽象化することができそうです。

参考文献

*1 オライリー・ジャパン: WordPressによるWebアプリケーション開発 (Rakhitha Nimesh Ratnayake,2014)
データベースへのクエリの発行

P.82
WP_Queryのデフォルトの使い方は、まず、配列にすべてのフフィルタリン…

参考記事

※1 サブクエリー抽象化の方法(2)クラスを使ってサブクエリーを抽象化する方法2020-05-28

コード例

リスト37188 WP_Queryの拡張①Ratnayake氏の方法

呼び出す側

$the_query = new Model37188();
//ループ
if($the_query->have_posts()){
	While($the_query->have_posts()){
		$the_query->the_post();
		//Viewの記述	
		$view_obj = new View37188($par2) ;			
	}
	wp_reset_postdata();
}//endif

Modelクラス

class Model37188 extends WP_Query
{
	public function __construct( $args = array() )
	{
//クエリー	
		$args = wp_parse_args( $args, array(
			'post_type' => 'glossary',
			'meta_query' => array(
			'relation' => 'AND',
				array(
					'key' => 'gloss_type',
					'value' => '9851',
				),
				array(
					'key' => 'region',
					'value' => '9790',
				)
			)
		)
		);
		parent::__construct($args) ;
		
	}
}

Viewクラス

class View37188
{
	public function __construct($par2)
	{
		the_title() ;
		echo "<br>\n" ;	
	}//endfunction
}//endclass

リスト37188 の実行結果

築地
銀座
新川
新富町
京橋
日本橋
人形町

リスト36618 WP_Queryの拡張②アレンジした方法

呼び出す側

$args = array(
	'post_type' => 'glossary',
	'key' => array('gloss_type','region'),
	'value' => array('9851','9790')	
	);
$query = new Model36618($args);

Modelクラス

class Model36618 extends WP_Query
{
	public function __construct($var)
	{
//配列をオブジエクトに変換。
	$par =(object)$var;
//クエリー	
		$args = array(	
			'post_type' => $par->post_type,
			'meta_query' => array(
			'relation' => 'AND',
				array(
					'key' => $par->key[0],
					'value' => $par->value[0],
				),
				array(
					'key' => $par->key[1],
					'value' => $par->value[1],
				)
			)
		);
		
		$the_query = new WP_Query($args) ;
//ループ
		if($the_query->have_posts()){
			While($the_query->have_posts()){
				$the_query->the_post();
				//Viewの記述	
				$view_obj = new View36618($par2) ;			
			}
			wp_reset_postdata();
		}//endif
		
	}
}

Viewクラス

class View36618
{
	public function __construct($par2)
	{
		the_title() ;
		echo "<br>\n" ;	
	}//endfunction
}//endclass

リスト36618 の実行結果

築地
銀座
新川
新富町
京橋
日本橋
人形町

サブクエリー抽象化の方法(2)クラスを使ってサブクエリーを抽象化する方法

前回※1、get_template_part()に引数を渡す方法を紹介しましたが、この方法では、
(1)呼び出す側にset_query_varと呼び出される側にget_query_varをその都度書かなければならないこと。
(2)PHPファイル別々に作成するので、見通しが悪くなること。
ことが、課題です。
そこで、今回は、これに代わる方法として、classを呼び出す方法を紹介します。


参考記事

※1 サブクエリー抽象化の方法(1)get_template_part()でサブクエリーを呼び出す方法2020-05-17

この記事を参照している記事

WP_Queryの拡張

コード例

リスト36618 WP_Queryの拡張②アレンジした方法

呼び出す側

$args = array(
	'post_type' => 'glossary',
	'key' => array('gloss_type','region'),
	'value' => array('9851','9790')	
	);
$query = new Model36618($args);

Modelクラス

class Model36618 extends WP_Query
{
	public function __construct($var)
	{
//配列をオブジエクトに変換。
	$par =(object)$var;
//クエリー	
		$args = array(	
			'post_type' => $par->post_type,
			'meta_query' => array(
			'relation' => 'AND',
				array(
					'key' => $par->key[0],
					'value' => $par->value[0],
				),
				array(
					'key' => $par->key[1],
					'value' => $par->value[1],
				)
			)
		);
		
		$the_query = new WP_Query($args) ;
//ループ
		if($the_query->have_posts()){
			While($the_query->have_posts()){
				$the_query->the_post();
				//Viewの記述	
				$view_obj = new View36618($par2) ;			
			}
			wp_reset_postdata();
		}//endif
		
	}
}

Viewクラス

class View36618
{
	public function __construct($par2)
	{
		the_title() ;
		echo "<br>\n" ;	
	}//endfunction
}//endclass

リスト36618 の実行結果

築地
銀座
新川
新富町
京橋
日本橋
人形町

Leaflet入門

「Leaflet」は、Webサイトに地図を載せる場合に利用するツールです。
「Leaflet」はフリーソフトでありながら、細かなオプションが用意されているのが特徴です。

リスト1 は、背景となる地図(ベース地図)を表示するコードです。
WordPressにLeafletを埋め込む場合は、事前準備として、function.phpに、Leafletを読み込むコードを記述します。

コード例

リスト36430 Leaflet入門(背景地図の表示)

function.php

まず、事前準備として、次のコードをfunction.phpに記述します。

function leaflet_enqueue_styles() {
    wp_enqueue_style( 'leaflet-style', '//unpkg.com/leaflet@1.5.1/dist/leaflet.css', NULL, NULL );
}
add_action( 'wp_enqueue_scripts', 'leaflet_enqueue_styles' );
/* 先にスタイルシートを読み込んでからJavaScriptを読み込む */
function leaflet_enqueue_script() {
    wp_enqueue_script( 'leaflet-js', '//unpkg.com/leaflet@1.5.1/dist/leaflet-src.js', NULL, NULL );
}
add_action('wp_enqueue_scripts', 'leaflet_enqueue_script');

テンプレートファイル

次にテンプレートファイルに次のコードを記述します。

<body>
    <div id="map_1" style="height: 400px;"></div>
</body>

<script>
//////背景地図
	var osm = new L.tileLayer
	('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    	maxZoom: 19,
    	attribution: "Map data © <a href='https://www.openstreetmap.org/copyright' target='_blank'>OpenStreetMap</a> contributors"
	});
	
	var map_1 = L.map('map_1', {
		layers: [osm],	
		center: [35.717007,139.752772],
		zoom: 18,
    	zoomControl: true
		});
</script>

リスト36430 の実行結果

サブクエリー抽象化の方法(1)get_template_part()でサブクエリーを呼び出す方法

WordPressのカスタマイズの規模が大きくなると、8割~9割は同じようなコード(PHPのプログラム)を何度も書いていることがあります。このようなときは、別ファイルを作成してソースコードを分割し、コードを再利用することにします。
分割した別ファイルは、get_template_part()によって呼び出しますが、このとき、再利用の度合いを高めるために引数を渡したい場合があります。

WordPressCodexには、テンプレートに変数を渡す方法が解説されています。
今回は、一例として、引数aと引数bを渡して、テンプレート側でa+bの足し算を行い、その結果を返す例を紹介します。

この記事を参照している記事

サブクエリー抽象化の方法(2)クラスを使ってサブクエリーを抽象化する方法

コード例

リスト35668 get_template_part()でサブクエリーを呼び出す方法

呼び出す側

$args = array(
	'tax' => 'region',
	'term' => '9789',			
);
set_query_var( 'val', $args) ; 
get_template_part( 'template-parts/sample/content', 'sample' );	

呼び出される側

<?php
//引数を受け取り
		$var = get_query_var('val');
		$par =(object)$var;
//サブクエリー
		$args = array(		
			'post_type' => 'post',
			'tax_query' => array(
				array(
					'taxonomy' => $par->tax,				
					'field' => 'term_id',
					'terms' => $par->term,
				)
			)
		);
		$the_query = new WP_Query($args) ;
//サブループ
		if($the_query->have_posts()){
			While($the_query->have_posts()){
				$the_query->the_post();
					//表示
					the_title() ;
					echo "<br>\n" ;
			}
		}//endif	

リスト35668 の実行結果

築地(和風スナック)沢の鶴の看板。月島三丁目。
築地(西仲通り商店街)明治時代の埋め立て工事により出来上がった町。

「日本版MapWarper」のジオリファレンス機能について

◆ジオリファレンスとは

古地図をWEB地図上に表示するためには、スキャナーやデジタルカメラなどを使って紙の地図をデジタル化し、それをWEB地図上に貼り付けるわけですが、このとき、
(1)古地図に緯度・経度の情報を付加する作業
(2)古地図を適切な形に整形して (ゆがめて) 現実の地図の上に置く作業
が必要です。この作業のことをジオリファレンスと言います。

◆日本版MapWarperについて

日本版MapWarper」は、このジオリファレンスを簡単に行うことができるツール(ジオリファレンサー)です。
オープンソース・ソフトウェアなので、誰でも無料で利用でき、公開した地図(されている地図)は、誰でも閲覧でき、ダウンロード利用できます。

◆「大正3年頃の鯖江図」のジオリファレンス事例

今回は、鯖江市が公開している古地図データ*1 を日本版MapWarperにアップロードして、ジオリファレンスを行います。

古地図

日本版MapWarperに会員登録し、ログインし、メニューの「地図をアップロードする」を使って古地図をアップロードします。

次に、「整形」の機能を使って、古地図を変形・伸縮させて現実の地図の座標に合うよう整形(ジオリファレンス)します。画面の左側が古地図、右側が現実の地図です。大正時代の地図は現在の地図にぴったりと重なりませんので、ここで補正を行います。両方の地図の一致する場所をダブルクリックして基準点を登録します。今回は、11か所の基準点を登録しました。①から⑪までの基準点が図示されています。

整形画面

最後に「切り抜き」の機能を使って古地図の余分な部分を取り除くと完成です。

「プレビュー」のタブに切り換えると、現実の地図の上に古地図が重ねられた状態が確認できます。*2

プレビュー画面

参考文献

*1 鯖江地区まちづくり推進協議会: 鯖江市 古地図データ (鯖江市,) リンク
007 大正3年頃の鯖江図 リンク
*2 立命館大学文学部地理学教室: 日本版MapWarper (立命館大学文学部地理学教室,) リンク
大正3年頃の鯖江図 リンク