Creatersimg5

カスタム投稿タイプ・カスタムタクソノミー・カスタムフィールド違いとは


カスタムという名前のとおり、「カスタム投稿タイプ」、「カスタムタクソノミー」及び「カスタムフィールド」は、独自で作成(カスタム)できる投稿やタクソノミー(カテゴリ)、フィールドです。

 

カスタム投稿タイプとは

カスタム投稿タイプは、Wordpress標準で用意されている「投稿」「固定ページ」とは別に、独自の投稿形式を用意することができます。

たとえば、爬虫類の内容で投稿しているのに、あとから鳥などの分類で投稿画面を区別したい場合などに使用します。

たとえば、「Birds」の投稿という投稿タイプを追加すると下記のように、投稿のアイコンと同じアイコンが付加されたメニューが作成されます。
Birds
このように投稿画面を分けると、投稿をするとき、投稿内容を区別して投稿できます。

 

カスタムタクソノミーとは

カスタム投稿タイプと同様に、タクソノミー(カテゴリ)を独自に設定できる機能がカスタムタクソノミーです。

これは、標準機能であるカテゴリとは別に、ユーザーが独自で設定するカテゴリと同様の機能であり、ユーザーが独自で分類を持ちたいときに使用します。

ややこしいですが、カテゴリにあたるものが「タクソノミー」で、そのカテゴリに分類されるものが「ターム」と呼ばれています。

たとえば、鳥というタクソノミーを作った場合、「かもめ」と「すずめ」がそれぞれタームとなります。

 

Custom Post Type UIを使用したカスタム投稿タイプ、カスタムタクソノミーの作り方

カスタム投稿は、プラグインを使用しなくても作れますが、直接ソースを書く場合は、リスクもあり、デバッグも必要なため、「Custom Post Type UI」というプラグインをおすすめします。

・インストール

管理画面のプラグインから、「Custom Post Type UI」で検索します。

検索後、インストールして有効化します。

管理画面のメニュー部分にCPT UIというメニューが表示されます。
cptui

 

 

新しくサイドメニューに追加された「CPT UI」にマウスカーソルを合わせると表示される「新規追加」をクリックすると、以下のようなメニューが開きます。

gamen

上記画面の説明
– 投稿タイプ名:独自で使用できるカスタム投稿タイプの名前
– ラベル:カスタム投稿タイプのラベル
– 単体系のラベル:カスタム投稿タイプ名の単数形
– 説明:カスタム投稿タイプ名の説明(必須ではない)

 

では、鳥(bird)というカスタム投稿を作成します。

上記画面に下記画面のように入力します。

・投稿タイプ名:ソース内部で呼び出す際に使用します。
・ラベル:設定画面での表示名です。
・単数形ラベル:単数形での表示ですが空白でも問題ありません。

bird

入力後、画面下部にある「Creare Custom Post Type」をクリックします。

*カスタム投稿タイプの名前を付ける時の注意点

”post”, “page”, “revision”, “attachment”等すでに存在する投稿タイプの名前は使用できません。
また、投稿タイプの名前の長さは最大 20文字までとなっております。

クリック後に管理画面の左のメニューバーに「Birds」の項目が表示されます。

Birds

 

Birdsをクリックすると現れるメニュー「Add Bird」をクリックすると、実際に投稿画面に映ります。

また、「Birds」をクリックするとカスタム投稿の一覧が表示されます。

 

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

カスタム投稿タイプは、通常の状態では表示されませんので、
下記のようなソースをテンプレートに記載します。

 

<h2>鳥の記事</h2>
<?php $loop = new WP_Query(array(“post_type” => “bird”, “posts_per_page” => 10 ));
while($loop->have_posts()): $loop->the_post(); ?>
<div id=”post-<?php the_ID(); ?>” <?php post_class(); ?>>
<h4><a href=”<?php the_permalink(); ?>” title=”<?php the_title(); ?>”><?php the_title(); ?></a></h4>
<?php the_content(); ?>
</div>
<?php endwhile; ?>

カスタムタクソノミーの設定

プラグインのCustom Post Type UIから簡単に追加することができます。

まず、管理画面の左のメニューにある「CPT UI」をクリックしてください。

画面の右側にある部分に、下記の項目を入力します。

・分類名 カスタムタクソノミーの名前で、カテゴリやタグ名などと重複することはできません。
・ラベル 管理画面の表示に使います。
・単数形のラベル 管理画面で表示されるラベルです。
・利用する投稿タイプ 投稿はpost、固定ページはpageとなります。

上記入力後、カスタム分類作成をクリックしてください。

swan

カスタムタクソノミーの表示

カスタムタクソノミーを表示する下記のテンプレートタグを追加しましょう。

<?php wp_list_categories( array(
‘taxonomy’ => ‘タクソノミー名’,
)); ?>

 

カスタムフィールドの設定方法

カスタムフィールドを使用すれば、フィールドに特定の値を入力をしてもらい、それをブログで表示するといった定型的な投稿が便利になります。

カスタムフィールドを表示するには、投稿画面の上部にある表示オプションをクリックし、表示されるカスタムフィールドをチェックしてください。

custom

 

次にページ下部にあるカスタムフィールドに「名前」、「値」を追加し、「カスタムフィールドを追加」をクリックします。

field

 

すると、カスタムフィールドが追加されました。

field2

 

カスタムフィールドの表示

カスタムフィールドを表示するには、下記のソースをテンプレートに挿入します。
とWordpressのループ内に記載すれば、簡単に表示されます。

<?php echo get_post_meta($post->ID , ‘カスタムフィールド名’ ,true); ?>

 

 

まとめ

カスタム投稿タイプ、タクソノミーとも一般的にWordpressを使用している場合は、ほとんど使いません。

しかしながら、サイトの内容が複雑になってきたりする場合は、これらの機能を活用し、

投稿作業を快適にすることができますので、ぜひご活用ください。

本サイトが運営するWebデザインのオンラインスクールが公開中!
以下のリンクからお申込みで、特別料金の70%OFF!

未経験からプロのWebデザイナーになる! 400レッスン以上の完全マスターコース
こちらのコースは全くの未経験の方が、プロのWebデザイナーとして働けるレベルになることを目的としたコースです。
・全422レッスン & 42時間! 通学スクール80万円相当の内容
・授業×チャレンジ課題で実践的なスキルが身につく!
・過去1100名以上のスクール卒業生を輩出した、 Webサービス運営企業・デザイナー輩出企業だからこそ作れるプログラム

Webやアプリの最新デザインツール Sketch3 |100レッスンの完全マスターコース
Sketch3未経験からプロレベルを目指す、充実したコースです。
Sketch3の単なる機能説明をするような、つまらないコースではなく、アイコン制作、ボタン作成、メインビジュアル制作、Webページの制作など、実際の制作をしながら実践力を身につけます。
1000名以上の卒業生がいる実績ある日本のWebデザインスクールが提供しています。


NESTonlineBlog編集部

NESTonlineBlog編集部です。ご寄稿頂いた記事などを公開していきます。

Next Articleデザイン力アップ!テキストをかっこ良くみせるエフェクトチュートリアルまとめ