オリジナルのtheme（テーマ）を作る10：記事の個別ページ用のテンプレートタグ
記事それぞれの個別のページもindex.phpから生成されるので
index.phpに記事の個別ページ用のテンプレートタグを追加します。
個別ページのタイトルを出力
<?php wp_title(); ?>投稿した記事のタイトルが個別ページのタイトルになります。
head内のtitleタグに書きます。
※titleに記述した個別ページのタイトル用のテンプレートタグは、トップページには出力されません。
<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>このように書くと、記事の個別ページのタイトルが下の画像のように表示されます。
<?php wp_title(); ?>を入れると、「»」が勝手に入ります。。
個人的には・・「個別ページのタイトル | サイト名」という表示にしたいのでパラメーターを指定します。
<title><?php wp_title('|',true,'right'); ?><?php bloginfo('name'); ?></title>記事の個別ページにも前へ次へのpagerを出力
<?php if(is_single()): ?>
<nav>
<ul class="pager">
<li class="previous"><?php next_post_link(); ?></li>
<li class="next"><?php previous_post_link(); ?></li>
</ul>
<!--//pager -->
</nav>
<!--//nav -->
<?php endif; ?><?php if(is_single()): ?>～<?php endif; ?>個別ページだけに出力したいものをこの中に書きます。
※トップページには出力されません。
<?php if(is_single()): ?>
<nav>
<ul class="pager">
<li class="previous"><?php previous_post_link('%link'); ?></li>
<li class="next"><?php next_post_link('%link'); ?></li>
</ul>
<!--//pager -->
</nav>
<!--//nav -->
<?php endif; ?>トップページ用に入れたものにそっくりですが、よーく見ると微妙な違いがあるので注意！
prev・nextを逆にしたのは、記事の順番の兼ね合いからです(~_~;)
パラメーター%link
「» «」が表示されていて邪魔だったのでリンクだけ。
01-10までのおさらい。
<main id="main" role="main">
<div class="container">
<section>
<div class="row">
<div class="col-xs-12">
<?php if(have_posts()): while(have_posts()): the_post(); ?>
<article>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<time><?php the_date('Y/m/d (D)'); ?><?php the_time(); ?></time>
<div class="well well-lg">
<div class="categorybtn">
<?php the_category(); ?>
</div>
<!--//categorybtn -->
<?php the_content(); ?>
</div>
<!--//well well-lg -->
</article>
<!--//article -->
<?php if(is_single()): ?>
<nav>
<ul class="pager">
<li class="previous"><?php previous_post_link('%link'); ?></li>
<li class="next"><?php next_post_link('%link'); ?></li>
</ul>
<!--//pager -->
</nav>
<!--//nav -->
<?php endif; ?>
<?php endwhile; endif; ?>
<?php if(is_home()): ?>
<nav>
<ul class="pager">
<li class="previous"><?php next_posts_link('<i class="fa fa-angle-left"></i> Older'); ?></li>
<li class="next"><?php previous_posts_link('Newer <i class="fa fa-angle-right"></i>'); ?></li>
</ul>
<!--//pager -->
</nav>
<!--//nav -->
<?php endif; ?>
</div>
<!--//col -->
</div>
<!--//row -->
</section>
</div>
<!--//container -->
</main>
<!--//#main -->