WordPress

カスタム投稿タイプで指定したタームの記事一覧を表示させる方法

ここではカスタム投稿タイプで指定したタームの記事一覧を表示させるサブループの作り方について見ていきます。

コンテンツ

指定したタームの記事一覧を表示させる方法

PHP

<?php
$custom_posts = get_posts(array(
	'post_type' => 'カスタム投稿タイプスラッグ', // 投稿タイプ
	'posts_per_page' => 6, // 表示件数
	'orderby' => 'date', // 表示順の基準
	'order' => 'DESC', // 昇順・降順
	'tax_query' => array(
		array(
			'taxonomy' => 'タクソノミースラッグ', //タクソノミーを指定
			'field' => 'slug', //ターム名をスラッグで指定する
			'terms' => 'タームスラッグ', //表示したいタームをスラッグで指定
			'operator' => 'IN'
		),
	)
));
global $post;
if($custom_posts): foreach($custom_posts as $post): setup_postdata($post); ?>
 
<!-- ループはじめ -->
<h3><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>
<p><?php the_time('Y/m/d') ?></p>
<p><?php the_excerpt(); ?></p>
<!-- ループおわり -->
 
<?php endforeach; wp_reset_postdata(); endif; ?>

コードの解説

説明を見たいコードの行をクリックすると、説明が見られます。

<?php
$custom_posts = get_posts(array(
get_posts()は、投稿の一覧を表示させるときに使うお決まりの関数で、取得したい記事の設定を行います。全体の骨組みは下記のようになります。

PHP

<?php
$custom_posts = get_posts(array(
    // 取得する投稿の設定
));
global $post;
if($custom_posts): foreach($custom_posts as $post): setup_postdata($post);
?>
    // ループで設定した投稿データを出力
<?php endforeach; endif; wp_reset_postdata(); ?>

「取得する投稿の設定」のところで取得したい投稿の設定を行い、それを「ループで設定した投稿データを出力」のところで出力します。上記の骨組みは公式のようなものなので覚えてしまっても良いかもしれません。

ここでは、取得したい記事の設定を変数$custom_postsに代入しています。

    ‘post_type’ => ‘カスタム投稿タイプスラッグ’, // 投稿タイプ
投稿タイプの指定を行います。ここにカスタム投稿タイプのスラッグを入れます。
    ‘posts_per_page’ => 6, // 表示件数
'posts_per_page' => 6,は投稿の表示件数の指定です。「6」のところを表示させたい投稿数に入れ替えてください。
    ‘orderby’ => ‘date’, // 表示順の基準
データをある特定の規則に従って並べ替えることを「ソートする」というのですが、orderbyでは、記事をどんな項目に沿ってソートさせるかを決めます。代表的な項目として下記があります。

順序づけパラメータ 意味
date 投稿日
modified 更新日
name スラッグ
rand ランダム
ID 投稿ID(大文字です)
title タイトル
    ‘order’ => ‘DESC’, // 昇順・降順
orderでは、orderbyで指定した項目を昇順(ACB順)で並べるのか、降順(ACB順の反対)で並べるのかを指定できます。

ASC: 昇順
DESC: 降順

ちなみに初期値は、'DESC'になっていますので、デフォルトで良い場合は行をまるごと削除してしまってかまいません。

    ‘tax_query’ => array(
tax_queryでは、表示させたいカスタムタクソノミーの投稿に関する設定を行います。下記がその骨組みになります。

'tax_query' => array(
	array(
	// 投稿の設定
	),
)
        array(
arrayは、配列を作るときに使われる関数です。
array("要素1", "要素2", "要素3");という形で配列を作ります。
            ‘taxonomy’ => ‘タクソノミースラッグ’, //タクソノミーを指定
'taxonomy' => 'タクソノミースラッグ',のところでは、指定したいタクソノミーをスラッグで指定します。
            ‘field’ => ‘slug’, //ターム名をスラッグで指定する
'field' => 'slug',の部分は、タームをどういう形式で指定するかを決めます。ほとんどの方はスラッグで指定すると思うので、サンプルのコードは'slug'にしてありますが、他にも下記のような値が使えます。

パラメータ 使える値 説明
field term_id(初期値) タームのID
slug スラッグ
name タームの名前です。
ほとんどの場合、日本語になっていますよね。
term_taxonomy_id term_idと同じです。

このパラーメータは、初期値の場合は省略が可能です。

            ‘terms’ => ‘タームスラッグ’, //表示したいタームをスラッグで指定
上の行fieldで設定した形式でタームの指定を行います。サンプルは1つのタームのみの指定になっていますが、下記のように配列を使って複数のタームを指定することもできます。

単一の場合

'terms' => 'ターム',

複数の場合

'terms' => array( 'ターム1', 'ターム2', 'ターム3' ),
            ‘operator’ => ‘IN’
'operator' => 'IN',の部分は、指定したタームに対してどういう絞り込みを行うかを指定します。ここでは、'IN'で「いずれかに一致(or)」になっていますが、他にも下記のような値が指定できます。

パラメータ 使える値 説明
operator IN(初期値) いずれかに一致するターム
NOT IN いずれにも一致しないターム
AND すべてが一致するターム

このパラメータも初期値の場合、省略が可能です。

        ),
    )
));
global $post;
$postというのは、WordPressに最初から入っている変数のひとつで、表示中の投稿に関するいろんな情報(配列)が入っているグローバル変数です。$postをこの後、使用するのでそれに先立ち「グローバル宣言」を行います。
if($custom_posts): foreach($custom_posts as $post): setup_postdata($post); ?>

if(条件): 真の場合の処理;

という形でif文になっていますので、カッコの中の変数$custom_postsの中身が空でない場合は「真」とて扱われます。つまり、次のforeach...が実行されるということです。

foreach($custom_posts as $post):は、foreach文といって、

foreach(配列変数 as 変数):

という仕組みになっています。「配列変数」のところに入っている記事の配列(記事のまとまり)が$postという変数として1つずつ取り出されます。

さらに、setup_postdata($post);のところでは、それぞれの記事をページで表示できるように整えて(セットして)います。

 
<!– ループはじめ –>
<h3><a href=”<?php the_permalink() ?>”><?php the_title(); ?></a></h3>
<p><?php the_time(‘Y/m/d’) ?></p>
<p><?php the_excerpt(); ?></p>
<!– ループおわり –>
 
<?php endforeach; wp_reset_postdata(); endif; ?>
foreach文の終了、if文の終了とsetup_postdata($post);のところで変更した$postの投稿に関する情報をリセットしています。

複数のタクソノミーからタームを指定した記事一覧を表示させる方法

もしも、投稿に複数のタクソノミーが設定されていて、それぞれのタクソノミーをクロスさせた絞り込みを行いたい場合は、tax_queryを下記のようすることで実装可能です。

PHP

'tax_query' => array (
	'relation' => 'AND', //タクソノミー同士の関係を指定
	array (
		'taxonomy' => 'タクソノミースラッグ1',
		'field' => 'slug',
		'terms' => array ( 'スラッグ1', 'スラッグ2' ),
		'operator' => 'IN'
	),
	array (
		'taxonomy' => 'タクソノミースラッグ2',
		'field' => 'slug',
		'terms' => array ( 'スラッグ3', 'スラッグ4' ),
		'operator' => 'IN'
	)
)

タクソノミー同士の関係を指定:'relation' => 'AND',

'relation' => 'AND',の部分では、タクソノミー同士の関係を設定できます。サンプルでは、'AND'ですべてのタクソノミーのタームに一致する投稿を指定していますが、他にも'OR'でいずれかが一致したものを指定することもできます。

パラメータ 使える値 説明
relation AND(初期値) すべてのタクソノミーのタームに一致
OR いずれかのタクソノミーのタームに一致

これも初期値の場合は省略ができます。

最後にコードをまとめるとこんな感じになります。

PHP

<?php
$custom_posts = get_posts(array(
    'post_type' => 'カスタム投稿タイプスラッグ', // 投稿タイプ
    'posts_per_page' => 6, // 表示件数
    'orderby' => 'date', // 表示順の基準
    'order' => 'DESC', // 昇順・降順
	'tax_query' => array (
		'relation' => 'AND', //タクソノミー同士の関係を指定
		array (
			'taxonomy' => 'タクソノミースラッグ1',
			'field' => 'slug',
			'terms' => array ( 'スラッグ1', 'スラッグ2' ),
			'operator' => 'IN'
		),
		array (
			'taxonomy' => 'タクソノミースラッグ2',
			'field' => 'slug',
			'terms' => array ( 'スラッグ3', 'スラッグ4' ),
			'operator' => 'IN'
		)
	)
));
global $post;
if($custom_posts): foreach($custom_posts as $post): setup_postdata($post); ?>
  
<!-- ループはじめ -->
<h3><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>
<p><?php the_time('Y/m/d') ?></p>
<p><?php the_excerpt(); ?></p>
<!-- ループおわり -->
  
<?php endforeach; wp_reset_postdata(); endif; ?>

以上が、カスタム投稿タイプで指定したタームの記事一覧を表示させる方法でした。ぜひ、テーマのカスタマイズにご活用ください。

最近の記事

  1. WordPress

    WordPressの立ち上げからサイト構築までの初期手順
  2. CSS

    要素の配置が簡単に決まるFlexboxの使い方
  3. CSS

    CSS|中央寄せが効かないときは・・・
  4. CSS

    レスポンシブウェブデザインの基本|メディアクリエリの設定
  5. CSS

    擬似クラス「:first-child」「:last-child」はどうして効かな…
PAGE TOP