menu

【WordPress】Custom Post Type UI(中級者向き)の使い方について

2021年5月25日 HPの作り方 WordPress

今回はCustom Post Type UIについて解説していきます。

まずは、カスタムポストタイプについて説明していきます。

カスタムポスト(投稿)タイプってなに?

投稿タイプってなに?

そもそも投稿タイプを理解していなければカスタム投稿タイプを理解することは出来ません。

WordPressは、デフォルトで「投稿」と「固定ページ」という2つの投稿タイプがあります。

項目投稿固定ページ
特徴ブログのようなコンテンツ
例)コラム、技術情報、お知らせ・ニュース、イベント、商品ページなど
ページ単体で完結できるようなコンテンツを書くのに向いている。
例)トップページ、会社情報、お問い合わせ、アクセス、採用情報など
できることカテゴリー・タグによる投稿の関連付けができる投稿一覧、カテゴリー一覧、タグ一覧から各ページを一覧表示できる複数のブログタイプ(カスタム投稿タイプ)を作ることができる固定ページ同士で親子関係を作ることができるページごとにデザインテンプレートを作成・選ぶことができる
できないこと投稿同士で親子関係を作ることができない。ページごとにデザインテンプレートを選択することができない。固定ページ一覧、カテゴリー一覧、タグ一覧、日付アーカイブなどで各ページを一覧表示できない
引用:https://webst8.com/blog/wordpress-custom-post-type-ui/

ざっくりと説明すると

・投稿→カテゴリー、タグ付けなど一覧表示できるけど、ページ毎にデザインテンプレートの変更ができない。
・固定ページ→一覧表示は出来ないが、ページ毎にデザインテンプレートの変更が可能。

もっとざっくりすると

・投稿→量産タイプ
・固定ページ→少数精鋭タイプ

みたいなイメージでいいと思います。

お知らせ(新着情報)も一覧表示したいし、特集も一覧表示したいし、ブログも一覧表示したい場合はどうすれば・・・」

といったときに使うのが「カスタム投稿タイプ」です

カスタム投稿タイプとは

その名の通り、投稿タイプを新しく作ることが出来ます!

つまり、「投稿」「固定ページ」以外に新しいものを作ることが出来るのです!

カスタム投稿タイプ上の画像のように、「制作実績」という新しいものが出現します。(もちろん「制作実績」という名前以外もつけることは出来ます!)

なのでここで、「お知らせ」「ブログ」「特集」などの新しい投稿タイプを作ってあげることで先程の疑問を解消することが出来るわけです。

ですが、このカスタム投稿タイプ、プラグインを使用しないで作成しないとなるとめちゃくちゃ大変です。

別の記事でも紹介しましたが、functions.phpというWordPressの脳を直接イジる必要があり、これをイジることでWordPressがぶっ壊れてしまう恐れがあるのでとても危険です。出来るだけ初心者のうちは触らないほうが良いかもしれません。

そんな時は、やはりプラグインが助けてくれます。

Custom Post Type UI」です。

これを使えば比較的簡単にカスタム投稿タイプを生成することが出来ます。

さて、それでは前置きが長くなりましたが、「Custom Post Type UI」についての説明をしていきます。

プラグインインストール

いつもどおり、プラグイン→新規追加→検索窓に「Custom Post Type UI」で上の画像に出てくるのがCustom Post Type UIです。

これをインストールしてあげます。

有効化すると左のメニューに「CPT UI」が現れるので「投稿タイプの追加と編集」をクリックします。

こんな感じで基本設定を済ませます。

この下にある「追加ラベル」ですが、一旦無視しておいて大丈夫です。

下にスクロールすると設定という項目があるのでそちらで必要な項目を編集します。

「アーカイブ」「検索から除外」は基本が「false」になってるので「true」にしてあげます。

こうすることで、検索結果にカスタム投稿タイプの記事を表示させることが出来、一覧ページも表現することが出来ます。

設定についてはたくさん項目がありますが、上記の画像のやつのみ設定しておけば一応大丈夫です。

下に説明の一覧を表示しておきます。(https://webst8.com/blog/wordpress-custom-post-type-ui/さんからお借りしました。)

項目内容
一般公開初期値:True
カスタム投稿のページを一般の訪問者に公開するか。
通常公開しておくケースが多いのでTrueのままでOK
一般公開クエリー可初期値:True
カスタム投稿に対してクエリを実行できるようにするか。
通常TrueのままでOK。
UIを表示初期値:True
管理画面上でカスタム投稿の設定項目を見えるようにするか。
通常TrueのままでOK
ナビゲーションメニューに表示初期値:True
ナビゲーションメニュー上でカスタム投稿の設定項目を見えるようにするか。
通常TrueのままでOK
REST APIで表示初期値:True
((開発者向け)WordPress REST APIでカスタム投稿タイプを見えるようにするか
REST API ベーススラッグ初期値:True
同様にREST API関係の項目
REST API controller初期値:True
同様にREST API関係の項目。
アーカイブあり初期値:False
Trueを推奨
http(s)://WordPressインストール先/カスタム投稿タイプのID名に
アーカイブ一覧ページを作るかどうか。
検索から除外初期値:False
WordPressの検索昨日でこのカスタム投稿タイプを除外するかどうか
通常TrueのままでOK
権限タイプ初期値:post
権限をpostと同じにするかどうするか。通常postのままでOK
階層初期値:False
固定ページのようにカスタム投稿に親子関係を持たせるかどうか。
通常FalseのままでOK。
リライト初期値:True
WordPress はこのカスタム投稿にリライトを使用するかどうか。
通常TrueのままでOK。
カスタムリライトスラッグ初期値:空白
デフォルトの代わりに使うカスタム投稿タイプのスラッグ。通常空白のままでOK
フロントでリライト初期値:空白
パーマリンク構造の設定。通常空白のままでOK
クエリー変数初期値:True
この投稿タイプにクエリー変数キーを使用するかどうか。通常TrueのままでOK。
カスタムクエリー変数スラッグ初期値:空白
フォルト値の代替として使うカスタムクエリー変数スラッグ。通常空白のままでOK
メニューの位置初期値:空白
この投稿タイプが表示されるメニューの位置。下記のメニューに表示がTrueの時のみ有効。通常空白のままでOK。
メニューに表示初期値:True
管理画面メニューにこのカスタム投稿タイプを表示するかどうか。通常TrueのままでOK
メニューアイコン初期値:空白
サポート初期値:チェックなし
このカスタム投稿に対してどの機能を有効化するか。全て有効化する場合なし以外すべてにチェックタイトルエディターアイキャッチ画像抜粋トラックバックカスタムフィールドコメントリビジョン登録者ページ属性投稿フォーマットなし
カスタム「サポート」利用するタクソノミー初期値:チェックなし
このカスタム投稿タイプに対して、どのタクソノミーを利用できるようにするか。
→本例では後ほどのタクソノミー利用時に設定するためそのままでOK。
引用:https://webst8.com/blog/wordpress-custom-post-type-ui/

こんな感じで投稿タイプが追加されました!

テンプレートの作成

ここはとても難しいですが、とりあえず投稿ページと同じテンプレートが使えるようにしてみましょう!

サーバーに接続して、themeから使っているテーマを選択して、single.phpを複製してsingle-{投稿タイプに指定した名前)}.phpを作ります。

そしたら投稿画面に戻って、一度記事を公開してみると

こんな感じでテンプレートを生成することが出来ました!

まとめ

やはりこれはテンプレートを直接イジる必要があるので、ちょっとばっかり難易度が高いです。

テンプレートについてある程度深く認知する必要があるので、初心者のうちはあまり出来ないかもしれません。

しかし、これを出来るようになれば、好きなテンプレートを改修して自分好みの投稿タイプを生成することが出来るので挑戦してみるのもいいかもしれませんね!