はじめての『WordPress』入門

3-7. カテゴリーページのテンプレート

WordPress の投稿は「カテゴリー」で分類することができます。このレッスンでは、分類されたカテゴリーごとに投稿を一覧表示する方法を説明します。

  • WordPress

公開日:2020/04/03最終更新日:2020/04/03

1.投稿をカテゴリーで分類する

WordPress の投稿は、「カテゴリー」というもので分類することができます。

カテゴリーは管理画面の投稿>カテゴリーで追加・編集・削除することができます。

カテゴリーは「親カテゴリー」を設定することで、階層を作ることができます。

例えば「デザイン」というカテゴリーをさらに分類した「Web デザイン」「UI デザイン」のような子カテゴリーを作ることができます。

2.category.php - カテゴリー用のテンプレートを用意する

投稿をカテゴリーで分類したら、カテゴリー別に投稿を一覧表示してみましょう。

まずはカテゴリー用のテンプレートを作成します。ファイル名は以下のとおりです。

category.php

index.php や single.php などと同じように、ヘッダーとフッターを読み込みます。

ヘッダーの読み込み

get_header();

フッターの読み込み

get_footer();

3.カテゴリーページによく使われる WordPress 関数

signle_cat_title() - 現在のページのカテゴリー名を表示する

single_cat_title();

カテゴリーページのタイトルなどを表示する箇所に使用します。必ずループ外で使用してください。

category_description() - 現在のページのカテゴリー説明文を取得・出力する

カテゴリーには管理画面で「説明文」を付け加えることができます。

category_description();

これはカテゴリーの説明文を取得する関数です。

実際に表示する際は以下のように記述します。

<?php
if(category_description()):
echo category_description();
endif;
?>

パンくずリストを表示する

カテゴリーページのパンくずリストは以下のように作るのが理想的です

ホーム > 親カテゴリ名 > 子カテゴリ名

PHP は以下のように書いてみましょう。

<?php
$tax_slug = 'category';
$id = get_query_var('cat');
$term = get_term($id,$tax_slug);
?>
<ul class="breadcrumb">
<li><a href="<?php echo home_url('/') ?>">ホーム</a></li>
<?php
$parent_term_id = $term->parent;
$parent_term = get_category($parent_term_id);
if($parent_term_id):
?>
<li>&nbsp;&gt;&nbsp;<a href="/category<?php echo '/'.$parent_term->slug ?>"><?php echo $parent_term->name ?></a></li>
<?php endif; ?>
<li>&nbsp;&gt;&nbsp;<a href="/category<?php echo '/'.$term->slug; ?>"><?php echo $term->name; ?></a></li>
</ul>

装飾やレイアウトは CSS で整えましょう。

ループ

メインのテンプレートと同じです。

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
// ここに表示内容を記述する
<?php endwhile; else : ?>
<p>まだ記事がありません</p>
<?php endif; ?>

「ここに表示内容を記述する」というところに、タイトルや日付・本文の WordPress 関数を記述します。

the_title() - タイトルを表示する

the_title()はタイトルを表示する関数です。

the_excerpt() - 投稿の抜粋を表示する

抜粋は本文から 110 文字を自動的に取得して表示する機能です。

the_time() - 日時を表示する

the_time()は時間を表示する関数です。引数を指定することで、日付・時間を任意の形で出力できます。

例えばthe_time('m月d日')だと先頭にゼロがつかない月日が出力できます。

※「3-4 メインのテンプレート」を参照

the_tags() - リンクありのタグを表示する

the_tags()はタグ一覧ページへのリンクがついた状態でタグを一覧表示することができる関数です。

リンクなしのタグを表示する

タグをリンクなしで出力したい場合は、少し複雑です。get_the_tags()でタグを取得し、foreach という命令で 1 個ずつタグ名を取り出して表示します。

<?php
  $tags = get_the_tags();
    if($tags){
      foreach($tags as $tag){
        echo $tag->name.'&nbsp;';
      }
    }
?>

ページネーションを追加する

ループの中にページネーションを追加します。

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
// ここに表示内容を記述する
<?php endwhile; ?>
<?php the_posts_pagination(); ?>
<?php else : ?>
<p>まだ記事がありません</p>
<?php endif; ?>

子カテゴリー名を取得・出力する

親カテゴリーページを表示している際に、所属する子カテゴリーを一覧表示するには、以下の記述で行います。

<?php $categories = get_term_children($term->term_id,'category'); ?>
<?php if($categories): ?>
<ul>
  <?php foreach($categories as $category){ ?>
  <?php $child_term = get_category($category); ?>
  <li>
    <a href="/category<?php echo '/'.$term->slug.'/'.$child_term->slug; ?>">
      <?php echo $child_term->name; ?>
    </a>
  </li>
<?php } ?>
</ul>
<?php endif; ?>

4.特定のカテゴリーだけ表示を切り替える

例えば「Web デザイン」というカテゴリーのときは特別の画像を表示する、レイアウトを変更するなど、特定のカテゴリーの場合に表示を切り替えることができます。

is_category() - 条件分岐させる

is_category()は、現在開いているページがカテゴリーページかどうかを判定することができる関数です。カッコの中に引数としてカテゴリーの ID やタイトルを指定すると、該当のカテゴリーかどうかを判定することができます。

以下のように記述すると、「Web デザイン」というカテゴリーのページを開いていた場合のみ、文言が表示されます。

<?php
if(is_category('Webデザイン')){
  echo 'Webデザインについての投稿を表示しています。';
}
?>

専用のテンプレートを用意する

category.php はカテゴリーページ用の汎用的なテンプレートです。これをさらに細分化して、カテゴリー別のテンプレートページを作成することができます。

- category-○○○(スラッグ).php

例えば「web-design」というスラッグのカテゴリーページを作りたいときは

- category-web-design.php

という名前でテンプレートを作成します。すると該当のスラッグの場合のみ、このテンプレートが適用されます。

理解度チェック

このレッスンの著者