初心者必見!WordPressでカスタム投稿タイプを実装する方法
みなさんこんにちは!エンジニアの高澤です!
今回はWordPressのカスタム投稿タイプの実装方法ついて解説していきたいと思います。
目次
カスタム投稿タイプとは
カスタム投稿タイプとは、特定の複数の記事データをグループ単位で区切った独自の投稿タイプのことをいいます。
ピンとこない方は、WordPress管理画面左メニューにある「投稿」や「固定ページ」のことをイメージしていただけるとわかりやすいかと思います。
そもそも「投稿タイプ」とは「投稿」や「固定ページ」の記事をグループごと分類する仕組みのことをいいます。
この投稿タイプに独自の投稿タイプとして作成したものを「カスタム投稿タイプ」といいます。
カスタム投稿タイプを実装する方法
それでは早速カスタム投稿タイプを実装する方法について解説していきたいと思います。
以下のコードをfunctions.phpにコピー&ペーストしていただけますと、カスタム投稿タイプを新規追加することができます。
// カスタム投稿タイプの登録
function create_custom_post_type() {
// カスタム投稿タイプのラベル
$labels = array(
'name' => __( 'Custom Post Types' ),
'singular_name' => __( 'Custom Post Type' ),
'add_new' => __( 'Add New' ),
'add_new_item' => __( 'Add New Custom Post Type' ),
'edit_item' => __( 'Edit Custom Post Type' ),
'new_item' => __( 'New Custom Post Type' ),
'view_item' => __( 'View Custom Post Type' ),
'search_items' => __( 'Search Custom Post Types' ),
'not_found' => __( 'No custom post types found' ),
'not_found_in_trash' => __( 'No custom post types found in Trash' ),
'parent_item_colon' => __( 'Parent Custom Post Type:' ),
'menu_name' => __( 'Custom Post Types' ),
);
// カスタム投稿タイプの設定
$args = array(
'labels' => $labels,
'description' => 'Description of Custom Post Type',
'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 | カスタム投稿タイプの複数形の名前です。 | ‘Custom Post Types’ |
singular_name | カスタム投稿タイプの単数形の名前です。 | ‘Custom Post Type’ |
add_new | 新しい投稿を追加するボタンのテキストです。 | ‘Add New’ |
add_new_item | 新しい投稿を追加する画面で表示されるテキストです。 | ‘Add New Custom Post Type’ |
edit_item | 投稿を編集する画面で表示されるテキストです。 | ‘Edit Custom Post Type’ |
new_item | 新しい投稿を作成する画面で表示されるテキストです。 | ‘New Custom Post Type’ |
view_item | 投稿を表示するリンクのテキストです。 | ‘View Custom Post Type’ |
search_items | 検索フォームのプレースホルダーテキストです。 | ‘Search Custom Post Types’ |
not_found | 該当する投稿が見つからなかった場合のメッセージです。 | ‘No custom post types found’ |
not_found_in_trash | ゴミ箱内で該当する投稿が見つからなかった場合のメッセージです。 | ‘No custom post types found in Trash’ |
parent_item_colon | 階層化された投稿の親アイテムのラベルです。 | ‘Parent Custom Post Type:’ |
menu_name | 管理メニューでのカスタム投稿タイプの名前です。 | ‘Custom Post Types’ |
上記をご確認いただき、ご自身の作成したい投稿タイプ名に合わせてカスタマイズしてください。
以下に、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( 'Custom Taxonomies', 'taxonomy general name' ),
'singular_name' => _x( 'Custom Taxonomy', 'taxonomy singular name' ),
'search_items' => __( 'Search Custom Taxonomies' ),
'all_items' => __( 'All Custom Taxonomies' ),
'parent_item' => __( 'Parent Custom Taxonomy' ),
'parent_item_colon' => __( 'Parent Custom Taxonomy:' ),
'edit_item' => __( 'Edit Custom Taxonomy' ),
'update_item' => __( 'Update Custom Taxonomy' ),
'add_new_item' => __( 'Add New Custom Taxonomy' ),
'new_item_name' => __( 'New Custom Taxonomy Name' ),
'menu_name' => __( 'Custom Taxonomy' ),
);
$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' => __( 'Custom Post Types' ),
'singular_name' => __( 'Custom Post Type' ),
'add_new' => __( 'Add New' ),
'add_new_item' => __( 'Add New Custom Post Type' ),
'edit_item' => __( 'Edit Custom Post Type' ),
'new_item' => __( 'New Custom Post Type' ),
'view_item' => __( 'View Custom Post Type' ),
'search_items' => __( 'Search Custom Post Types' ),
'not_found' => __( 'No custom post types found' ),
'not_found_in_trash' => __( 'No custom post types found in Trash' ),
'parent_item_colon' => __( 'Parent Custom Post Type:' ),
'menu_name' => __( 'Custom Post Types' ),
);
// カスタム投稿タイプの設定
$args = array(
'labels' => $labels,
'description' => 'Description of Custom Post Type',
'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 );
$labels = array(
'name' => _x( 'Custom Taxonomies', 'taxonomy general name' ),
'singular_name' => _x( 'Custom Taxonomy', 'taxonomy singular name' ),
'search_items' => __( 'Search Custom Taxonomies' ),
'all_items' => __( 'All Custom Taxonomies' ),
'parent_item' => __( 'Parent Custom Taxonomy' ),
'parent_item_colon' => __( 'Parent Custom Taxonomy:' ),
'edit_item' => __( 'Edit Custom Taxonomy' ),
'update_item' => __( 'Update Custom Taxonomy' ),
'add_new_item' => __( 'Add New Custom Taxonomy' ),
'new_item_name' => __( 'New Custom Taxonomy Name' ),
'menu_name' => __( 'Custom Taxonomy' ),
);
$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_post_type' );
コードをfunctions.phpにコピー&ペーストして保存が完了したら、管理画面を更新することで管理画面左メニューに記述したカスタムタクソノミーが新規追加されているのが確認できるかと思います。
皆さんは無事作成できましたでしょうか?
作成したカスタム投稿タイプの記事ページが表示されない場合の対処法
ここまでで解説してきたコードをうまく使っていただき無事カスタム投稿タイプを実装することができたかと思いますが、いざ記事を投稿してURLからアクセスした時にその記事ページが表示されない!?といった問題が起こった方がいらっしゃるのではないでしょうか?
それは以下の手順で解決することができます。
WordPress管理画面左メニューの「設定」→「パーマリンク」の順でパーマリンク設定のページへ進みます。
そしたら「変更を保存」ボタンをクリックしてください。
クリックが完了すると以下の処理が行われて、記事ページが表示されるようになるかと思います。
- 新しいパーマリンク設定の適用
- .htaccess ファイルの更新
- データベースの更新
- リダイレクトの設定
- キャッシュのクリア
念の為それぞれ解説させていただきます。
新しいパーマリンク設定の適用
新しいパーマリンク構造が適用されます。これにより、サイト上の投稿やページのURLが変更されます。
.htaccess ファイルの更新
Apache サーバーを使用している場合、WordPressは新しいパーマリンク構造を .htaccess ファイルに反映させるために変更を加えます。
これにより、リライトルールが更新され、新しいパーマリンクが機能するようになります。
データベースの更新
パーマリンク設定の変更は、WordPressのデータベースにも反映されます。これにより、WordPressは新しいパーマリンク構造を参照してコンテンツを提供するようになります。
リダイレクトの設定
パーマリンクが変更された場合、古いURLから新しいURLへのリダイレクトが自動的に設定されます。これにより、過去にインデックスされた古いURLがリダイレクトされ、SEOの影響を最小限に抑えることができます。
キャッシュのクリア
キャッシュプラグインや CDN を使用している場合、パーマリンクの変更後にキャッシュがクリアされます。これにより、サイト訪問者が新しいパーマリンク構造のページを表示できるようになります。
無事カスタム投稿タイプのページが表示されましたでしょうか?
エディタをブロックエディタに対応させる方法
カスタム投稿タイプを実装したのはいいものの、クラシックエディタの状態になっている可能性があります。
クラシックエディタで問題なければいいのですが、最新式のブロックエディタを使いたい場合があるかと思います。
そこで、ブロックエディタを使用したい場合はregister_post_type()関数のパラメーターに以下のコードを追加してください。
'show_in_rest' => true,
「show_in_rest」を「true」を指定してあげると編集管理画面がブロックエディタに変更されます。
逆にいうと値を「false」に変更するとブロックエディタに変更することが可能です。
ご参考にしていただけましたら幸いです。
まとめ
カスタム投稿タイプを実装する方法の解説は以上になります。
カスタム投稿タイプの実装はWordPressエンジニアにとっては必須のスキルといっても過言ではありません。
また、カスタム投稿タイプを実装できることはWordPressの可能性を格段に広けることができるようになるため、よろしければぜひ当記事をご活用いただけますと幸いです。
お気軽に皆さんのご要望をお聞かせください!
どんなに些細なことでも構いません!よろしければ記事や当サイトへの「こんな記事があったら仕事とかで役に立つな〜」や「こうだったらもっと役に立つのに!」といったようなご要望等をお気軽にお聞かせください!今後のサービス改善にお役立てさせていただきます!
例1)Reactの技術記事を書いてほしい!
例2)WordPressの使い方とかを初心者向けに解説してほしい!...など