カスタム投稿をカテゴリーごとに表示する【Custom Post Type UI/Cocoon】

Cocoon

カスタム投稿タイプをカテゴリーに分類し、固定ページにカテゴリーごとの一覧を表示させる方法です。

  WordPressテーマ:『Cocoon』
  プラグイン:『Custom Post Type UI』

新規投稿タイプの追加

functions.phpで投稿タイプを追加する方法もありますが、初心者は迷わずプラグインを選択したほうがよいです。

プラグインの「新規追加」から、『Custom Post Type UI』をインストール・有効化します。

以下より「お知らせ」という投稿タイプを作成します。

管理画面メインメニューの『CPT UI(カスタム ポスト タイプ UI)』の、
『投稿タイプの追加と編集』をクリックします。

『新規投稿タイプを追加』が表示されたら、スラッグと表示名を入力します。

(※複数形と単数形は、日本語の場合は区別する必要なし。)

『アーカイブあり』は「True」にしておきます。

管理画面メニューのできるだけ上に、追加する投稿タイプを表示させたいので、最小値の「5」を入力しました。

管理者の場合は頻繁に使う投稿タイプなので、この設定にしました。
(※管理画面での表示位置が気にならない場合は空欄でも可。)

『投稿タイプを追加』をクリックして完了です。

新規タクソノミーの追加

『タクソノミーの追加と編集』をクリックします。

以下のように入力します。
(※画像ではラベルを「お知らせ」と設定しようとしていますが、実際は「お知らせのカテゴリー」などに設定するほうが分かりやすくてよいです。)

『利用する投稿タイプ』は、先ほど追加した「お知らせ」のみにチェックをしておきます。(任意)

タクソノミーをカテゴリーに利用するため、『階層』は「True」にしておきます。
(※タグで利用する場合は「False」にしたほうがよい。)

『タクソノミーの追加』をクリックしてカテゴリーの追加が完了です。

各種カテゴリーの登録

紛らわしいですが、『お知らせ』という投稿タイプに、すでに「お知らせ」(カテゴリー)が表示されています。

そこをクリック。カテゴリーの登録画面を表示させます。

以下のとおり、「仕事」「個人」の2つのカテゴリーを登録しました。

(WordPressのデフォルトのカテゴリーと登録方法は同じなので、登録手順は省略しました。)

あとで表示を確認するために、テスト投稿を作っておきます。
(※それぞれの記事はカテゴリー分けしてあります。)

固定ページにカテゴリー分けして表示させるショートコード

以下はWordPressテーマ『Cocoon』で利用できるショートコードです。

ビジュアルエディタの任意の場所に、以下のショートコードを入力します。

  1. 『new_list』…新着一覧(共通)
  2. 『post_type=”news”』…登録した投稿タイプ「お知らせ」のスラッグ
  3. 『taxonomy=”news_cats”』…登録したタクソノミー(カテゴリータイプ)「お知らせ」のスラッグ
  4. 『cats=”20″』…登録したカテゴリー「仕事」のID
  5. 『count=”2″』…表示させる記事数は2つ(値は任意)
  6. 『type=”border_square”』…枠線ありの表示スタイル(表示スタイルは任意)

その他、利用できるショートコードについては、以下の記事(Cocoon公式)から。

『公開』をクリックして完了です。

最上部の「固定ページを表示」から、表示状態を確認してみます。

設定したとおりに表示させたいカテゴリーの記事が、新しいものから順に2記事だけ表示されていることが、しっかり確認できました。

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