【WordPress】Custom Post Type UIで新しい投稿タイプを追加してアーカイブページを表示する方法

wordpress

WordPressで独自のカテゴリで記事を管理したいとき、Custom Post Type UI(CPT UI)を使うと管理画面から簡単に新しい投稿タイプを追加できます。

この記事では、CPT UIのインストールから投稿タイプの作成・アーカイブページの表示・ヘッダーメニューへの追加まで、3ステップで解説します。

404エラーやよくあるつまずきポイントの解決方法もあわせて紹介しますので、初めて設定する方もぜひ参考にしてください。


アーカイブページとは?

アーカイブページとは、特定の投稿タイプの記事一覧が自動表示されるページのことです。

たとえば https://example.com/gadget/ にアクセスすると、「ガジェット」投稿タイプの記事が一覧で表示されます。このページが「アーカイブページ」です。


必要なプラグイン:Custom Post Type UI

Custom Post Type UI(CPT UI)は、WordPressの管理画面からカスタム投稿タイプをGUIで追加できるプラグインです。プラグイン管理画面の検索欄で「CPT UI」と検索してインストール・有効化してください。


全体の流れ

  1. CPT UIで投稿タイプを作成・保存する
  2. パーマリンクをフラッシュする
  3. ヘッダーメニューに追加する


ステップ1:CPT UIで投稿タイプを作成する

管理画面から CPT UI → 投稿タイプの追加と編集 → 新規投稿タイプを追加 と進み、以下の項目を設定します。

項目設定例注意点
投稿タイプスラッグgadget小文字の英数字・ハイフンのみ使用可
複数形のラベルガジェット管理画面に表示される名前
単数形のラベルガジェット同上
アーカイブあり(最重要)True必ずTrueに設定する
アーカイブスラッグ(重要)gadget先頭のスラッシュ(/)は不要

「アーカイブあり」を True にしないとアーカイブページが生成されません。この設定が最重要です。アーカイブスラッグには先頭のスラッシュ(/)を付けないよう注意してください。

実際の設定画面

設定が完了したら、ページ下部の「投稿タイプを追加」をクリックします。


ステップ2:パーマリンクをフラッシュする

管理画面から 設定 → パーマリンク を開き、何も変更せずに「変更を保存」ボタンをクリックします。これにより、WordPressの内部URLルールが更新されます。

このステップを忘れると、アーカイブページのURLにアクセスしたときに404エラーが表示されることがあります。投稿タイプを作成・変更した後は必ず実施してください。


ステップ3:ヘッダーメニューに追加する

CPT UIで投稿タイプを作成しただけでは、ヘッダーメニューには自動で追加されません。以下の手順でメニューに追加してください。

管理画面から 外観 → カスタマイズ → メニュー → ヘッダーメニュー と進みます。

  1. 「+ 項目を追加」をクリック
  2. 「ガジェット一覧 投稿タイプアーカイブ」を選択するとヘッダーメニューに追加される
  3. 項目の配置はドラック&ドロップで項目名はその項目を選択することで変更可能
  4. 画面上部の「公開済み」をクリックして保存

メニューに追加する際は必ず「投稿タイプアーカイブ」を選択してください。「IT知識」「お問い合わせ」などの固定ページとは種類が異なります。誤った種類を選択するとリンク先が正しく動作しないことがあります。


よくあるつまずきポイントと解決方法

▼ アーカイブページにアクセスすると404 NOT FOUNDになる

最も多い原因は、アーカイブスラッグに先頭のスラッシュ(/)が入っていることです。

入力例結果
/gadget❌ 誤り:404エラーになる
gadget✅ 正しい:アーカイブページが表示される

スラッグ欄は gadget のように、スラッシュなしで入力してください。入力後は「投稿タイプを保存」→ パーマリンクの再保存を行います。


固定ページとの関係について

固定ページとCPT UIの投稿タイプは別々のものです。アーカイブページを表示するために固定ページは不要ですが、同じスラッグの固定ページが「公開中」の状態だとURLが競合し、アーカイブページが表示されなくなります。

固定ページの状態結果
公開中❌ 固定ページが優先され、アーカイブが表示されない
下書き✅ CPTアーカイブが正常に表示される
存在しない✅ CPTアーカイブが正常に表示される

固定ページを削除すると後から復元できません。将来また使う可能性がある場合は、削除せず「下書き」状態のままにしておきましょう。


アーカイブページのデザインについて

archive-{投稿タイプ名}.php というテンプレートファイルがテーマに存在しない場合、WordPressは自動的にテーマの archive.php または index.php を適用します。テンプレートファイルを自分で用意しなくても、使用しているテーマのデザインがそのままアーカイブページに自動適用されます。


まとめ:設定手順とポイント

  1. CPT UIで投稿タイプを作成:「アーカイブあり:True」「アーカイブスラッグ:任意の文字列(スラッシュなし)」を設定して保存
  2. パーマリンクをフラッシュ:管理画面 → 設定 → パーマリンク → 変更を保存
  3. ヘッダーメニューに追加:外観 → カスタマイズ → メニュー → ヘッダーメニュー →「投稿タイプアーカイブ」から追加して保存

設定時に意識しておきたいポイントをまとめます。

  • 固定ページは不要(同じスラッグの固定ページが公開中だと競合するので注意)
  • アーカイブスラッグに先頭のスラッシュ(/)は入れない
  • 投稿タイプ作成後は必ずパーマリンクをフラッシュする
  • ヘッダーメニューへの追加は自動では行われないため、手動で設定する
  • メニュー追加時は「投稿タイプアーカイブ」を選択する


参考リソース

コメント

タイトルとURLをコピーしました