参考記事
カテゴリー順で並べる！WP_Query応用テクニック
WordPressの標準機能では直接カテゴリー順に投稿を並べることができませんが、カテゴリー一覧を取得してループ処理を組み合わせることで実現できます。複数のカテゴリーを含む投稿一覧を、カテゴリー順に並べて表示する実践的なテクニックを詳しく解説します。
WordPressカスタム投稿タイプ前編：カフェメニューの作成と投稿
- 2025/08/04
- BASICS
- WordPressの基礎
- 0comments
- 55views
- 約12分で読めます
- 36
前回の記事では、独自のタクソノミーを作成し、投稿の分類を細かく管理する方法を学習しました。
今回は、WordPressの標準投稿とは別の「投稿タイプ」を作成するカスタム投稿タイプについて詳しく解説します。
2回に分けて学習し、今回はカスタム投稿タイプの作成と投稿、次回は表示方法を扱います。
今回の目標
- カスタム投稿タイプの概念を理解する
- register_post_type関数の基本を習得する
- カフェメニューのカスタム投稿タイプを実装する
- 実際にメニューデータを投稿する
目次
カスタム投稿タイプとは？
企業サイトや複合的なWebサイトを運営していると、以下のような課題に直面することがあります。
運営上の課題例
- 会社のお知らせとスタッフブログを同じ「投稿」で管理しているが、性質が全く違う
- イベント情報には日時・場所・参加費など専用の項目が必要だが、通常の投稿フォーマットでは不便
- レストランのメニューを投稿で管理しているが、料理の写真・価格・カテゴリーなど特有の要素が多い
このような場合、WordPressの標準機能である「カテゴリー」で分類することは可能です。しかし、根本的に性質の異なるコンテンツを同じ「投稿」として扱うことで、以下の問題が生じます。
カテゴリー分けだけでは不十分な理由
- 管理画面での混在：お知らせとブログ記事が同じ投稿一覧に表示され、管理が煩雑
- 投稿フォーマットの統一：すべて同じ入力項目になるため、コンテンツ特有の項目を追加しにくい
- URL構造の制約：すべて
/投稿名/の形式になり、コンテンツタイプを表現できない - 権限管理の複雑さ：異なる担当者が管理する場合、細かな権限設定が困難
この問題を解決するのがカスタム投稿タイプです。
WordPress標準の「投稿」とは完全に独立した新しい投稿タイプを作成することで、コンテンツの性質に応じた最適な管理・表示環境を構築できます。
標準投稿とカスタム投稿タイプの違い
標準投稿の場合
- すべて同じ「投稿」として管理される
- カテゴリーやタグで分類はできるが、管理画面で混在する
- 投稿フォーマットや表示項目が統一される
カスタム投稿タイプの場合
- 投稿タイプごとに完全に分離して管理できる
- それぞれ異なる投稿フォーマットを設定可能
- 管理画面のメニューも別々に表示される
カフェメニューを例にカスタム投稿を作る
今回は実例として「カフェメニュー」のカスタム投稿タイプを作成します。
※この記事では、WordPressのナビゲーションメニューと区別するため「カフェメニュー」と表現します。
なぜカフェメニューにカスタム投稿が適しているか
- メニュー項目は通常のブログ投稿とは性質が異なる
- 価格、カテゴリー（ホット/アイス/フード）など専用の項目が必要
- 通常の投稿と分けて管理することで、運用がしやすくなる
カスタム投稿の作り方
functions.phpに以下のコードを追加します。
最低限のコード
add_action('init', function() {
register_post_type(
'menu_post',
array()
);
});これがカスタム投稿を作成する最低限のコードですが、実用的ではありません。実際は多くの設定を追加する必要があります。
functions.php
add_action('init', function() {
register_post_type(
'menu_post',
array(
'labels' => array(
'name' => __('カフェメニュー'),
'all_items' => __('カフェメニュー一覧'),
'add_new' => __('カフェメニューを追加する'),
'add_new_item' => __('カフェメニューの追加'),
'edit_item' => __('カフェメニューの編集'),
'singular_name' => __('カフェメニュータイプ'),
'new_item' => __('新しいカフェメニュー'),
'view_item' => __('カフェメニューを見る'),
'search_items' => __('カフェメニューを探す'),
'not_found' => __('カフェメニューはありません'),
'not_found_in_trash' => __('ゴミ箱にカフェメニューはありません'),
),
'public' => true,
'hierarchical' => false,
'supports' => array(
'title',
'editor',
'page-attributes'
),
'rewrite' => array(
'slug' => 'menu',
'with_front' => false,
),
'menu_icon' => 'dashicons-food',
)
);
});コードの詳細説明
第1引数：投稿タイプ名（menu_post）
register_post_type('menu_post', ...);- システム内部で使用される識別子
- WordPressでは固定ページが「page」、標準の投稿が「post」として登録されている
- 英数字とアンダースコアのみ使用可能 20文字以内にする必要がある
- 一度決めたら変更しない（データベースに保存されるため）
labels配列：管理画面での表示名
'labels' => array(
'name' => __('カフェメニュー'), // メニュー名
'all_items' => __('カフェメニュー一覧'), // 「すべての○○」
'add_new' => __('カフェメニューを追加する'), // 「新規追加」ボタン
'add_new_item' => __('カフェメニューの追加'), // 新規作成ページタイトル
'edit_item' => __('カフェメニューの編集'), // 編集ページタイトル
// ... 以下省略
),これらの設定により、管理画面の表示が自然な日本語になります。
public：一般公開設定
'public' => true,true：Webサイト上で表示可能、管理画面にメニュー表示false：管理画面のみで使用（非公開）
hierarchical：階層構造の設定
'hierarchical' => true,false：投稿タイプ（ブログ記事のような扱い）true：固定ページタイプ（親子関係を持てる）
supports：編集画面で使用する機能
'supports' => array(
'title', // タイトル欄
'editor', // 本文編集欄
'page-attributes' // 並び順設定
),メニューの場合、タイトル（メニュー名）、説明文（editor）、表示順序が重要なため、この3つを指定しています。
その他の指定可能な項目：
'thumbnail'：アイキャッチ画像'excerpt'：抜粋'comments'：コメント機能
標準のカテゴリーとタグを使用可能にします。
rewrite：URL構造の設定
'rewrite' => array(
'slug' => 'menu',
'with_front' => false,
),slug：URLに使用されるスラッグ（例：/menu/ブレンド/）with_front：WordPressのパーマリンク設定の前部分を含むかどうか
with_frontの動作例
投稿のパーマリンク設定が /news/%post_id% の場合
with_front => true：/news/menu/ブレンド/with_front => false：/menu/ブレンド/
今回は「投稿（お知らせ）」と「カフェメニュー」は関連性のない独立したコンテンツのため、false に設定して /menu/ブレンド/ のように独立したURL構造にしています。
rewrite設定全体を省略した場合の動作
rewrite設定を行わない場合、投稿タイプ名「menu_post」がそのままURLに使用されます（例：/menu_post/ブレンド/）。ユーザーにとって分かりやすいURL構造にするため、slug menu」に変更しています。
menu_icon：管理画面のアイコン
'menu_icon' => 'dashicons-food',管理画面のサイドメニューに表示されるアイコンを指定します。利用可能なアイコンは WordPress Dashiconsページ で確認できます。
動作確認
functions.phpにコードを追加後、WordPress管理画面を確認してみましょう。
サイドメニューに「カフェメニュー」が追加されていることを確認できれば成功です。
カスタム投稿用のタクソノミーを追加
なぜタクソノミーを追加するのか？
カスタム投稿タイプには、標準投稿のようにカテゴリーやタグが最初から付いていません。カフェメニューを「ドリンク」や「フード」のように分類するためには、自分でタクソノミーを追加する必要があります。
ようするに標準の投稿は
register_post_typeで投稿タイプ「post」を作成register_taxonomyで階層型タクソノミー「category」を「post」に追加register_taxonomyで非階層型タクソノミー「post_tag」を「post」に追加
していることになります。
なおタクソノミーの基本概念については前々回の記事で解説していますので、詳細はそちらをご確認ください。ここでは、カフェメニュー専用のタクソノミーを実装していきます。
メニューカテゴリーのタクソノミーを作成
functions.phpに以下のコードを追加します。
functions.php
add_action('init', function() {
register_taxonomy(
'tax-menu', // タクソノミーのスラッグ
'menu_post', // 適用先の投稿タイプ
array(
'labels' => array( // 表示ラベル設定
'name' => 'メニューカテゴリー', // 一覧名
'singular_name' => 'メニューカテゴリー', // 単数形
'search_items' => 'メニューカテゴリーを検索', // 検索時ラベル
'all_items' => 'すべてのメニューカテゴリー', // 一覧表示ラベル
'parent_item' => '親メニューカテゴリー', // 親要素ラベル（階層ありの場合）
'parent_item_colon' => '親メニューカテゴリー：', // 親要素ラベル（フォーム用）
'edit_item' => 'メニューカテゴリーの編集', // 編集画面ラベル
'update_item' => 'メニューカテゴリーを更新', // 更新時ラベル
'add_new_item' => '新しいメニューカテゴリーを追加', // 追加時ラベル
'new_item_name' => '新しいメニューカテゴリー名', // 新規名ラベル
'menu_name' => 'メニューカテゴリー', // 管理メニューでの表示名
),
'hierarchical' => true, // 階層設定
'public' => true, // 公開設定
'show_in_rest' => true, // REST API対応
'show_admin_column' => true, // 管理画面表示
'show_in_quick_edit' => true, // クイック編集対応
'show_in_nav_menus' => true, // メニュー表示
'query_var' => 'menu-category', // クエリ変数名
'rewrite' => array( // パーマリンク設定
'slug' => 'menu-category', // URLのスラッグ
'with_front' => false, // 投稿の先頭スラッグを付ける
),
)
);
});カスタム投稿にタクソノミーを追加する場合は、２番目のパラメーターに投稿タイプ名を指定します。ここではカスタム投稿「menu_post」に階層型「tax-menu」タクソノミーを追加しています。
実際にカフェメニューを登録してみる
作成したカスタム投稿タイプを使って、実際のメニューデータを投稿してみましょう。操作方法は標準の投稿と同じです。
メニュー構成
カフェメニューの検証用データとして以下のメニューを追加してください。
カテゴリー
メニューカテゴリー
┣━ フード（food）
┣━ ホット（hot）
┗━ アイス（ice）
カテゴリーを登録したら、以前紹介した Category Order and Taxonomy Terms Order プラグインで並び替えをしておきます。
カフェメニュー
カスタム投稿のタイトルにメニュー名を入力して、カテゴリーを選択、順序を入力してください。
| カテゴリー | メニュー名 | 順序 |
|---|---|---|
| ホット | ブレンド | 10 |
| ホット | アメリカン | 20 |
| ホット | エスプレッソ | 30 |
| ホット | カフェラテ | 40 |
| アイス | アイスコーヒー | 10 |
| アイス | アイスカフェラテ | 20 |
| アイス | アイスティー | 30 |
| フード | トースト | 10 |
| フード | サンドイッチ | 20 |
| フード | チーズケーキ | 30 |
Admin Columns プラグインでカフェメニュー一覧に順序を表示すると管理しやすくなります。
カフェメニューを並び替える
しかし並び替え順については、追加順になってしまいます。そこで、投稿を任意の順序で並び替えすることができるプラグイン「Post Types Order」を導入します。
管理画面のプラグインからプラグインの追加を選択
プラグインの検索に「Post Types Order」を入力。
今すぐインストールをクリックしてインストール後、有効化をクリックしてください
初回のみ初期設定を行います。
設定からPost Types Orderを選択して、設定を保存するをクリックします。
カフェメニュー一覧画面でメニューをドラッグして順番を入れ替えます。
カフェメニューのように管理画面でも最適な順番に並んだほうが管理しやすい場合には、とても有効なプラグインです。
まとめ
今回は、WordPressのカスタム投稿タイプの基本概念と実装方法を学習しました。
重要なポイント
- カスタム投稿タイプは標準投稿とは別の投稿形式
- 管理画面で分離して管理できる
- それぞれ異なる設定や機能を持てる
- register_post_type関数による実装
- 投稿タイプ名（システム用）と表示ラベル（ユーザー用）を分けて管理
- 様々な設定オプションで柔軟にカスタマイズ可能
- カフェメニューの実例
- 実際のメニューデータを11件投稿
- カテゴリー分類と表示順序を設定
- 管理画面での運用
- 標準投稿とは独立してメニューを管理
- Post Types Orderプラグインを利用したメニューの並び替え
次回は、作成したカスタム投稿タイプのデータをWebサイト上で表示する方法を詳しく解説します。
次回予告：カスタム投稿タイプの表示方法
次回の記事では以下を学習します。
- カスタム投稿タイプ専用のテンプレートファイル作成
- WP_Queryを使ったカスタム投稿の取得方法
- カテゴリー別メニュー表示の実装
カスタム投稿タイプを実際のWebサイトで活用するための実践的な表示テクニックをマスターしましょう！
成果物
この記事で作成した成果物は、以下のページでまとめて確認することができます。
この投稿をシェアする
WordPressで独自の分類軸を作る！タクソノミーの一覧表示とデータ抽出
BASICS WordPressで作成した独自タクソノミーを実際にWebページで表示・活用する方法を詳しく解説します。既存知識を活用して効率的に学習できます。お知らせページでの一覧表示、店舗別投稿ページの作成、複数タクソノミー運用時のテンプレート設計まで、実践的な実装方法を段階的に習得できる内容です。
- 2025/08/02
- 0comments
- 62views
WordPressカスタム投稿タイプ後編：カフェメニューの表示と一覧作成
BASICS Webサイトにカフェメニューを表示するシステムを構築します。一覧ページ、個別ページ、カテゴリー別表示の実装から、パーマリンク設定によるページ表示エラーの解決まで、実際の開発で遭遇するトラブルシューティングも含めて詳しく解説。実用的なメニュー管理システムを完成させる実践的な内容です。
- 2025/08/04
- 0comments
- 23views
