プラグイン不要！WordPressカテゴリーページに説明文を入れる方法

ブログではカテゴリーページが自動生成され、サービスやテーマ・テンプレートで表示方法は異なるものの、基本的に同カテゴリーの記事一覧が出力されます。

今までカテゴリーページにさほど気を使っていなかったのですが、記事数が増え、ただ一覧表示するだけじゃ何となく物足りなくなってきたので、カテゴリーごとに簡単な説明文を表示してみました。

というわけで、WordPressプラグインを使わず、数行のコードを挿入するだけでカテゴリーページに説明文をつける方法をご紹介します。もちろん、HTMLタグも使えます！

味気ないカテゴリーページをカスタマイズしてみよう

当ブログのカテゴリーページはこのような感じでした。

上部のタイトルで何のカテゴリー記事一覧なのかはわかりますが、その下はただ記事が並んでいるだけなのでちょっと寂しい気がします。

そこで、このように説明文を入れるカスタマイズを施してみました。

何もなかった時よりは、印象が変わりますよね。

なぜカテゴリーページに説明文が必要なのか

ブログを運営している側からすると、どうしてもトップページ（メインページ）が入り口であると思い込みがち。「訪問者はまずトップページにアクセスし、そこから各記事や各カテゴリーページに移動する」、と。

ブックマークしてくれているリピーターや、ブログの名前で検索してくれるユーザーなら確かにそのように行動します。

でも、入り口はたくさんあって、検索サイトやSNSから流入があるのは主に個別記事じゃないでしょうか。アクセス解析を見ればすぐにわかります。

カテゴリーページも例外ではありません。検索でこのようにカテゴリーページが上位表示されていると、そこが入り口になります。

トップページや個別記事からカテゴリーページに移動するユーザーは、そのカテゴリーに興味があるわけですから、説明文はさほど必要としないかもしれません。

しかし、検索サイトから入ってきてくれたユーザーは、上位表示されているという理由で何となく入ってきただけかもしれません。そこに探している情報があるのか一目で判断してもらうために、またできるだけ記事を読んでもらうために説明文があったほうが親切です。

単に説明文だけ置くのではなく、そのカテゴリー内の人気記事を表示したり、アフィリエイトリンクを置いたりと、活用方法はいろいろ考えられます。

カテゴリーページのトップに説明文を表示する方法

前置きが長くなりましたが、さっそくカスタマイズ方法を見ていきましょう。

プラグインを使う方法もありますが、数行のコードを挿入するだけの簡単作業なのでぜひトライしてみてください。

説明文を入力する場所

カテゴリーページの説明文を入力する場所は、WordPressに標準装備されています。

管理画面の［投稿］から［カテゴリー］に入ってください。ここで新規カテゴリーの登録や編集ができますが、入力欄がちゃんとありますね。

「あまり重要な意味を持たない」とコメントがありますが、せっかくすばらしい機能があるんだから重要な意味を持たせましょう！

カテゴリーページを出力している場所を探す

まず、カテゴリーページはどこで生成されているのかを探さなければなりません。これは現在使っているテーマによって変わります。

たとえば、「Twenty Fourteen」であれば「category.php」で生成しています。
（※このテーマはすでに説明が出力されるようになっているのでカスタマイズ不要です）

Gushのように「category.php」がないテーマの場合、「archive.php」でカテゴリーページが生成されます。

どのPHPが使われるのかには優先順位がありますので、テーマファイルを確認して該当するファイルを探しましょう。

カテゴリー説明文を取得するコード

カテゴリーを生成するファイルが見つかったら、下記コードを出力したい部分に挿入します。

<?php echo category_description(); ?>

この1行だけで、［カテゴリー］の説明入力欄に記した内容が表示されます。

注意点は、自動的に<p>が付与されることと、HTMLタグが使えないことです（リンクはOK）。

説明文でHTMLタグを使えるようにする

説明入力欄に記述した画像<img>や<span>などのHTMLタグは、自動的に削除されるようになっています。

こんな感じ。

テキストとリンクだけあればOKならこのままでもかまいませんが、ほかのHTMLタグも使いたいなら下記コードをfunctions.phpに追記してください。

//カテゴリー説明文でHTMLタグを使う
remove_filter( 'pre_term_description', 'wp_filter_kses' );

補足：リッチテキストエディターを使いたい場合

デフォルトでHTMLタグが使えないため、ビジュアルエディターも使えないようになっています。

functions.phpに追記したあと、タグ部分は自分で書かなければなりません。もしビジュアルエディターを使いたいなら、プラグインを使うのが手っ取り早いと思います。

でも、簡単なHTMLタグぐらいは覚えておいたほうが良いですよ。

補足：自動挿入されるPタグを取り除きたい場合

説明文に見出しタグ（<h3>など）を割り当てたい場合、<p>は不要なので消しておきましょう。

functions.phpに下記を追記してください。

//カテゴリー説明文からPタグを除去
remove_filter('term_description', 'wpautop');

Naifixのサンプル

CSSでデザインを調整する場合は、クラス名を振ったDIVタグ等で囲っておきましょう。

一応、当ブログのサンプルも載せておきます。「archive.php」でカテゴリーページを生成しているため、条件分岐タグを使って振り分けました。また、ページャーで2ページ目以降に移動した時は出力しないようにもしています。

<?php if (is_category() && !is_paged()) : ?>
<div class="cat_dcp"><?php echo category_description(); ?></div>
<?php else : ?>
<?php endif; ?>

CSSは参考になるかわかりませんが、こんな感じ。

.cat_dcp {
	margin-bottom: 24px;
	background-color: #fbfaf8;
	padding: 5%;
	border-radius: 8px;
	border: 1px solid #ddd;
}

こんな面倒なことしないで、category.php作れよ！って話ですが…。

Gushユーザーの方は、このままコピーして「archive.php」に貼り付ければ完成です。

まとめ

カテゴリーページに説明文を挿入する手順は下記のとおり。

プラグインで手軽に、というのもありですが、できるだけ使わないほうがブログが重くならずにすみます。

記事が増えるほどカテゴリーページ自体が強力な入り口となるので、今のうちにやっておきましょう。お客様はトップページにばかりやってくるとは限りません！

それでは、また。