タグページを作成する[tag.php][single_tag_title][the

テーマを一から作成する　第15回目

前回は検索機能を追加しました。今回は、タグページを作成します。

第14回目

検索機能を追加する[search.php][get_search_form][the_search_query]

タグページを表示することができるテンプレートは以下の5つありますが、今回はtag.phpを利用します。

1　tag-スラッグ名.php
2　tag-ID番号.php
3　tag.php
4　archive.php
5　index.php

今回作成するタグページの構成は、基本的にindex.phpと変わりません。「記事」の部分に特定のタグ記事一覧を表示させます。

indexを分割

まずはtag.phpテンプレートを作成し、テーマディレクトリ（/wp-content/themes/sample/以下）にアップロードして下さい。外観＞テーマの編集　で見てみると投稿タグテンプレートとして認識されていることが分かります。

投稿タグテンプレート

tag.phpが用意できたら、下記のコードを記述して下さい。

<?php get_header(); ?>

<main>
  
<p><?php single_tag_title(); ?>記事の一覧です</p>

<?php if(have_posts()): while(have_posts()):the_post(); ?>
  
  <h1><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>
  
  <time datetime="<?php the_time('Y-m-d'); ?>"><?php the_time('Y.m.d'); ?></time>
  <p><?php the_category(', '); ?></p>
  <p><?php the_tags(''); ?></p>
  
  <!--アイキャッチ画像-->
  <?php if( has_post_thumbnail() ): ?>
  <a href="<?php the_permalink(); ?>" ><?php the_post_thumbnail('thumbnail'); ?></a>
　<?php else: ?>
  <a href="<?php the_permalink(); ?>" ><img src="<?php echo get_template_directory_uri(); ?>/images/no-image.png" ></a>
　<?php endif; ?>
  <!--アイキャッチ画像End-->
  
  <p><?php the_content('Read more'); ?></p>
  
<?php endwhile; endif; ?>
  
<?php previous_posts_link('新しい投稿ページへ'); ?>
<?php next_posts_link('古い投稿ページへ'); ?>

</main>

<?php get_sidebar(); ?>

<?php get_footer(); ?>