WordPressの始め方と使い方をわかりやすく解説!

WordPressでカテゴリーページやタグページのデザインやレイアウトを変更する方法

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で表示されるページの種類ごとに、読み込まれるテンプレートファイルの優先順位が異なることです。

テンプレートファイルの編集を行う場合は、テンプレート階層にそって、編集すべきテンプレートファイルを探す必要があります。

新規作成を行う際には、テンプレート階層にそって、テンプレートファイル名を決める必要があります。

カテゴリーページのテンプレート階層は以下のようになります。

  1. category-.php
  2. category-.php
  3. category.php
  4. archive.php
  5. index.php

タグページのテンプレート階層は以下のようになります。

  • tag-.php
  • tag-.php
  • tag.php
  • archive.php
  • index.php

カテゴリーページやタグページの表示される項目自体を変更したい場合は、これらのテンプレート階層にそって、テンプレートファイルの編集または新規作成を行いましょう。

関連記事

FOXWP

Conoha WINGからエックスサーバーにWordPressの引越しを行う手順

Conoha WINGからエックスサーバーに引越しを行う手順 Conoha WINGからエックスサーバーに引越しを行う際の注意点 ネームサーバーがエックスサーバーのネームサーバーに設定されていないと、無料独自SSLの設定

FOXWP

wp-envで構築したWordPressのデータベースへアクセスする手順

wp-envで構築したローカル開発環境のデータベースにサクセスするには、Local WordPress EnvironmentのAccessing the MySQL Databaseに記載されている方法で行えます。 参

FOXWP

【WordPress】はじめてのブロックエディター開発

この記事では、WordPressでブロック開発をした際のメモです。 WordPressで必要最低限のブロックを開発するには、@wordpress/create-blockパッケージを作成することですぐにできます。 参考:

FOXWP

wp-envとは?使い方を解説

wp-envを利用した際のメモです。 wp-envとは? ローカルのWordPress開発環境 wp-envとは、ローカルのWordPress開発環境です。Docker Desktopと合わせて利用します。 wp-env

FOXWP

WordPressのおすすめセキュリティプラグイン6選

WordPressセキュリティプラグインを使えば、専門的知識がない方でも手軽にセキュリティ対策を行うことができます。 マルウェア・ブルーフォースアタック・ハッキングといった様々な障害からあなたを守ってくれます。 この記事

FOXWP

WordPressでおすすめの目次プラグイン8選

記事に目次を挿入すれば、読者に記事の全体像を理解してもらいやすくなります。欲しい情報があるか判断する手助けとなり、読者にとって使いやすいサイトと認識してもらえます。 この記事では、目次を挿入できるおすすめのWordPre