WordPressテーマでアーカイブページを出力する

前回は記事や固定ページを実装しました。

今回はアーカイブページを実装していきます。

 

アーカイブページ(archive.php)の実装

アーカイブページといっても、記事のクエリはWordPressで行ってくれるのでインデックスページの記事一覧と同じように実装できます。archive.phpのコードを示します。

<?php get_header(); ?>
  <main id="main">
<?php
if ( have_posts() ) :
?>
    <header class="page-header">
<?php
the_archive_title( '<h1 class="page-title">', '</h1>' );
the_archive_description( '<div class="archive-description">', '</div>' );
?>
    </header>
    <div class="entry-list">
<?php
  /* ループ開始 */
  while ( have_posts() ) :
    the_post();
?>
      <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
        <time class="entry-time" datetime="<?php the_time('Y.m.d'); ?>"><?php the_time('Y.m.d'); ?></time>
<?php
    if (get_the_modified_time('Y.m.d') != get_the_time('Y.m.d')) :
?>
        <time class="entry-time">(最終更新日: <?php the_modified_time('Y.m.d'); ?>)</time>
<?php
    endif;
?>
<?php
    if ( has_post_thumbnail() ) :
?>
        <div class="entry-thumbnaiil"><a href="<?php the_permalink(); ?>" alt="<?php the_title_attribute(); ?>" rel="bookmark"><?php the_post_thumbnail(); ?></a></div>
<?php
    endif;

    if ( has_category() ) :
      $categories = get_the_category();
  ?>
        <div class="entry-category">
  <?php
      foreach($categories as $category) :
  ?>
          <a href="<?php echo get_category_link($category->term_id); ?>" rel="tag"><?php echo $category->cat_name ?></a>
  <?php
      endforeach;
  ?>
        </div>
  <?php
    endif;

    if ( is_singular() ) :
?>
        <h1 class="entry-title"><?php echo get_the_title(); ?></h1>
<?php
    else :
?>
        <h2 class="entry-title"><a href="<?php the_permalink(); ?>" rel="bookmark"><?php echo get_the_title(); ?></a></h2>
<?php
    endif;
?>
      </article>
<?php
  endwhile;
?>
    </div>
<?php
  the_posts_pagination();
else :
?>
    <header class="page-header">
      <h1 class="page-title">記事が存在しません</h1>
    </header>
<?php
endif;
?>
  </main>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

上記のarchive.phpで様々なアーカイブページを出力できます。下は任意のカテゴリーを表示させてみました。

66行目以降のコードですが、カテゴリー内に記事が存在しない場合(have_posts()による判定で記事が存在しない場合は)に「記事が存在しません」というh1見出しを出力するような処理にしています。

インデックスページの記事一覧の出力では使用していない関数について説明を加えます。

・the_archive_title()

アーカイブページのタイトルを出力します。デフォルトだと例えばカテゴリーだったら「カテゴリー:XXX」、タグだと「タグ:XXX」というように出力されます。

・the_archive_description()

現在のアーカイブページの種類に応じた説明を出力します。WordPressダッシュボードのカテゴリーやタグの説明欄の内容を出力します。

 

タイトルの出力をカスタマイズする

the_archive_title()で出力される文字列を変更したい場合があると思います。

その場合は例えばfunction.phpに次のように追加すれば変更することができます。

function change_archive_title( $title ) {
  if( is_category() ) {
    $title = single_cat_title( '', false );
  }
  return $title;
}
add_filter( 'get_the_archive_title', 'change_archive_title' );

上のコードのsingle_cat_title()はカテゴリー名を取得する関数として使用しています。上記ではそれを用いてカテゴリー・タグ名の値のみを返す関数を作成しそれをadd_filter()という関数でget_the_archive_title()に紐付けしています。the_archive_title()ではこの関数で取得された値を表示するので、表示が変更されるという仕組みです。

ちなみにget_the_XXXのような関数は、値だけ返すのでechoが必要で、the_XXXのような関数はそれだけで表示まで行ってくれるのでechoを行う必要がないという違いがあります。

また上記のコードだけでは、「カテゴリー:」しか削除されません。「タグ:」や「月別:」などを削除したいという時は適宜is_XXXの判定を増やして処理を追加する必要があります。全て削除したいという場合は以下のページなどを参考にすると良いでしょう。

 

まとめ

今回はarchiveページの実装を行いました。これでカテゴリー、タグや時系列アーカイブなどでの記事一覧の出力が行われるようになります。

例によって今回実装した部分を含めたテーマを置いておきます。

test_theme_4

次回は検索機能の実装を行いたいと思います。

return-top