クリエイティブ

WordPress備忘録-カスタム投稿タイプ編

WordPress備忘録-カスタム投稿タイプ編

ワードプレスで自作テーマを作る際に必ずと言って良いほど出てくるであろうカスタム投稿の扱い方をまとめた記事になります。こちらの記事は足りない部分があったら都度補足していくようにしていきます。

投稿した本人が忘れないようにというメモついででもありますが他の方も気にせず見てやってください。

カスタム投稿タイプの作成

デフォルトの状態だと投稿が一種類しかありません。
もっと投稿の種類を分けたいということは出てくるかと思います。

そこで、カスタム投稿を追加するコードを記載しておきます。今回はブログの投稿が出来るようにカスタム投稿タイプをblogとして説明します。

カスタム投稿タイプを追加するコード

//カスタム投稿タイプの追加
add_action( 'init', 'create_post_type' );

function create_post_type() {
    //ここからカスタム投稿-ブログの追加
		register_post_type(
				'blog',
				array(
						'labels' => array(
								'name' => __( 'ブログ' ),
								'singular_name' => __( 'ブログ' )
						),
						'public' => true,
						'menu_position' => 5,
						'has_archive' => true,
						'show_in_rest' => true,
						'menu_icon' => 'dashicons-edit',
						'supports' => array( 'title', 'editor', 'thumbnail', 'custom-fields', 'excerpt' )
				)
		);
		register_taxonomy(
				'blogcat',
				'blog',
				array(
						'hierarchical' => true,
						'update_count_callback' => '_update_post_term_count',
						'label' => 'カテゴリー',
						'public' => true,
						'show_ui' => true
				)
		);
		register_taxonomy(
				'blogtag',
				'blog',
				array(
						'hierarchical' => false,
						'update_count_callback' => '_update_post_term_count',
						'label' => 'タグ',
						'public' => true,
						'show_ui' => true
				)
		);
  //ここまでカスタム投稿-ブログの追加
}

2つ以上カスタム投稿を増やす場合はコメントアウト部分をコピーして貼り付けを行ってください。

  • 「register_post_type」の名前は適宜変更してください。
  • 「'menu_position' => 5」は管理画面の上から5番目に表示するという意味です。
  • 「'menu_icon' => 'dashicons-edit'」はアイコンです(ここからアイコンの種類を確認できます)。
    ※アイコンを変更する場合は「'menu_icon' => 'アイコン名'」のアイコン名部分を変更してください。
  • 「'supports' => array('title', 'editor', 'author', 'thumbnail', 'excerpt', 'trackbacks', 'custom-fields', 'comments', 'revisions', 'page-attributes')」が初期値です。

私も前までは直接functions.phpを触らなくてもON/OFFの切替が出来る「Code Snippets」というプラグインを使ってその中に上記のコードを入れていましたが、カスタム投稿においては内容がホームページごとに変わってくるので直接functions.phpに記載したほうが良いのかもしれません。

プラグインを使わずしてカスタム投稿を追加した場合は「設定」のパーマリンク設定を必ず更新してください。

とりあえずはこの方法で管理画面にカスタム投稿の項目が増えていることが確認できます。
では、次にカスタム投稿で投稿したときに一覧として表示できるようにページを作りましょう。

固定ページからカスタム投稿ページ(アーカイブ)を追加

固定ページの新規追加よりURL(スラッグ)を合わせたページを作成してください。

ここでは固定ページの追加で名前は「ブログ」スラッグは「blog」としてページを作成してください。投稿の中身は空白で大丈夫です。

カスタム投稿タイプの表示方法

ではカスタム投稿を表示させる準備ができましたので次に好きな場所に下記のサンプルコードを入れてください。ループの中身は自由に設定してください。

カスタム投稿スラッグ(blog)は適宜変更をお願いします。

<div>
	<?php
	$args = array(
		'post_type' => 'blog',
		'posts_per_page' => 10, //すべて表示は-1
	);

	$my_query = new WP_Query( $args );
	?>
	<?php while ( $my_query->have_posts() ) : $my_query->the_post(); ?>
	<!--ループの中身ここから↓-->
	<li>
	<a href="<?php the_permalink(); ?>">
	<div>
		<div>
			<time datetime="<?php the_modified_date('Y-m-d');?>" class="info-date"><?php the_time('Y/m/d');?></time>
			<?php $categories = get_the_category(); if ( $categories ):?>
			<?php foreach ( $categories as $category ) :?>
			<span><?php echo $category->name ;?></span>
			<?php endforeach; endif;?>
		</div>
		<div>
			<p>
				<?php echo get_the_title();?>
			</p>
		</div>
	</div>
	</a>
	</li>
	<!--ループの中身ここまで↑-->
	<?php endwhile; ?>
	<?php wp_reset_postdata(); ?>
</div>

カスタム投稿タイプの条件分岐

分岐で分ける前に「archive-blog.php」や「single-blog.php」というような個別データを用意して分けて表示させるのも良いのですが、そうしてしまうとカスタム投稿タイプが増えるごとに個別ファイルが増えてしまうため管理が複雑で面倒になってしまいます。

そこで、archive.phpとsingle.php内で分岐をしてしまえば一つのファイルにまとまって管理もスムーズに行えます。

次に記載する内容は同じファイル内で条件分岐をして表示方法を変える方法をお伝えします。

もしカスタム投稿タイプだったら…

archive.php内の条件分岐のコードは以下のものとなります。

//すべてのカスタム投稿タイプの場合
<?php if (is_post_type_archive()): ?>
  //ここから内容を記載してください(通常の投稿はpostになります)
<?php endif; ?>

//単独の場合
<?php if (is_post_type_archive('blog')): ?>
  //ここから内容を記載してください(通常の投稿はpostになります)
<?php endif; ?>

//複数の場合(ブログとショップの場合)
<?php if (is_post_type_archive( array('blog', 'shop'))):?>
  //ここから内容を記載してください
<?php endif; ?>

上記のコードはarchive.php内で使います。固定ページで作成したカスタム投稿スラッグが用意してあれば分岐をさせることが出来ます。

もしカスタム投稿タイプの記事だったら…

single.php内の条件分岐のコードは以下のものとなります。

//すべてのカスタム投稿タイプの投稿ページの場合
<?php if (is_singular()): ?>
  //ここから内容を記載してください(通常の投稿はpostになります)
<?php endif; ?>

//単独の場合
<?php if (is_singular('blog')): ?>
  //ここから内容を記載してください(通常の投稿はpostになります)
<?php endif; ?>

//複数の場合(ブログとショップの場合)
<?php if (is_singular( array('blog', 'shop'))):?>
  //ここから内容を記載してください
<?php endif; ?>

上記のコードはsingle.php内で使います。投稿ページで違ったレイアウトを分けたい場合や部分的にパーツを無くす方法でよく使います。他にもタグのclassやidに名前を付けたり…と使い方は幅広くあります。

取得ページがカスタム投稿の記事だったら…

//単独の場合
<?php if (get_post_type() === 'blog'): ?>
  //ここから内容を記載してください(通常の投稿はpostになります)
<?php endif; ?>

//複数の場合(ブログとショップの場合)
<?php if (get_post_type() === 'blog' || get_post_type() === 'shop'): ?>
  //ここから内容を記載してください(「||(or)」「&&(and)」になります)
<?php endif; ?>

上記のコードはarchive.phpとsingle.php以外にも使えるコードです。全体もしくは部分的に取得ページがカスタム投稿の記事だったら○○という条件分岐を与えることが出来ます。

カスタム投稿のカテゴリとタグの扱い

では次にカスタム投稿のカテゴリとタグの分岐について見てみましょう。

カスタム投稿のカテゴリ全体をタクソノミーと言われており、その一部分(カテゴリA/B/CあるうちのカテゴリAのみ)をタームと言います。基本的にはカスタム投稿のカテゴリとタグはどちらもタクソノミー扱いになるためタクソノミーとタームが取得出来れば問題ないと思います。

もしカスタム投稿タイプのカテゴリ(タクソノミー)であれば…

//カスタム投稿のカテゴリ(タクソノミー)だったら表示させる
<?php if (is_tax()):?>
<p>タクソノミーです</p>

//そうでない場合
<?php else:?>
<p>タクソノミーではありません</p>

<?php endif;?>

上記のコードは基本の形となります。もし、表示のページがカスタム投稿のカテゴリ(タクソノミー)だったら○○といったような条件のときに分岐を使います。

<?php if (is_tax( 'blog-cat' )):?>

<p>タクソノミー1です</p>

<?php endif;?>

上記のようにカスタム投稿のカテゴリ(タクソノミー)を指定することもできます。

※blogcatとblogtagはすでにカスタム投稿を追加するコードで定義されています(目次1のコード22と33参照)

もしタクソノミーがタームをもっていれば…

カスタム投稿のカテゴリ(タクソノミー:blogcat)がカテゴリA(ターム:sample)を持っていれば○○といったような、より細かい分岐をするときのコードになります。

<?php if (has_term( 'sample' 'blogcat' )):?>

<p>タクソノミー1です</p>

<?php endif;?>

自分はあまり使いませんが…

さいごに

カスタム投稿タイプだけでも盛りだくさんの分岐があるためやりたいことは無限大だと思います。これらの基礎を身に着けて自分だけのオリジナルテーマを制作していきましょう!

スギちゃん(杉原 優介)

ディレクター制作

ましろ未来図では制作を担当。ましろ未来図の他にも、全国のナレーターと協力して声を使ったお仕事を展開中。ナレーターをお探しであれば「朗読オンライン」からお問合せを。

上に戻る

contact

お問い合わせ

お仕事のご相談やご質問などお気軽にお問い合わせください