CJ Column

コラム

WordPressで記事のカテゴリ・カテゴリ一覧を表示する方法まとめ


WordPressのテーマ内でカテゴリを表示する方法について、
いつもパッと思い出せなくなるので、サイト制作でよく使うものをまとめてみました。
テンプレートタグを使わず柔軟にカスタマイズしたい人向けです。
これで制作がはかどりますね!
※出力するHTMLは適宜変更してください。

投稿に設定されているカテゴリーを表示する

カテゴリを1つ表示する

新着ニュース一覧などでよく使われている、1つの記事に1つカテゴリを表示する例。
カテゴリが複数設定されている場合は、一番上のカテゴリが表示されます。

$categories = get_the_category();
$cat = $categories[0];
//(例)classにスラッグを指定したカテゴリーのラベル
echo '<span class="'.$cat->slug.'">'.$cat->name.'</span>';

 

紐付いているカテゴリをすべて表示する

1つの投稿に複数カテゴリーが設定されており、それを全て表示する例。
ブログやメディアなどでよく使われていますね。

$categories = get_the_category();
foreach($categories as $cat) {
    //(例)classにスラッグを指定したカテゴリーのラベル
    echo '<span class="'.$cat->slug.'">'.$cat->name.'</span>';
}

 

投稿とは別の場所にカテゴリを表示する

上記では投稿に紐付いているカテゴリを扱いましたが、ここから先は投稿から独立した場所にカテゴリを表示する方法です。
例えば、タブで記事一覧を切り替えるときに、カテゴリの名前が書かれたタブを作りたい…とか、カテゴリ一覧を設置したい、というときに使えると思います。(下図ではタブの地域名がカテゴリという想定です。)

特定のカテゴリを1つ表示する

カテゴリIDやスラッグなどで、表示したいカテゴリを指定する方法です。

//スラッグを指定する場合
$category = get_category_by_slug('スラッグ');
$category_link = get_category_link($category);
//(例)カテゴリーアーカイブのページへリンク
echo '<a href="'.esc_url($category_link).'">'.$category->name.'</a>';

//IDを指定する場合
$category = get_category('カテゴリID');
$category_link = get_category_link($category);
//(例)カテゴリーアーカイブのページへリンク
echo '<a href="'.esc_url($category_link).'">'.$category->name.'</a>';

 

特定のカテゴリを表示する(複数)

表示したいカテゴリが複数ある場合、カテゴリの配列を作ってforeachでループさせ、上記と同じ処理をします。
個人的には、ちょっとしたナビやメニューを作るとき、全てのカテゴリを取得すると多すぎるな〜というときによく使います。

//スラッグを指定する場合
$slug_list = array('info', 'release', 'blog');//表示したいカテゴリのスラッグ
foreach ($slug_list as $slug){
    $category = get_category_by_slug($slug);
    $category_link = get_category_link($category);
    echo '<a href="'.esc_url($category_link).'">'.$category->name.'</a>';
}

//IDを指定する場合
$catID_list = array('2', '5', '7');//表示したいカテゴリのID
foreach ($catID_list as $catID){
    $category = get_category($catID);
    $category_link = get_category_link($category);
    echo '<a href="'.esc_url($category_link).'">'.$category->name.'</a>';
}

 

カテゴリーをすべて表示する

投稿のあるカテゴリーをすべて取得します。
オプションが豊富なので、条件に合うカテゴリだけ取り出したいときにも便利です。

//投稿のあるカテゴリーをすべて取得
$categories = get_categories();
foreach ($categories as $cat){
    //(例)classにスラッグを指定したカテゴリーのラベル
    echo '<span class="'.$cat->slug.'">'.$cat->name.'</span>';
}

 

オプションの一例(ほんの一部)はこちら。親カテゴリを指定したり、特定のカテゴリを除外したりもできます。

//ある親カテゴリの直下にある子カテゴリを表示&特定のカテゴリを除外する場合
$option = array(
    'parent'     => '親カテゴリID',
    'exclude'    => '除外するカテゴリID',
);
$categories = get_categories($option);
foreach ($categories as $cat){
    //(例)classにスラッグを指定したカテゴリーのラベル
    echo '<span class="'.$cat->slug.'">'.$cat->name.'</span>';
}

 

以上、WordPressのテーマ内で使える、カテゴリ表示方法についてご紹介しました。
WordPressのテンプレートタグと違って、自分で出力するHTMLを柔軟に変更できるので、カスタマイズの幅が広がります。

ご紹介したソースはカスタマイズを最小限におさえたシンプルなものなので、各関数のドキュメントを参照するともっと詳細な設定ができます。
https://wpdocs.osdn.jp/関数リファレンス

A.U  フロントエンドエンジニア

コラム一覧に戻る

お問合せ

以下のフォームにご入力の上、送信ボタンをクリックしてください。

企業名 企業名を入力してください
お名前 [必須] お名前を入力してください
メールアドレス [必須] メールアドレスを入力してください
電話番号 電話番号を入力してください
お問い合せ内容 [必須] お問い合わせ内容を入力してください

個人情報保護方針

個人情報の取り扱いについて

個人情報の取り扱いについて同意してください

ログインをすると、
会員限定記事を全文お読みいただけます。

パスワードを忘れた方へ

  • ログインIDを入力してください。
  • ログインIDを正しく入力してください。
  • パスワードを入力してください。
  • パスワードを正しく入力してください。
  • ログインID、パスワードが間違っています。


ログイン実行中

ログイン完了!ページを再読込します。