検索キーワードを入力
カテゴリーを選択

初心者必見!WordPressでカスタム投稿タイプを実装する方法(サンプルコード付き)

投稿日:2024年04月08日(月) 更新日:2025年03月01日(土)
初心者必見!WordPressでカスタム投稿タイプを実装する方法(サンプルコード付き)|UMENOKI|すぐに仕事で使えるIT技術情報メディア

みなさんこんにちは!エンジニアの高澤です!

今回はWordPressのカスタム投稿タイプの実装方法ついて解説していきたいと思います。

カスタム投稿タイプとは、「投稿」や「固定ページ」のほかにページを作るための項目をさらに追加することができる機能のことを言います。

このカスタム投稿タイプを使えると、WordPressに商品ページやお知らせなどの項目として記事作成の枠を追加することができるため、サイト運営をわかりやすく効率化することが可能です。

Webサイト制作をされているWordPressエンジニアの方のみならず、ブロガーやウェブ担当者の方も知っておいていただくことで、理想のWordPressサイトを構築することができるきっかけになるかと思いますので、ぜひ当記事をご活用いただけましたら幸いです。

カスタム投稿タイプとは

カスタム投稿タイプとは、あらかじめWordPressに備わっている「投稿」や「固定ページ」とは別に、独自のコンテンツ(例:商品情報、お知らせ、イベント情報、レビューなど)のページ作成項目を追加できる仕組みのことを言います。

もっとわかりやすくいうと、「投稿」や「固定ページ」のほかにページを作るための枠をさらに追加すことと思っていただいて大丈夫です。

ピンとこない方は、WordPress管理画面左メニューにある「投稿」や「固定ページ」のことをイメージしていただけるとわかりやすいかと思います。

そもそも「投稿タイプ」とは「投稿」や「固定ページ」の記事を分類する仕組みのことをいいます。

この投稿タイプに独自の投稿タイプとして作成したものを「カスタム投稿タイプ」といいます。

カスタム投稿タイプを実装する方法

それでは早速カスタム投稿タイプを実装する方法について解説していきたいと思います。

以下のコードをfunctions.phpにコピー&ペーストしていただけますと、カスタム投稿タイプを新規追加することができます。

// カスタム投稿タイプの登録
function create_custom_post_type() {
    // カスタム投稿タイプのラベル
    $labels = array(
        'name'               => __( 'カスタム投稿タイプ' ),
        'singular_name'      => __( 'カスタム投稿' ),
        'add_new'            => __( '新規追加' ),
        'add_new_item'       => __( '新しいカスタム投稿を追加' ),
        'edit_item'          => __( 'カスタム投稿を編集' ),
        'new_item'           => __( '新規カスタム投稿' ),
        'view_item'          => __( 'カスタム投稿を表示' ),
        'search_items'       => __( 'カスタム投稿を検索' ),
        'not_found'          => __( 'カスタム投稿が見つかりません' ),
        'not_found_in_trash' => __( 'ゴミ箱にカスタム投稿はありません' ),
        'parent_item_colon'  => __( '親カスタム投稿:' ),
        'menu_name'          => __( 'カスタム投稿' ),
    );

    // カスタム投稿タイプの設定
    $args = array(
        'labels'             => $labels,
        'description'        => 'カスタム投稿タイプの説明',
        'public'             => true,
        'publicly_queryable' => true,
        'show_ui'            => true,
        'show_in_menu'       => true,
        'query_var'          => true,
        'rewrite'            => array( 'slug' => 'custom-post-type' ), // パーマリンクのスラッグ
        'capability_type'    => 'post',
        'has_archive'        => true,
        'hierarchical'       => false,
        'menu_position'      => null,
        'supports'           => array( 'title', 'editor', 'author', 'thumbnail', 'excerpt', 'comments' ),
    );

    // カスタム投稿タイプの登録
    register_post_type( 'custom_post_type', $args );
}

// initフックでカスタム投稿タイプの登録関数を呼び出す
add_action( 'init', 'create_custom_post_type' );

上記コードでは「custom_post_type」というカスタム投稿タイプ名で新規作成しております。

また、ここでカスタム投稿タイプのラベルとregister_post_type()関数に関して表で解説しておき、ご自身で実装していただく際にご参考にしていただけたらと思います。

最初にカスタム投稿タイプのラベルに関する設定パラメーターの表から解説させていただきます。

ラベルは、WordPressの管理画面での表示や操作に使用されます。

パラメーター名内容
nameカスタム投稿タイプの複数形の名前です。
singular_nameカスタム投稿タイプの単数形の名前です。
add_new新しい投稿を追加するボタンのテキストです。
add_new_item新しい投稿を追加する画面で表示されるテキストです。
edit_item投稿を編集する画面で表示されるテキストです。
new_item新しい投稿を作成する画面で表示されるテキストです。
view_item投稿を表示するリンクのテキストです。
search_items検索フォームのプレースホルダーテキストです。
not_found該当する投稿が見つからなかった場合のメッセージです。
not_found_in_trashゴミ箱内で該当する投稿が見つからなかった場合のメッセージです。
parent_item_colon階層化された投稿の親アイテムのラベルです。
menu_name管理メニューでのカスタム投稿タイプの名前です。

上記をご確認いただき、ご自身の作成したい投稿タイプ名に合わせてカスタマイズしてください。

以下に、register_post_type() 関数の全てのパラメーター名と簡単な説明、および初期値を以下の表におまとめいたしましたので、こちらもカスタマイズの際にご参考にしていただけましたら幸いです。

パラメーター名内容初期値
labelsカスタム投稿タイプのラベルを指定します。空の配列
descriptionカスタム投稿タイプの説明を指定します。空の文字列
publicカスタム投稿タイプを公開するかどうかを指定します。false
publicly_queryableカスタム投稿タイプをクエリ可能にするかどうかを指定します。設定されていない場合は publicの値を継承します
exclude_from_search検索結果から除外するかどうかを指定します。設定されていない場合はパラメーターのpublicの値を継承します
show_uiユーザーインターフェースを表示するかどうかを指定します。設定されていない場合はパラメーターのpublicの値を継承します
show_in_menu管理メニューにカスタム投稿タイプを表示するかどうかを指定します。設定されていない場合はパラメーターのshow_uiの値を継承します
show_in_nav_menusナビゲーションメニューにカスタム投稿タイプを表示するかどうかを指定します。設定されていない場合はパラメーターのpublicの値を継承します
show_in_admin_bar管理バーにカスタム投稿タイプを表示するかどうかを指定します。設定されていない場合はパラメーターのshow_in_menuの値を継承します
menu_position理メニュー内の表示位置を指定します。null
menu_icon管理メニューでのアイコンを指定します。空の文字列
capability_type権限の種類を指定します。‘post’
capabilities権限の設定を指定します。null
map_meta_capメタキャパビリティをマップするかどうかを指定します。null
supportsサポートする投稿タイプを指定します。array( ‘title’, ‘editor’ )
register_meta_box_cbメタボックスを登録するコールバック関数を指定します。null
taxonomiesカスタム投稿タイプに関連付けるタクソノミーを指定します。空の配列
has_archiveアーカイブページを有効にするかどうかを指定します。false
rewriteパーマリンク構造を指定します。true
query_varクエリ変数名を指定します。true
can_exportエクスポート可能かどうかを指定します。true
delete_with_userユーザーが削除された際に関連する投稿を削除するかどうかを指定します。null

また合わせて、register_post_type()関数のWordPressの公式リファレンスのページを以下のURLにてご確認いただけますので、ご確認いただけましたら幸いです。

コードをfunctions.phpにコピー&ペーストして保存が完了したら、管理画面を更新することで管理画面左メニューに記述したカスタム投稿タイプが新規追加されているのが確認できるかと思います。

皆さんは無事作成できましたでしょうか?

カスタムタクソノミーと合わせて実装する方法

カスタム投稿タイプとセットでしばしば実装されるのがカスタムタクソノミーです。

カスタムタクソノミーとは、「投稿」投稿タイプにデフォルトで設定されている「カテゴリー」や「タグ」のことをタクソノミーといいますが、独自のタクソノミーとして作成されたものがカスタムタクソノミーといいます。

当記事ではせっかくなので、カスタムタクソノミーの新規作成も合わせて実装コードをご紹介させていただきます。

以下のコードをfunctions.phpにコピー&ペーストしてください。

// カスタムタクソノミーの登録
function create_custom_taxonomy() {
    $labels = array(
        'name'              => _x( 'カスタムタクソノミー', 'taxonomy general name' ),
        'singular_name'     => _x( 'カスタムタクソノミー', 'taxonomy singular name' ),
        'search_items'      => __( 'カスタムタクソノミーを検索' ),
        'all_items'         => __( 'すべてのカスタムタクソノミー' ),
        'parent_item'       => __( '親カスタムタクソノミー' ),
        'parent_item_colon' => __( '親カスタムタクソノミー:' ),
        'edit_item'         => __( 'カスタムタクソノミーを編集' ),
        'update_item'       => __( 'カスタムタクソノミーを更新' ),
        'add_new_item'      => __( '新しいカスタムタクソノミーを追加' ),
        'new_item_name'     => __( '新しいカスタムタクソノミー名' ),
        'menu_name'         => __( 'カスタムタクソノミー' ),
    );

    $args = array(
        'hierarchical'      => true, // trueであればカテゴリー、falseであればタグのようになります
        'labels'            => $labels,
        'show_ui'           => true,
        'show_admin_column' => true,
        'query_var'         => true,
        'rewrite'           => array( 'slug' => 'custom-taxonomy' ), // パーマリンクのスラッグ
    );

    // カスタムタクソノミーの登録
    register_taxonomy( 'custom_taxonomy', array( 'custom_post_type' ), $args );
}

// initフックでカスタムタクソノミーの登録関数を呼び出す
add_action( 'init', 'create_custom_taxonomy', 0 );

上記はカスタムタクソノミーを新規で追加実装するコードになります。

また、別パターンとして以下カスタム投稿タイプとカスタムタクソノミーを組み合わせたバージョンの実装コードを載せておきます。

よろしければ実装でご活用ください。

// カスタム投稿タイプの登録
function create_custom_post_type() {
    // カスタム投稿タイプのラベル
    $labels = array(
        'name'               => __( 'カスタム投稿タイプ' ),
        'singular_name'      => __( 'カスタム投稿' ),
        'add_new'            => __( '新規追加' ),
        'add_new_item'       => __( '新しいカスタム投稿を追加' ),
        'edit_item'          => __( 'カスタム投稿を編集' ),
        'new_item'           => __( '新規カスタム投稿' ),
        'view_item'          => __( 'カスタム投稿を表示' ),
        'search_items'       => __( 'カスタム投稿を検索' ),
        'not_found'          => __( 'カスタム投稿が見つかりません' ),
        'not_found_in_trash' => __( 'ゴミ箱にカスタム投稿はありません' ),
        'parent_item_colon'  => __( '親カスタム投稿:' ),
        'menu_name'          => __( 'カスタム投稿' ),
    );

    // カスタム投稿タイプの設定
    $args = array(
        'labels'             => $labels,
        'description'        => 'カスタム投稿タイプの説明',
        'public'             => true,
        'publicly_queryable' => true,
        'show_ui'            => true,
        'show_in_menu'       => true,
        'query_var'          => true,
        'rewrite'            => array( 'slug' => 'custom-post' ), // パーマリンクのスラッグ
        'capability_type'    => 'post',
        'has_archive'        => true,
        'hierarchical'       => false,
        'menu_position'      => null,
        'supports'           => array( 'title', 'editor', 'author', 'thumbnail', 'excerpt', 'comments' ),
    );

    // カスタム投稿タイプの登録
    register_post_type( 'custom_post', $args );


    // カスタムタクソノミーのラベル
    $labels = array(
        'name'              => _x( 'カスタムタクソノミー', 'taxonomy general name' ),
        'singular_name'     => _x( 'カスタム分類', 'taxonomy singular name' ),
        'search_items'      => __( 'カスタムタクソノミーを検索' ),
        'all_items'         => __( 'すべてのカスタムタクソノミー' ),
        'parent_item'       => __( '親カスタムタクソノミー' ),
        'parent_item_colon' => __( '親カスタムタクソノミー:' ),
        'edit_item'         => __( 'カスタムタクソノミーを編集' ),
        'update_item'       => __( 'カスタムタクソノミーを更新' ),
        'add_new_item'      => __( '新しいカスタムタクソノミーを追加' ),
        'new_item_name'     => __( '新しいカスタムタクソノミー名' ),
        'menu_name'         => __( 'カスタムタクソノミー' ),
    );

    $args = array(
        'hierarchical'      => true, // trueでカテゴリーのように、falseでタグのようになります
        'labels'            => $labels,
        'show_ui'           => true,
        'show_admin_column' => true,
        'query_var'         => true,
        'rewrite'           => array( 'slug' => 'custom-taxonomy' ), // パーマリンクのスラッグ
    );

    // カスタムタクソノミーの登録
    register_taxonomy( 'custom_taxonomy', array( 'custom_post' ), $args );
}

// initフックでカスタム投稿タイプの登録関数を呼び出す
add_action( 'init', 'create_custom_post_type' );

コードをfunctions.phpにコピー&ペーストして保存が完了したら、管理画面を更新することで管理画面左メニューに記述したカスタムタクソノミーが新規追加されているのが確認できるかと思います。

皆さんは無事作成できましたでしょうか?

作成したカスタム投稿タイプの記事ページが表示されない場合の対処法

ここまでで解説してきたコードをうまく使っていただき無事カスタム投稿タイプを実装することができたかと思いますが、いざ記事を投稿してURLからアクセスした時にその記事ページが表示されない!?といった問題が起こった方がいらっしゃるのではないでしょうか?

それは以下の手順で解決することができます。

WordPress管理画面左メニューの「設定」→「パーマリンク」の順でパーマリンク設定のページへ進みます。

そしたら「変更を保存」ボタンをクリックしてください。

クリックが完了すると以下の処理が行われて、記事ページが表示されるようになるかと思います。

  • 新しいパーマリンク設定をデータベースに保存
  • リライトルールの更新
  • .htaccessの更新(Apache環境)
  • キャッシュのクリア
  • サイト内のURLを新しいパーマリンク構造に適用

念の為解説させていただきます。

まず、ユーザーが選択した下図のパーマリンクの設定がデータベースのwp_optionsテーブルに保存されます。これにより、新しいパーマリンク構造が記録され、WordPressが適切にURLを処理できるようになります。

次に、リライトルール(Rewrite Rules)が更新されます。これは、WordPressがリクエストされたURLを正しく処理するために必要な設定です。

この更新はflush_rewrite_rules()関数を使って行われ、内部的にはwp_rewriteクラスの処理を通じて新しいルールが生成されます。

また、Apache環境でWordPressが動作している場合は、.htaccessファイルが更新されます。このファイルは、WordPressが適切にリクエストを処理できるようにするための重要な設定ファイルです。

さらに、キャッシュプラグインが有効になっている場合は、パーマリンク変更後にキャッシュがクリアされることがあります。これにより、ユーザーがすぐに新しいパーマリンク設定でサイトを閲覧できるようになります。

最後に、サイト内の投稿やページのパーマリンクが、新しい設定に基づいて適用されます。これにより、フロントエンドで表示されるURLが変更後のものになります。

ただし、変更前のURLは使えなくなるため、SEOに配慮したい場合は必要に応じてリダイレクトの設定を行うことが推奨されます。

この一連の処理により、WordPressは新しいパーマリンク構造に対応し、適切にURLを処理できるようになります。

エディタをブロックエディタに対応させる方法

カスタム投稿タイプを実装したのはいいものの、クラシックエディタの状態になっている可能性があります。

クラシックエディタで問題なければいいのですが、最新式のブロックエディタを使いたい場合があるかと思います。

そこで、ブロックエディタを使用したい場合はregister_post_type()関数のパラメーターに以下のコードを追加してください。

'show_in_rest' => true,

「show_in_rest」を「true」を指定してあげると編集管理画面がブロックエディタに変更されます。

逆にいうと値を「false」に変更するとブロックエディタに変更することが可能です。

ご参考にしていただけましたら幸いです。

カスタム投稿タイプの記事一覧を表示する方法

カスタム投稿タイプの記事一覧を表示する方法について解説いたします。

表示する方法としては、以下があります。

  • テーマファイルにarchive.phpがある場合
  • テーマファイルにarchive-{カスタム投稿タイプ名}.phpがある場合
  • WordPressサブループで表示する場合

それぞれ解説いたします。

テーマファイルにarchive.phpがある場合

WordPressでは、アーカイブページ(一覧ページ)のテンプレートとしてarchive.phpがデフォルトで使用されます。

カスタム投稿タイプ専用のテンプレート(archive-{カスタム投稿タイプ名}.php)が存在しない場合、このarchive.phpが適用され、カスタム投稿タイプの記事一覧が表示されます。

例えば、カスタム投稿タイプ「news」を作成し、「https://example.com/news/」にアクセスすると、archive.phpが自動的に適用されます。

ここで注意点として、以下のようにregister_post_type()関数のパラメーターの「has_archive」で「true」が指定されていることが条件になりますので、trueを指定するようにしてください。

'has_archive' => true,

このテンプレートでは have_posts()関数などでのWordPressループを使用し、投稿データを取得・表示できます。また、get_post_type()関数を使ってカスタム投稿タイプごとに異なるデザインを適用することも可能です。

ただし、archive.phpでは全てのアーカイブページに適用されるため、特定のカスタム投稿タイプ専用のデザインを適用するには archive-{カスタム投稿タイプ名}.php を作成する方が一番スマートです。

テーマファイルにarchive-{カスタム投稿タイプ名}.phpがある場合

WordPressでは、カスタム投稿タイプごとに専用のアーカイブテンプレートを作成できます。例えば、newsというカスタム投稿タイプ用の一覧ページを作る場合、archive-news.phpを作成すると、「https://example.com/news/」にアクセスした際にこのテンプレートが適用されます。

これにより、特定のカスタム投稿タイプ専用のレイアウトやスタイルを自由にカスタマイズできます。テンプレートの内容はarchive.phpをベースにしつつ、デザインや表示形式を変更することで、カスタム投稿タイプに適したレイアウトを作成できます。

WordPressサブループで表示する場合

サブループ(WP_Queryクラスや get_posts()関数など)を使用すると、任意のページやウィジェット内にカスタム投稿タイプの記事一覧を表示できます。

例えば、トップページに特定のカスタム投稿タイプの記事を表示したい場合、WP_Queryを使ってパラメーターに「post_type」を指定すれば、必要な記事のみ取得できます。

例えば、以下のコードを使うと、「custom_post_type」というカスタム投稿タイプ名の最新の5件の記事を表示できます。

<?php
$custom_query = new WP_Query(array(
    'post_type'      => 'custom_post_type',
    'posts_per_page' => 5
));

if ($custom_query->have_posts()) :
    while ($custom_query->have_posts()) : $custom_query->the_post();
        echo '<a href="' . get_permalink() . '">' . get_the_title() . '</a><br>';
    endwhile;
    wp_reset_postdata();
endif;

この方法を使えば、トップページやサイドバーなど、任意の場所にカスタム投稿タイプの記事を柔軟に配置できます。

WordPressループについてよくわからなかったり、より詳しく知りたい方は、以下の記事で解説しておりますので、よろしければご活用ください。

カスタム投稿タイプ専用の詳細ページを作成する方法

カスタム投稿タイプ専用の詳細ページを表示する方法について解説いたします。

表示する方法としては、以下があります。

  • テーマファイルにsingle.phpがある場合
  • テーマファイルにsingle-{カスタム投稿タイプ名}.phpがある場合

それぞれ解説いたします。

テーマファイルにsingle.phpがある場合

WordPressにはsingle.phpというデフォルトのテンプレートファイルがあり、カスタム投稿タイプ専用の single-{カスタム投稿タイプ名}.php が存在しない場合、このsingle.phpによってカスタム投稿タイプの記事詳細ページが表示されます。

例えば、カスタム投稿タイプ「news」の記事詳細ページにアクセスした場合、single-news.phpがなければsingle.phpが適用されます。(逆にsingle-news.phpがあればsingle-news.phpが優先で適用されるということです)

この場合、single.phpのコードを編集することで、カスタム投稿タイプにも適用できるデザインを作成可能です。

ただし、すべての投稿(通常の投稿やカスタム投稿タイプ)に同じレイアウトが適用されるため、カスタム投稿タイプごとのデザインを分けたい場合は、次に説明する「single-{カスタム投稿タイプ名}.php」が適しています。

テーマファイルにsingle-{カスタム投稿タイプ名}.phpがある場合

single-{カスタム投稿タイプ名}.php を作成すれば、個別記事の詳細ページも独自にカスタマイズできます。

例えば、「news」というカスタム投稿タイプに専用の詳細ページを用意するには、以下のようなsingle-news.phpファイルを作成します。

single-【カスタム投稿タイプ名】.php

↓以下のようにテンプレートを作成します。
single-news.php

このように、特定のカスタム投稿タイプを運用する場合は、専用のテンプレートを作成することでより柔軟なデザインが可能になります。

まとめ

カスタム投稿タイプを実装する方法の解説は以上になります。

カスタム投稿タイプとは、「投稿」や「固定ページ」に加えて、独自の項目(例:商品ページやお知らせ)を追加できるWordPressの機能です。

この機能を活用すれば、記事の管理がしやすくなり、サイト運営をより効率化できます。WordPressエンジニアはもちろん、ブロガーやウェブ担当者の方にとっても、理想のサイトを構築するための大きな助けとなるでしょう。

また、カスタム投稿タイプの実装はWordPressエンジニアにとっては必須のスキルといっても過言ではありません。

カスタム投稿タイプを活用して、より分かりやすく整理されたWebサイトを作成してみてください。。

執筆者

UMENOKI編集部 高澤 翔汰

歴5年目(2024年8月以降から5年目です)のエンジニアです!
CMSでのサイト構築とWebデザイン制作を兼任して5年目になります。
自作のiOSアプリ(iPhoneアプリ)やWordPressプラグインを開発することもあり、まだまだ現在進行形で勉強中です!

お気軽に皆さんのご要望をお聞かせください!

どんなに些細なことでも構いません!よろしければ記事や当サイトへの「こんな記事があったら仕事とかで役に立つな〜」や「こうだったらもっと役に立つのに!」といったようなご要望等をお気軽にお聞かせください!今後のサービス改善にお役立てさせていただきます!

例1)Reactの技術記事を書いてほしい!
例2)WordPressの使い方とかを初心者向けに解説してほしい!...など

送信と同時にプライバシーポリシーに同意したものとします。