WordPressでカテゴリーを表示する
access_time
WordPressでカテゴリーを表示する方法はいくつかありますが、代表的なやつもメモしておきます。基本的に下記を適当なテンプレートにコピペをすることで実装できるようになっています。ソースコードのプレビューも用意しているので参考にしてください。
ループ内でカテゴリーを表示するコード
<?php the_category(''); ?>ソースコードはこんな感じです。このタグはループ内で使用しなければならないため、アイキャッチのタイトル取得の手段として利用するには別の手段を利用する必要があります。
HTMLの出力結果と見た目の出力結果はこんな感じです。（サイトにはすでにカテゴリー1～3が設定してあると想定してます。）
<ul class="post-categories">
<li><a href="https://tilenote.com/category/cat1/" rel="category tag">カテゴリー1</a></li>
<li><a href="https://tilenote.com/category/cat2/" rel="category tag">カテゴリー2</a></li>
<li><a href="https://tilenote.com/category/cat3/" rel="category tag">カテゴリー3</a></li>
</ul>- カテゴリー1
- カテゴリー2
- カテゴリー3
<ul>で囲まれたカテゴリーが表示されます。CSSで装飾するにはclass=”post-categories”を指定して装飾します。ただし、PHPのコードの（）内に記号を入れると出力されるHTMLがガラッと変わります。
例えば「・」で区切りたい場合は以下のようにします。
<?php the_category('・'); ?>変化がわかりにくいですが、the_category(”)だった部分の（）内に「・」を入力しています。こうするとHTMLの出力は以下のようになります。
<a href="https://tilenote.com/category/cat1/" rel="category tag">カテゴリー1</a>・
<a href="https://tilenote.com/category/cat2/" rel="category tag">カテゴリー2</a>・
<a href="https://tilenote.com/category/cat3/" rel="category tag">カテゴリー3</a>カテゴリー1・カテゴリー2・カテゴリー3
実際には改行されずに連続した<a>タグで区切りに指定した「・」が出力されます。他にも「半角スペース」や「／」を入力するとそれっぽく区切れると思います。
個人的に使いやすいのは、デフォルトか半角スペースかなと思います。
ループ外でカテゴリーを表示するコード
ループの外で使う場合はアイキャッチやタイトル等で利用する場合が多いと思います。その場合はcategory.phpで利用する場合を想定しています。コードは以下のような感じ。
<?php single_cat_title(); ?>このコードでカテゴリーが出力されます。
（）内にテキストを入力することでカテゴリー名の前にそのテキストが付きます。
参考サイト