WordPress カスタム投稿タイプとカスタムタクソノミーの作り方・アーカイブの表示方法(プラグイン/プラグイン無し)

今回は、 カスタム投稿タイプとカスタムタクソノミーを作成し、アーカイブ(投稿一覧)を表示する方法について解説します。

作り方は「プラグインを使う方法」と、「プラグインを使わずに独自でコードを記述して作る方法」がありますが、この記事では両方の手順を紹介します。

さらに、作成したカスタム投稿タイプや、カスタムタクソノミーの投稿一覧を表示する方法などについても取り上げます。

それでは進めていきましょう。

カスタム投稿タイプ・カスタムタクソノミーを作る

カスタム投稿タイプ/カスタムタクソノミーとは?

「カスタム投稿タイプ」や「カスタムタクソノミー」とは何か?という方は、下記の記事で詳しく解説していますので、まずはそちらを先にご覧ください。

カスタム投稿タイプ・カスタムタクソノミーを作る方法

  • プラグインを使う方法

    専用のプラグインを利用することで、管理画面から直感的にカスタム投稿タイプやタクソノミーを追加・管理できます。
    初心者や手軽に追加したい場合におすすめです。
    今回は最も有名で使いやすい「Custom Post Type UI」を例に解説します。
  • コード(functions.php)で作成する方法

    テーマや子テーマの functions.php にコードを記述して、カスタム投稿タイプやタクソノミーを追加する方法です。
    細かいカスタマイズやパフォーマンス重視の場合はこちらの方法が向いています。

どちらを選ぶべきか?

  • 頻繁に追加・管理したい場合や、コード編集に不安がある場合はプラグインをおすすめします。
  • サイトの高速化や細かな制御、テーマに組み込みたい場合はfunctions.phpでの実装が適しています。

両方の方法を併用しても問題ありません。管理や運用方針に合わせて選びましょう。

プラグインを使って作成する方法

「Custom Post Type UI」のインストール

WordPress管理画面から「プラグイン」→「新規追加」をクリックします。

検索窓に「Custom Post Type UI」と入力し、
表示されたプラグインを「今すぐインストール」→「有効化」します。

表示が日本語になっていない場合は、「ダッシュボード」→「更新」→画面の下の方に「翻訳」がありますので「翻訳を更新」を押します。

完了すると以下の画面となり、日本語で表示されるようになります。

カスタム投稿タイプの追加方法

インストールが完了すると、管理画面左メニューに「CPT UI」という項目が追加されています。

「CPT UI」→「「投稿タイプの追加と編集」→「投稿タイプの追加」タブを選択します。

以下のような画面が表示されます。

それぞれの項目について解説します。

なお、すべての項目は作成後も自由に編集・修正が可能です。

基本設定

  • 投稿タイプスラッグ(例:info, product など、小文字半角英数字を推奨)
    投稿タイプを識別するためのIDです。
    他の投稿タイプ(post, page など)と重複しないユニークなものに設定して下さい。
  • 複数形ラベル(例:お知らせ一覧、商品一覧)
    管理画面の左メニュー投稿記事の一覧ページのタイトルなどに表示されます。
  • 単数形ラベル(例:お知らせ、商品)
    管理画面のボタンやタイトルに使われます。
  • ラベルを自動入力
    リンクが2つありますが、通常、何もする必要はありません

    選択したラベルに基づいて追加ラベルを自動入力します。 
      リンクをクリックすると、
      下にある「追加ラベル」に入力した複数形ラベルと単数系ラベルの内容がセットされます。

    クリアラベル 
      リンクをクリックすると、
      セットされた内容がクリアされます。

    通常は追加ラベルを入力する必要はありませんが、
    特殊なラベル名にしたい場合のみ、 「選択したラベルに基づいて追加ラベルを自動入力します。」をクリックして「追加ラベル」にセットして下さい。
  • CPTUI に移行しようとしているので、これを保存させてください
    過去に他の方法(テーマのfunctions.php、他プラグイン等)で作成した、既存のカスタム投稿タイプを、CPT UI管理下に移行したい場合に使うオプションです。
    通常はチェック不要です。

追加ラベル

ここはすべての項目が空欄のままでも特に問題ありません

入力した内容は、WordPress管理画面内のボタンやタイトル、通知メッセージなどの文言として利用されます。

たくさんありますが、ざっと見て、特におかしなところがなければそのままで問題ありません。

必要に応じて、後から変更も可能です。

設定

多くの設定項目がありますがここでは重要な設定を中心に解説します。

  • アーカイブあり 
    一覧ページ(例:/news/ のようなカスタム投稿の一覧)を有効にするかの設定です。
    「True」に設定しましょう。

    ・アーカイブURLに使うスラッグ 
     →ここは未入力で問題ありません。未入力の場合は、基本設定で入力した投稿タイプスラッグが自動で使われます。
  • 階層
    通常の投稿タイプのように単独で運用する場合は「False」(デフォルト)
    固定ページのように親子関係を持たせたい場合は「True」に設定
    一般的には「False」でOKです。親子構造が必要な場合だけ「True」にします。
  • メニューアイコン
    「ダッシュアイコン」ボタンをクリックして、追加する投稿タイプに合ったアイコンを選択します。
  • サポート
    タイトルやエディター(本文)、アイキャッチ画像にチェックが入っています。
    「なし」以外全てにチェックしましょう。
  • タクソノミー
    紐づけたいタクソノミーを選択します。(複数可)
    標準でついている「カテゴリー」や「タグ」以外にも、この後に追加する「カスタムタクソノミー」も選択できるようになります。
  • フロントでのリライト
    デフォルトは「True」です。
    パーマリンク設定で決めた共通プレフィックス(例:/blog/)が、カスタム投稿タイプのURLにも付与されます。(例:/blog/news/)
    独立したディレクトリ(例:/news/)で見せたい場合は 「False」を推奨

(補足)”フロントでのリライト” について

この設定を変更した場合、投稿タイプのURL構造が変わります。

途中から変更するとリンク切れやSEOへの影響が出るため、最初にしっかり決めておきましょう。

例えば、
下記は、パーマリンク構造の先頭が「/blog/」などのディレクトリで始まる場合の関係表です。

パーマリンク構造truefalse
/blog/%postname%//blog/news//news/
数字ベース
/archives/123
/archives/news/123//news/123/

このようにルートディレクトリがサブディレクトリーになっている場合は注意です。
また、パーマリンクの設定が「数字ベース」の場合、/archives/news/123 か /news/123/ になります。

このような場合は、true/false を変えてしまうと影響が大きいです。注意しましょう。

追加ボタン

最後に「投稿タイプを追加」ボタンをクリックして保存します。

追加後、管理画面左側に新しいメニュー(例:お知らせ)が表示されます。

カスタムタクソノミーの追加方法

「CPT UI」→「タクソノミーの追加と編集」をクリックします。

以下のような画面が表示されます。

基本的には「投稿タイプ」の追加と同じ流れです。

こちらも投稿タイプと同様、すべての項目は作成後も自由に編集・修正が可能です。

基本設定

  • タクソノミースラッグ(例:customer, genre など)
    タクソノミーのIDです。英小文字で、他と被りにくい名前にしましょう。
  • 複数形ラベル(例:ジャンル)
  • 単数形ラベル(例:ジャンル)
    日本語で分かりやすい名前を付けましょう。
  • 利用する投稿タイプ(複数可)
    「どの投稿タイプに紐付けるか」を選択します(例:先ほど追加した「お知らせ」など)

追加ラベル

全て空欄のままで問題ありません。

設定

ここも多くの設定項目がありますが重要なポイントを中心に解説します。

  • 階層リライト
    これは作成時に必ず決めておきましょう。途中変更は推奨されません。

    ・カテゴリー型(親子関係あり)にしたい場合は「True」
    (例:親「家電」> 子「冷蔵庫」など)

    ・タグ型(単独)にしたい場合は「False」
    (例:新商品、人気など)
  • 管理画面でカラムを表示
    → 「True」に変更します。デフォルト「False」
    こちらを「True」にすると、紐づけした投稿タイプの投稿一覧画面で、このタクソノミー(例:ジャンル)の列が表示され、管理しやすくなります。
  • クイック編集 / 一括編集パネルに表示。
    → 「True」に変更します。デフォルト「False」
    こちらを「True」にすると、紐づけした投稿タイプの投稿一覧画面で、記事のクイック編集で、このタクソノミー(例:ジャンル)の編集ができるようになります。

追加ボタン

最後に「タクソノミーを追加」ボタンをクリックして保存すれば完了です。

管理画面での確認

追加が完了すると、管理画面左メニューに新しい投稿タイプやタクソノミーが表示されるようになります。

これで、通常の投稿やカテゴリと同じ感覚で、カスタム投稿タイプや独自の分類(カスタムタクソノミー)が利用可能になります。

投稿一覧(アーカイブページ)のURL

作成したカスタム投稿タイプで記事を投稿すると、投稿一覧(アーカイブページ)を「アーカイブあり(True)」にしている場合、
以下のようなURLで一覧ページが自動的に作成され、確認できます。

例)https://sample.com/news/

カスタムタクソノミーのタームに属する投稿一覧のURL

作成したカスタムタクソノミー(例:ジャンル)にあるターム(分類名 例:news)ごとの投稿記事の一覧は、以下のURLから確認することができます。

例)ジャンルの「news」というタームに属する投稿記事の一覧ページ
→ https://sample.com/genre/news/

※ジャンルの一覧ページ
→ https://sample.com/genre/ のようなジャンル全体の一覧ページ(タクソノミートップページ)は、WordPress本体では自動生成されません。
必要な場合はショートコード・固定ページや、プラグイン等で実装してください。

作り方はこちらを参考にして下さい。

豊富なオリジナルブロックでLPをかんたんに作成できるLP Creator

LPをかんたんに作成できるLP Creator

デザイン・機能・SEO・収益化にこだわったメディア運営者向け「STREETIST」

デザイン・機能・速度・SEO・収益化にこだわった、ブロガー・メディア運営者向けのデザインテーマ STREETIST

コード(functions.php)で作成する方法(プラグイン無し)

続いて、WordPressのテーマや子テーマのfunctions.phpに直接コードを追加し、カスタム投稿タイプカスタムタクソノミーを作成する手順を解説します。

基本的には上記のプラグインで設定した項目が、コード上で設定できるようになります。

まずは注意事項です。下記のことは必ず覚えておいて下さい

カスタム投稿タイプやカスタムタクソノミーを追加・変更した後は、
必ず「設定」→「パーマリンク設定」→「変更を保存」を押してください。

何も変更しなくてよいので、「変更を保存」ボタンを押します。
これを忘れると、一覧や個別ページが「404」になることがあります。

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

以下のコードをfunctions.phpに追記してください。

functions.php
// カスタム投稿タイプ「トピックス」を追加
function create_topics_post_type() {
    register_post_type('topics',
        array(
            'labels' => array(
                'name' => 'トピックス',
                'singular_name' => 'トピック',
            ),
            'public' => true,
            'has_archive' => true,
            'show_in_rest' => true,
            'menu_icon' => 'dashicons-megaphone',
            'menu_position' => 5,
            'supports' => array('title', 'editor', 'thumbnail'),
            'rewrite' => array('slug' => 'topics', 'with_front' => false),
            'taxonomies' => array('category', 'post_tag'),
        )
    );
}
add_action('init', 'create_topics_post_type');

function create_topics_post_type

  • 「create_topics_post_type」という関数を定義しています。
  • ワードプレスの「初期化処理(init)」のタイミングで呼び出されるよう、後でadd_action(‘init’, ‘create_topics_post_type’);とセットで使います。
  • 関数名は自由につけられます。ここでは「topics(トピックス)というカスタム投稿タイプを作る」ことが目的なので、この名前になっています。

register_post_type

  • register_post_type は、新しいカスタム投稿タイプを登録するためのWordPressの関数です。
  • 第一引数(ここでは 'topics')が、「投稿タイプのスラッグ(ID)」です。
    これはURLやデータベース上で使われる英小文字の識別子です(例:topics)。
    投稿タイプごとに固有で、他の投稿タイプと重複しない名前を指定します。
  • 第二引数には、カスタム投稿タイプの設定(配列)を記述します。

以下が第二引数設定するに主な項目です。

  • labels … 管理画面での表示名になります。日本語OKです。
  • public … 管理画面/フロント両方で表示する場合はtrue
  • has_archive … 一覧ページ(例: /topics/)を有効にしたい場合はtrue。
  • show_in_rest … trueにすると投稿記事の編集画面がブロックエディターになります。デフォルトはfalseでクラシックエディターになります。
  • menu_icon … 管理画面のアイコン。dashicons- から好きなものを指定。
  • menu_position … メニューの表示位置。(例:5は「投稿」の下、20は「固定ページ」の下)
  • supports … タイトル・本文・アイキャッチ画像など、利用したい項目を指定。
    supports の箇所に一覧があります。
  • rewrite … パーマリンクの設定。slugはURLに使う文字列(英小文字)。with_frontはフロントベースの有無。「Custom Post Type UI」の”フロントでのリライト”と同じです。
  • taxonomies … 付随するタクソノミーを選択します。ここでは「カテゴリー」と「タグ」を設定しています。

他にも「Custom Post Type UI」の設定項目と同じオプションがありますので、詳しくは公式ドキュメントをご参照下さい。

カスタムタクソノミーを追加する

続いて、「ブランド」というカスタムタクソノミー(カテゴリー型)を追加する例です。

functions.php
// カスタムタクソノミー「ブランド」を追加
function create_brand_taxonomy() {
    register_taxonomy(
        'brand', // タクソノミースラッグ
        array('topics', 'post'), // 紐付ける投稿タイプを指定
        array(
            'label' => 'ブランド',
            'hierarchical' => true, // true: カテゴリー型、false: タグ型
            'rewrite' => array('slug' => 'brand', 'with_front' => false),
            'show_in_rest' => true,
            'show_admin_column' => true, // 投稿一覧でカラム表示
            'show_in_quick_edit' => true, // クイック編集・一括編集で表示
        )
    );
}
add_action('init', 'create_brand_taxonomy');

function create_brand_taxonomy

これも投稿タイプと同じく、topicsのタクソノミーを関数を定義し、「初期化処理(init)」のタイミングで呼び出しするよう、add_action('init', 'create_brand_taxonomy'); でセットしています。

register_taxonomy

  • register_taxonomyは、新しいカスタムタクソノミーを登録するためのWordPressの関数です。
  • 第一引数(ここでは 'brand')が、「タクソノミーのスラッグ(ID)」です。
  • 第二引数 このタクソノミーを紐付ける投稿タイプのスラッグを指定します。
    (ここでは 先ほど追加したカスタム投稿の topicsと、ワードプレス標準の投稿のpostを追加しています)
  • 第三引数には、カスタムタクソノミーの各設定(配列)を記述します。

以下が第三引数設定するに主な項目です。

  • label … 管理画面で表示されるタクソノミー名
  • hierarchicaltrueでカテゴリー型(親子関係あり)、falseでタグ型(親子関係なし)
  • rewrite … パーマリンクの構造など('slug'でURL、'with_front'でフロントベースの有無を指定)
  • show_in_rest … trueにすると投稿記事の編集画面の右パネルにタクソノミーが表示されます。デフォルトはfalseでクイック編集にしか出てきません。
  • show_admin_column … 投稿一覧画面にタクソノミーの列を表示します。
  • show_in_quick_edit … 投稿一覧のクイック編集で編集可能になります。

他にも「Custom Post Type UI」の設定項目と同じオプションがありますので、詳しくは公式ドキュメントをご参照下さい。

これで管理画面に自動で「トピックス」や「ブランド」が追加されます。

プラグインを使わずにfunctions.phpに直接コードを書くことで、軽量で柔軟なカスタマイズが可能です。
より細かい挙動を調整したい場合や、テーマ・プラグインに依存したくない場合におすすめです。

追加したカスタム投稿・カスタムタクソノミーの投稿一覧を表示する(アーカイブページ)

カスタム投稿タイプの投稿一覧

例えば、カスタム投稿タイプが「topics」の場合、

/topics/ というアーカイブページのURLにアクセスすると、

テーマ内に archive-topics.php というテンプレートファイルがあれば、自動的にそのファイルが使われます

archive-topics.php が無い場合は archive.php

それも無い場合は index.php

という優先順位でテンプレートが選ばれます。

https://sample.com/topics/ にアクセス
→ archive-topics.php → archive.php → index.php の順でテンプレートが選ばれます。

WordPressでは「アーカイブページ」専用のテンプレートである archive.php を用意しておくのが一般的です。

すべての投稿一覧ページが、同じデザインで良い場合archive.php のみあれば問題ありません。

もし、特定のカスタム投稿タイプだけデザインや表示内容を変えたいとかあればarchive-投稿タイプ.php を作成します。

具体的なアーカイブページの作成方法や、サンプルコードについては、
下記の記事で詳しく解説していますので、あわせてご参照ください。

カスタムタクソノミーの投稿一覧

カスタムタクソノミー(例:ジャンル)の「各ターム(分類名)」に属する投稿一覧ページも、カスタム投稿タイプと同じ階層の仕組みで表示されます。

たとえば「ブランド(brand)」のターム「ニュース(news)」に属する記事一覧は、
/brand/news/に一覧が表示されます。

https://sample.com/brand/news/ にアクセス
→ ブランドのニュースに属する記事一覧のみが下記の階層順で読み込まれます。

→ taxonomy-brand.php → taxonomy.php → archive.php → index.php の順でテンプレートが選ばれます。

※「/brand/」のようなカスタムタクソノミー(例:ブランド)の全投稿一覧ページは、WordPress標準では自動生成されません。
必要な場合は、ショートコード・固定ページや、プラグイン等で実装してください。

下記に参考を乗せておきます。

カスタムタクソノミーの全投稿一覧ページを作る方法

ショートコードをfunctions.phpに追加

まず、下記のコードを functions.php に追加して下さい。

指定したカスタムタクソノミーの投稿一覧を表示するショートコードを作る関数になっています。

サンプルとして上記で作成したカスタムタクソノミーの「ブランド(brand)」を例にします。

functions.php
function brand_all_lists() {
    $posts = get_posts([
        'post_type' => 'any', // 全ての投稿タイプ
        'posts_per_page' => 10, // 例えば10件表示
        'orderby' => 'date',  // 公開日の降順
        'order' => 'DESC',
        'tax_query' => array(
            // 指定タクソノミーが「付いている」記事をすべて
            array(
                'taxonomy' => 'brand',   // brandを指定
                'operator' => 'EXISTS',
            ),
        ),
    ]);
    if ( !$posts ) return '記事はありません。';

    $html = '<ul>';
    foreach ($posts as $post) {
        $terms = get_the_terms($post->ID, 'brand');
        $brand = $terms && !is_wp_error($terms) ? esc_html($terms[0]->name) : '';
        $html .= '<li>';
        if ($brand) $html .= '[' . $brand . '] ';
        $html .= '<a href="' . get_permalink($post) . '">' . esc_html($post->post_title) . '</a>';
        $html .= '</li>';
    }
    $html .= '</ul>';
    return $html;
}
add_shortcode('brand_list', 'brand_all_lists');

固定ページを作成

上記で作成したショートコードを埋め込みます。

WordPress管理画面で「固定ページ」を新規作成します。

ページタイトルを「ブランド一覧」などとします。

その本文に[brand_list]を貼り付けて下さい。

公開URLを /brand/ に変更して公開します。(/brand/でなくても構いません。)

これで https://sample.com/brand/ で投稿一覧が表示されます。

※ 単純に表示しているだけですので、見た目やデザインはCSS等で自由に調整してください。

最後に

いかがでしょうか?

カスタム投稿タイプとカスタムタクソノミーの作成方法と、投稿一覧(アーカイブページ)の表示が理解できたと思います。

プラグインを使う方法も、コードで直接追加する方法も、それぞれのメリットがありますので、用途やスキルに合わせて使い分けてみてください。


他にもこんな記事があります。ぜひ御覧ください。