【SWELL】カスタム投稿タイプでタームラベルを表示する方法【サムネ上にカテゴリ】

WEB制作しているHISASHIです。

WordPressの人気テーマ「SWELL」で、カスタム投稿タイプとカスタムタクソノミーに対応させる方法をご紹介します。

SWELLは標準で、カスタム投稿タイプの一覧ページにタームラベルを表示する機能は備わっていません。

以下のように、サムネ上に表示されるはずのタームラベルは消えた状態になっています。

サムネ上にラベルが表示されない

タームラベルを表示させるには、子テーマのfunctions.phpにあるコードを記述する必要があります。

テンプレートファイルの編集に抵抗がある人は、「Code Snippets」というプラグインを利用すれば同じことができます。

カスタマイズ後

出来るだけ短くシンプルなコードを追加する方法で、一覧ページ、ターム一覧ページ、個別ページに問題なく表示させることができました。

一覧ページ

サムネ上にラベル表示されている

ターム一覧ページ

サムネ上にラベル表示されている

投稿ページ

タイトル下にラベル表示されている

※投稿ページはSWELLの設定でターム表示することはできますが、装飾は自分で行う必要があります。

その方法も記載しています。

デモサイトで確認

どのように表示されているか、デモサイトで各ページ確認することができます。

カスタム投稿タイプ

一覧ページ
https://cafe.hisanobu-design.com/blog/

ターム一覧ページ（ターム名：スタッフ紹介）
https://cafe.hisanobu-design.com/genre/staff/

投稿ページ
https://cafe.hisanobu-design.com/blog/staff2/

通常投稿

一覧ページ
https://cafe.hisanobu-design.com/news/

構築環境

バージョン情報

SWELL: 2.8.1（2023.11.14日時点最新）

利用確認ができているバージョンです。
不定期的に更新していきます。

カスタム投稿タイプ・カスタムタクソノミーの設定

プラグインCustom Post Type UI（CPT UI）で、以下のように設定しています。

投稿タイプの追加と編集

設定するのは６つ。
（下３つがオプションです）

1. 投稿タイプスラッグ（blog）

2. 複数形のラベル（スタッフブログ）

3. 単数系のラベル（スタッフブログ）

4. アーカイブあり→真

5. メニューの位置→５

6. サポート→なし以外全てにチェック

タクソノミーの追加と編集

タクソノミーは７つ設定します。
（下３つがオプションです）

1. タクソノミースラッグ（genre）

2. 複数形のラベル（ジャンル）

3. 単数系のラベル（ジャンル）

4. 利用する投稿タイプ→カスタム投稿タイプを選択

5. 階層→真

6. 管理画面でカラムを表示→真

7. クイック編集 / 一括編集パネルに表示→真

タームは「お店のこと」「スタッフ紹介」の２つを追加しました。

カスタマイズ方法