【wordpress】カスタム投稿タイプをコードを書かずに作成できる「Custom Post Type UIプラグイン」
![](https://tart.co.jp/wp-content/uploads/2022/10/image-228.png)
WordPressのカスタム投稿タイプとは?
カスタム投稿タイプとは、WordPressに最初から実装されている「投稿」とは別の投稿のタイプ(グループ)を作ることができる機能です。
最初からある「投稿」は作成するとすべて同じ場所に並びますが、こちらを別のグループ扱いにすることができます。
これをつかって
・日記に関する投稿タイプ
・最新商品に関する投稿タイプ
・施設情報に関する投稿タイプ
などなどいろいろな使い方ができます。
機能も投稿風や固定ページ風など細かく調整できます。
最初からある「投稿」「固定ページ」のようなものを自由に並列に増やしていけるみたいなイメージです。
オリジナルの投稿タイプ(カスタム投稿)を新しく作成
今回はより簡単な方法でやっていくためプラグインを利用
よく 候補にあがるのが次の2つのプラグイン
- VK All in one Expansion Unit
- Custom Post Type UI
ですが、圧倒的にCustom Post Type UIが多機能です。
初心者用として「VK All in one Expansion Unit」が紹介されているのをよく見ますが筆者の感想としてはサンプル動作くらいなら可能ですが、実用となるとやめておいたほうがいいなという印象です。
Custom Post Type UIは多機能な分、設定も少々最初はとっつきにくいのは確かです。
一応インストールしたのでメモは残しておきますが必要ないので読み飛ばしてください。
Custom Post Type UIプラグイン
インストール
プラグイン>新規追加
![](https://tart.co.jp/wp-content/uploads/2022/10/image-229.png)
Custom Post Type UIで検索してインストール。
有効化を忘れずに。
![](https://tart.co.jp/wp-content/uploads/2022/10/image-230-768x328.png)
カスタム投稿を新しく作る
インストールが終わった時点でこんなメニューができています
![](https://tart.co.jp/wp-content/uploads/2022/10/image-231.png)
とりあえず新規にカスタム投稿を作っちゃいましょう!
基本設定
![](https://tart.co.jp/wp-content/uploads/2022/10/image-232-768x528.png)
追加ラベルはいったん飛ばします
設定項目を順番に見ていきましょう
アーカイブという言葉が分かりづらいですが、今作成中のカスタム投稿の一覧ページを表示したいか?という設定は真に設定しておきましょう。
![](https://tart.co.jp/wp-content/uploads/2022/10/image-233-768x119.png)
階層の設定です。
ページの階層を持たせるか?
→https://ドメイン/test/test/test2/
デフォルトの投稿タイプである「投稿」はfalseになっています。
「固定ページ」はtrueになっています。
![](https://tart.co.jp/wp-content/uploads/2022/10/image-234-768x89.png)
いんたんこれで新しい投稿タイプを作成しましょう
タクソノミー
![](https://tart.co.jp/wp-content/uploads/2022/10/image-235.png)
新しくカテゴリを追加
専用で使うカテゴリを追加します。
先ほど作ったカスタム投稿専用で使うのでそれにチェックします。
![](https://tart.co.jp/wp-content/uploads/2022/10/image-236-768x653.png)
新規に作るタクソノミーが階層構造を持つか?
デフォルトで用意されている「カテゴリ」は階層構造をもち、「タグ」は階層構造をもちません。
カテゴリなので真。
![](https://tart.co.jp/wp-content/uploads/2022/10/image-237-768x84.png)
クイック編集
管理画面上でクイック編集できるか?
真にしておきましょう。
![](https://tart.co.jp/wp-content/uploads/2022/10/image-238-768x76.png)
管理画面上で表示させたいので真
![](https://tart.co.jp/wp-content/uploads/2022/10/image-239-768x80.png)
タグを追加
基本的にカテゴリの時と同じです。
階層構造のところだけ偽にして作成しましょう。
![](https://tart.co.jp/wp-content/uploads/2022/10/image-240-768x743.png)
VK All in one Expansion Unitプラグイン
インストール
新規追加
![](https://tart.co.jp/wp-content/uploads/2022/10/image-241.png)
キーワード「VK All in one Expansion Unit」検索
インストールをクリック
![](https://tart.co.jp/wp-content/uploads/2022/10/image-242-768x232.png)
有効化
![](https://tart.co.jp/wp-content/uploads/2022/10/image-243-768x311.png)
新メニューができています。
カスタム投稿タイプ設定
![](https://tart.co.jp/wp-content/uploads/2022/10/image-244.png)
新規追加
![](https://tart.co.jp/wp-content/uploads/2022/10/image-245.png)
公開しましょう
![](https://tart.co.jp/wp-content/uploads/2022/10/image-246-768x784.png)
新しいカスタムタイプのメニューが作成されました。
>新規追加
![](https://tart.co.jp/wp-content/uploads/2022/10/image-247-768x185.png)
適当な内容のページを公開してみましょう
![](https://tart.co.jp/wp-content/uploads/2022/10/image-248-768x476.png)
Custom Post Type UIプラグインよりだいぶあっさりしてシンプルですね。
比較するとできることは1/5もない印象です。
作成した新カテゴリと新タグを新規作成する
新しいメニューができており、先ほど定義したカテゴリとタグをつくれるようになっています。
![](https://tart.co.jp/wp-content/uploads/2022/10/image-249.png)
いつも通りカテゴリとタグを1つずつ作ります。
![](https://tart.co.jp/wp-content/uploads/2022/10/image-250-768x807.png)
作成したカスタム投稿タイプの投稿を作成する
先ほど作ったカスタム投稿タイプのメニューで新規作成してみましょう。
※カテゴリとタグのメニューも追加されていますね。
>新規追加
![](https://tart.co.jp/wp-content/uploads/2022/10/image-251.png)
内容は適当で大丈夫です
![](https://tart.co.jp/wp-content/uploads/2022/10/image-252-768x296.png)
新しく作ったカテゴリとタグだけは設定しておきましょう
![](https://tart.co.jp/wp-content/uploads/2022/10/image-253.png)
このページへはこんな感じのURLでアクセスできます。
※今まで名付けたスラッグ名による。
→https://ドメイン/new_post_type/test-post-01/
※投稿を階層化した場合
→https://ドメイン/new_post_type/test-post-01/test-post-02/
作成したカスタム投稿を一覧表示させる
デフォルトでの一覧ページのアクセスの仕方です。
作ったカスタム投稿一覧
→https://ドメイン/new_post_type/
作ったカテゴリ一覧
→https://ドメイン/new_category/test-category/
作ったタグ一覧
→https://ドメイン/new_tag/test-tag/
トップページに設定する
作ったカスタム投稿一覧をトップページに設定するなどしてみましょう!ここは必要な人だけ
Redirectionというプラグインが便利です。
インストールはこちらを参考に。
こんな設定で行けます。
![](https://tart.co.jp/wp-content/uploads/2022/10/image-254-768x467.png)