WordPressでカテゴリーページやタグページのデザインやレイアウトを変更する方法は、変更したい内容によって異なります。
「既に表示されている項目のデザインを変更したい場合」と「表示される項目自体を変更したい場合」です。
「既に表示されている項目のデザインを変更したい場合」とは、文字の大きさや色の変更、表示される項目の間隔の調整といったことです。
「表示される項目自体を変更したい場合」とは、記事一覧を表示せずに、特定の記事のみを表示させるといったことです。
「既に表示されている項目のデザインを変更したい場合」は、CSSを追加することで変更が可能となります。
一方で「表示される項目自体を変更したい場合」は、テンプレートファイルの編集または新規作成が必要となります。
既に表示されている項目のデザインを変更したい場合
WordPressでは、生成されるカテゴリーページおよびタグページのbodyタグに付与されるclassが異なります。
例えば、カテゴリー名が「WordPress」でスラッグが「wordpress」のカテゴリーを作成した場合、そのカテゴリーページのbodyタグのclassに「category-wordpress」が付与されます。
これは「category-xxx」(xxxがスラッグ)のクラスが付与されるということです。
このclassの付与を利用して、カテゴリーページのデザインを変更したい場合は、次のようなCSSを追加します。
.category-wordpress h1 { // カテゴリーページにあるタイトルを変更する
font-size: 16px; // タイトルの文字を大きさを16pxに設定する
}
このようなCSSを追加することで、既に表示されている項目であれば、デザインを変更することができます。
表示される項目自体を変更したい場合
テンプレートファイルを編集または新規作成を行います。テンプレートファイルの編集または新規作成を行う際には、WordPressのテンプレート階層の知識が必要となります。
テンプレート階層とは、WordPressで表示されるページの種類ごとに、読み込まれるテンプレートファイルの優先順位が異なることです。
テンプレートファイルの編集を行う場合は、テンプレート階層にそって、編集すべきテンプレートファイルを探す必要があります。
新規作成を行う際には、テンプレート階層にそって、テンプレートファイル名を決める必要があります。
カテゴリーページのテンプレート階層は以下のようになります。
- category-{slug}.php
- category-{id}.php
- category.php
- archive.php
- index.php
タグページのテンプレート階層は以下のようになります。
- tag-{slug}.php
- tag-{id}.php
- tag.php
- archive.php
- index.php
カテゴリーページやタグページの表示される項目自体を変更したい場合は、これらのテンプレート階層にそって、テンプレートファイルの編集または新規作成を行いましょう。