WordPressでカテゴリー一覧をリンク付きで表示する方法！複数の子カテゴリーも対応!

WordPressをカスタマイズしようとしたときにカテゴリー一覧を投稿や固定ページ、またヘッダフッター、サイドメニューに表示したい時はないでしょうか。

けど、そんな中で悩むことは、

・WordPressのカテゴリー一覧を表示する方法がわからない。
・ページにカテゴリー一覧を表示したいがやり方がわからない。
・functions.phpを変更することなくカテゴリー一覧を表示したいが方法がわからない。

ですよね。

今回はそんなお悩みを解決する
WordPressでカテゴリー一覧を表示する方法と子カテゴリーも含むリンク付きで表示する方法について
まとめます！

WordPressでカテゴリー一覧を表示するイメージ

WordPressでカテゴリー一覧を表示するイメージについて説明をします。

まず、カテゴリー一覧を表示する場所は新規作成した投稿と固定ページの本文やウイジェットの編集エリア、ヘッダフッターなど共通パーツとなります。

そこにショートコードを加えます。

[CategoryList]

ショートコードの内容は、
「ショートコード名」
のみで、引数はありません。（表示件数や階層指定などしたい場合は、後で追加可能です）

次にfunction.phpにショートコード関数を追加しますが、今回はプラグインを使ってfunction.phpを編集することなく実装していきます。

使うプラグインは「Code Snippests」です。

ショートコードを追加したページやウイジェットをプレビューすると、カテゴリー一覧がリンク付きで表示されます。

カンタンですね。

それではさっそく実装してみましょう！

プラグイン「Code Snippets」をインストールする

プラグイン「Code Snippets」をインストールしましょう。

「Code Snippets」を使うとfunctions.php を直接編集することなく、ショートコードを追加できますので、とても安全で便利です。

タカヒロ

インストール方法はこちらの記事をご参照ください。

Code Snippetsの使い方！functions.phpを安全に管理できるプラグイン

タカヒロ

また、function.phpについて全く知らないという方はこちらの記事もご参照ください。

WordPressのfunctions.phpとは何？失敗しない設定方法も！

WordPressのカテゴリー一覧を呼び出すショートコードを追加する

Snippetを追加する

ショートコードと関数を実装するSnippetを追加しましょう。

WordPressの管理コンソールを開き、左サイドメニューの「All Snippets」＞「Add New」をクリックします。

新規画面が立ち上がりましたね。

任意のタイトル名を入力します。

サンプルは「【ショートコード】カテゴリー一覧」
としました。

ショートコードの定義を追加する

こちらのショートコードをCode欄へ入力します。

//ショートコードを追加します。
add_shortcode('CategoryList', 'FuncCategoryList');

できましたら「SaveChange」ボタンを押して保存してください。

WordPressのカテゴリー一覧を生成する関数を追加する

続いて同じくCode欄へカテゴリー一覧を生成する関数を追加していきます。

関数を追記する

カテゴリー一覧関数を追記します。

//カテゴリー一覧を生成する関数
function FuncCategoryList() {
	
	//get_categoriesの引数を指定します。
	$args = array(
		'type'                => 'post',    //取得するカテゴリーの種別を指定します。postかlinkを指定します。
		'child_of'            => '',    //親カテゴリーの子孫カテゴリーをすべて取得するかカテゴリーIDを指定します。''（初期値）はすべて含める
		'parent'              => 0,    //親カテゴリー直下の子カテゴリーを取得するかカテゴリーIDを指定します。 ''（初期値）はすべて含める、0は一階層目のみ
		'orderby'             => 'id',    //指定項目をキーとする、カテゴリーの並び替えパターンを指定。指定する文字列はid、 name（初期値）、slug、count（投稿多い順）,term_group(親タームのタームID)
		'order'               => 'DESC',    //並び順を昇順か降順か指定します。'ASC'は昇順、'DESC'は降順（日付の場合最新が頭になる）
		'hide_empty'          => 1,    //記事がないカテゴリーを表示するか否かを指定します。1(true)（初期値）は表示する、、2(false)は表示しない
		'hierarchical'        => 1,    //記事がない子カテゴリーを表示するか否かを指定します。1(true)（初期値）は表示する、、2(false)は表示しない
		'exclude'             => '',    //表示させないカテゴリーIDを指定します。単体指定の他コンマ（,）区切りで複数指定もできます。
		'include'             => '',    //表示するカテゴリーIDを指定します。単体指定の他コンマ（,）区切りで複数指定もできます。
		'number'              => '',    //カテゴリーの表示件数上限を指定します。
		'taxonomy'            => 'category',    //カテゴリの代わりにタクソノミーを指定します。categoryが初期値です。
		'pad_counts'          => false    //子カテゴリーを含めてリンクおよび投稿数を算出するか指定します。1(true)は含める、2(false)（初期値）は含めないです。
	); 
	
	//リスト形式のHTMLコードを生成します。
	$strHtml = "<ul>";
	
	//カテゴリーオブジェクトを取得します。
	$objCategories = get_categories($args);
	
	//存在するカテゴリーを1件づつ取得し、件数分処理を繰り返します。
	foreach ( $objCategories as $objCategory ) {
		
		//親カテゴリーを出力します。
		$strHtml .=  '<li><a href="' . get_category_link( $objCategory->term_id ) . '">' . $objCategory->name . '</a>'."---親カテゴリーID:". $objCategory->term_id ."---投稿数:". $objCategory->count;

		
	$args2 = array(
		'child_of'            => $objCategory->cat_ID,    //親カテゴリーの子孫カテゴリーをすべて取得するかカテゴリーIDを指定します。''（初期値）はすべて含める
	); 
		
		
		
		//子カテゴリーを取得します。
		$objcatChildrens = get_categories( $args2);
		
		//子カテゴリーがあるか判定します。
		if ($objcatChildrens) { 
			$strHtml .= "<ul>";

			//子カテゴリーを出力します。
			foreach ( $objcatChildrens as $objcatChildren ) {
				$strHtml .=  '<li><a href="' . get_category_link( $objcatChildren->term_id ) . '">' . $objcatChildren->name .'</a>'."---子カテゴリーID:". $objcatChildren->term_id ."---投稿数:". $objcatChildren->count  . '</li>';
			}
			$strHtml .= "</ul>";
			$strHtml .= "</li>";
		}
		
	}
	$strHtml .= "</ul>";
    return $strHtml;
}

影響範囲を設定する

Code欄の下にある影響範囲を設定します。影響範囲は最小限となるよう、フロントエンドのみを選択しましょう。

保存、または保存し反映する

入力した内容を保存します。即時に反映したい方は「Activate」のボタンを押してください。

固定ページを新規作成する

固定ページを新規作成しましょう。

タカヒロ

今回サンプルで固定ページを作成していますが、投稿ページやウイジェットでも同じく動作可能です。

カテゴリー一覧のショートコードを追加する

作成した固定ページへカテゴリー一覧のショートコードを追加します。

固定ページへショートコードを追加する

ショートコードの内容は、引数は何も設定ていないので
「ショートコード名」のみ
となります。

[CategoryList]

[CategoryList]

プレビューする

保存して、プレビュー表示をしてみましょう。

はい、反映できていますね。

カテゴリー一覧コードの説明

カテゴリー一覧コードについて説明します。

ショートコードを追加

add_shortcodeはショートコードタグ用のフックを追加する関数です。

add_shortcode( $tag , $func )

パラメータは以下の通りです。

$tag：投稿の本文から検索する、ショートコードタグを指定
$func：ショートコードが見つかったときに実行するコールバック関数を指定

コールバック関数設定

ショートコードから呼び出す関数となります。
function FuncCategoryList() {

カテゴリー一覧を取得するのに利用した関数は
get categories
となります。

get categoriesはパラメータに合致するカテゴリーのオブジェクトを配列として返します。

パラメータは以下の通りです。

‘type’ => ‘post’
取得するカテゴリーの種別を指定します。postかlinkを指定します。

‘child_of’ => ”,
親カテゴリーの子孫カテゴリーをすべて取得するかカテゴリーIDを指定します。
”（初期値）はすべて含める

‘parent’ => 0,
親カテゴリー直下の子カテゴリーを取得するかカテゴリーIDを指定します。
”（初期値）はすべて含める、0は一階層目のみ

‘orderby’ => ‘id’,
指定項目をキーとする、カテゴリーの並び替えパターンを指定。指定する文字列はid、 name（初期値）、slug、count（投稿多い順）,term_group(親タームのタームID)

‘order’ => ‘DESC’,
並び順を昇順か降順か指定します。’ASC’は昇順、’DESC’は降順（日付の場合最新が頭になる）

‘hide_empty’ => 1,
記事がないカテゴリーを表示するか否かを指定します。
1(true)（初期値）は表示する、2(false)は表示しない

‘hierarchical’ => 1,
記事がない子カテゴリーを表示するか否かを指定します。
1(true)（初期値）は表示する、2(false)は表示しない

‘exclude’ => ”,
表示させないカテゴリーIDを指定します。
単体指定の他コンマ（,）区切りで複数指定もできます。

‘include’ => ”,
表示するカテゴリーIDを指定します。
単体指定の他コンマ（,）区切りで複数指定もできます。

‘number’ => ”,
カテゴリーの表示件数上限を指定します。

‘taxonomy’ => ‘category’,
カテゴリの代わりにタクソノミーを指定します。
category（初期値）

‘pad_counts’ => false
子カテゴリーを含めてリンクおよび投稿数を算出するか指定します。
1(true)は含める、2(false)（初期値）は含めない

今回はまず1階層目の親カテゴリーのみを取得し、親カテゴリーに子カテゴリーが存在したら2階層目を表示させる仕様となっています。

ですので、初回のパラメータ指定は親カテゴリのみを取得する設定となっています。

具体的には、

‘parent’ => 0,

を指定し、1階層目のみを出力しています。

リスト形式（UL-LI）のHTMLコードを生成します。

$strHtml = “”<ul>””;

カテゴリーオブジェクトを取得します。

$objCategories = get_categories($args);

存在するカテゴリーを1件づつ取得し、件数分処理を繰り返します。

foreach ( $objCategories as $objCategory ) {

親カテゴリーを出力します。

$strHtml .= ‘<li><a href=””‘ . get_category_link( $objCategory->term_id ) . ‘””>’ . $objCategory->name . ‘</a>’.””—親カテゴリーID:””. $objCategory->term_id .””—投稿数:””. $objCategory->count;

タカヒロ

確認用にカテゴリーIDと投稿数が表示されますが、削除いただいても問題ありません。

子カテゴリーを取得します。

child_of’ => $objCategory->cat_ID
$objcatChildrens = get_categories( $args2);

$objCategoryのcat_IDプロパティで親カテゴリIDを取得し、パラメータ’child_of’に指定することにより該当親カテゴリーの子カテゴリーリストを取得しています。

子カテゴリーがあるか判定します。

if ($objcatChildrens) {

子カテゴリーを出力します。

foreach ( $objcatChildrens as $objcatChildren ) {
$strHtml .= ‘<li><a href=””‘ . get_category_link( $objcatChildren->term_id ) . ‘””>’ . $objcatChildren->name .'</a>’.””—子カテゴリーID:””. $objcatChildren->term_id .””—投稿数:””. $objcatChildren->count . ‘</li>’;
}
$strHtml .= “”</ul>””;
$strHtml .= “”</li>””;
}

最後に生成したHTMLを返り値に渡します。

return $strHtml;

WordPressのカテゴリー一覧の並び順を投稿数が多い順に変える

WordPressのカテゴリー一覧の並び順を投稿数が多い順に変えてみましょう。

変える箇所は1か所のみです。

get_categoriesの以下のパラメータを変更します。

orderby’ => ‘count’,

はい、投稿が多い順に変わりましたね。

nameが初期値で、idはカテゴリID順、slugはスラグ順となります。

降順から昇順に変えたい場合は、

order’ => ‘DESC’,

をASC’に指定してください。

WordPressのカテゴリー一覧から一部のカテゴリーを除外する

WordPressのカテゴリー一覧から一部のカテゴリーを除外したい場合がありますね。
同じくパラメータで指定が可能です。
早速設定をしてみましょう。

1階層目の特定親カテゴリーを除外する

除外対象は以下とします。

暮らし—親カテゴリーID:3

カテゴリーIDは3番ということがわかりました。

つづいて、get_categoriesのパラメータに3番を除外する設定をします。

exclude’ => ‘3’,

exclude’ はカテゴリーIDを指定すると除外するパラメータです。

プレビューしてみましょう。

はい、
「暮らし—親カテゴリーID:3」
が除外されていますね。

2階層目の特定子カテゴリーを除外する

つづいて、2階層目の特定子カテゴリーを除外してみましょう。

2階層目の子カテゴリーは親カテゴリーと別の処理としているため、2つ目のパラメータ「$args2 」に設定する必要があります。

除外する対象の子カテゴリーは

芸能—子カテゴリーID:41—投稿数:17

とします。

子カテゴリーIDは41なので、41番を指定します。

exclude’ => ’41’

保存してプレビューしてみましょう。

はい、
「芸能—子カテゴリーID:41—投稿数:17」
が消えてますね！

ちなみに複数の子カテゴリーを指定する場合はカンマ「,」区切りで追加します。

exclude’ => ‘41,95’

ここまで変更を加えたコード

ここまで変更を加えたコードをまとめます。

//ショートコードを追加します。
add_shortcode('CategoryList', 'FuncCategoryList');

//カテゴリー一覧を生成する関数
function FuncCategoryList() {
	
	//get_categoriesの引数を指定します。
	$args = array(
		'type'                => 'post',    //取得するカテゴリーの種別を指定します。postかlinkを指定します。
		'child_of'            => '',    //親カテゴリーの子孫カテゴリーをすべて取得するかカテゴリーIDを指定します。''（初期値）はすべて含める
		'parent'              => 0,    //親カテゴリー直下の子カテゴリーを取得するかカテゴリーIDを指定します。 ''（初期値）はすべて含める、0は一階層目のみ
		'orderby'             => 'count',    //指定項目をキーとする、カテゴリーの並び替えパターンを指定。指定する文字列はid、 name（初期値）、slug、count（投稿多い順）,term_group(親タームのタームID)
		'order'               => 'DESC',    //並び順を昇順か降順か指定します。'ASC'は昇順、'DESC'は降順（日付の場合最新が頭になる）
		'hide_empty'          => 1,    //記事がないカテゴリーを表示するか否かを指定します。1(true)（初期値）は表示する、、2(false)は表示しない
		'hierarchical'        => 1,    //記事がない子カテゴリーを表示するか否かを指定します。1(true)（初期値）は表示する、、2(false)は表示しない
		'exclude'             => '3',    //表示させないカテゴリーIDを指定します。単体指定の他コンマ（,）区切りで複数指定もできます。
		'include'             => '',    //表示するカテゴリーIDを指定します。単体指定の他コンマ（,）区切りで複数指定もできます。
		'number'              => '',    //カテゴリーの表示件数上限を指定します。
		'taxonomy'            => 'category',    //カテゴリの代わりにタクソノミーを指定します。categoryが初期値です。
		'pad_counts'          => false    //子カテゴリーを含めてリンクおよび投稿数を算出するか指定します。1(true)は含める、2(false)（初期値）は含めないです。
	); 
	
	//リスト形式のHTMLコードを生成します。
	$strHtml = "<ul>";
	
	//カテゴリーオブジェクトを取得します。
	$objCategories = get_categories($args);
	
	//存在するカテゴリーを1件づつ取得し、件数分処理を繰り返します。
	foreach ( $objCategories as $objCategory ) {
		
		//親カテゴリーを出力します。
		$strHtml .=  '<li><a href="' . get_category_link( $objCategory->term_id ) . '">' . $objCategory->name . '</a>'."---親カテゴリーID:". $objCategory->term_id ."---投稿数:". $objCategory->count;

		
	$args2 = array(
		'child_of'            => $objCategory->cat_ID,    //親カテゴリーの子孫カテゴリーをすべて取得するかカテゴリーIDを指定します。''（初期値）はすべて含める
		'exclude'             => '41',    //表示させないカテゴリーIDを指定します。単体指定の他コンマ（,）区切りで複数指定もできます。
	); 
		
		
		
		//子カテゴリーを取得します。
		$objcatChildrens = get_categories( $args2);
		
		//子カテゴリーがあるか判定します。
		if ($objcatChildrens) { 
			$strHtml .= "<ul>";

			//子カテゴリーを出力します。
			foreach ( $objcatChildrens as $objcatChildren ) {
				$strHtml .=  '<li><a href="' . get_category_link( $objcatChildren->term_id ) . '">' . $objcatChildren->name .'</a>'."---子カテゴリーID:". $objcatChildren->term_id ."---投稿数:". $objcatChildren->count  . '</li>';
			}
			$strHtml .= "</ul>";
			$strHtml .= "</li>";
		}
		
	}
	$strHtml .= "</ul>";
    return $strHtml;
}