これまでの記事でメインループで投稿を一覧に表示させる仕組みを解説しました。
本記事では、メインループで表示させた投稿をクリックしたときに表示させる個別投稿ページの作成と解説をします。
WordPressを扱う上で、欠かせない仕組みになるので理解していきましょう。
個別投稿ページとは
個別投稿ページとは、投稿ページ一覧の中の記事をクリックした際の遷移先のページになります。つまり、記事の中身が書かれている詳細のページになります。
画像で言うところの青枠が「個別投稿ページ」です。
ページ例
投稿一覧ページ ZeroPlus Mediaの例
個別投稿ページ ZeroPlus Mediaの例
テンプレートファイル
個別投稿ページを作成するために使用するテンプレートファイルもWordPressのテンプレート階層で明言されています。
個別投稿ページで使用するファイルとして上から順に以下のように優先されて表示されます。
- single-post.php
- single.php
- singular.php
- index.php
single-post.phpがなければ、single.phpが表示され、さらになければsingular.phpが表示されるというようになっています。
規模によって作成するファイルを決定しましょう。
個別投稿ページを作成
投稿一覧ページは作成している前提で、個別投稿ページの作成の解説をします。
メインループを使って投稿一覧ページを作る流れについては、「WordPressのメインループを使って投稿を表示しよう」の記事をご覧ください。
個別投稿内容を表示する
個別投稿ページのサンプルコードをもとに確認してみましょう。
サンプルコード
<article class="l_container-sm single">
<?php
if (have_posts()) :
while (have_posts()) :
the_post();
?>
<div class="single_main_thumb-wrapper">
<?php the_post_thumbnail(null, array('class' => 'single_main_thumb')); ?>
</div>
<div class="single_main_content">
<h1>
<?php the_title(); ?>
</h1>
<?php the_content(); ?>
</div>
<?php
endwhile;
else:
?>
<p>投稿データはありません</p>
<?php endif; ?>
</article>個別投稿内容を表示するために使用するWordPressの関数としては、メインループで使用している関数とあまり変わりはありません。
WordPressのメインループは、表示しようとしているファイル名によって出力する内容が変わるようになっています。
投稿一覧ページ： 投稿があるだけ繰り返し表示する
個別投稿ページ： 任意の投稿の内容を表示する
関数などの詳細は「WordPressのメインループを使って投稿を表示しよう」の「メインループを書く」セクションをご覧ください。
上記記事で解説していない関数を紹介します。
the_content();
その投稿の本文の内容を表示します。
<div class="post_content">
<?php the_content(); ?>
</div>
まとめ
個別投稿ページの作成方法について解説しました。
投稿一覧ページで使用する関数とあまり変わりませんが、メインループは呼び出されるファイルによって出力するデータが違うんだなと思ってもらえるといいかと思います。
