投稿一覧の表示と投稿テンプレートを使った投稿の表示

前回の記事では、投稿の基本概念と固定ページとの違いについて学びました。今回は、実際に投稿一覧を表示し、投稿専用のテンプレートファイルを作成する方法について詳しく解説します。

今回の目標

• 標準機能のループブロックを使って投稿一覧を表示する
• 投稿専用のテンプレートファイル（single.php）を作成する
• 投稿データを追加して一覧表示の動作を確認する
• パーマリンクの概念を理解する

それでは、実践的な内容を見ていきましょう。

標準機能での投稿一覧を表示

まずは、WordPressの標準機能であるクエリーループを使用して、投稿一覧を表示する方法から始めます。

クエリーループの配置

1. 管理画面にログインし、固定ページ > 固定ページ一覧 から「ようこそ」ページを編集します
2. ループブロックを配置します
   • ブロックエディターで「ループ」を検索
   • クエリループブを選択
   • 新規を選択
   • バリエーション選択 で タイトルと日付 を選択
3. タイトルをリンクにするを有効にする
4. 保存を実行

表示の確認

ページを表示すると、投稿一覧が表示されることを確認できます。デフォルトでは、WordPressインストール時に自動作成される「Hello world!」投稿が表示されているはずです。

タイトルをクリックすると、投稿の詳細ページへ遷移します。

このとき、固定ページとは異なるデザインで表示されることに注目してください。

これは、以前に作成したindex.phpがテンプレートとして適用されているためです。

なぜindex.phpが使用されるのか？

これまでの学習で、固定ページにはpage.phpという専用のテンプレートファイルを作成して使用してきました。同様に、投稿にはsingle.phpという専用のテンプレートファイルを使用します。

現在、投稿用のsingle.phpがまだ作成されていないため、WordPressは代わりにindex.phpを使用しています。index.phpは、他に適切なテンプレートが見つからない場合に使用される「最後の砦」のような存在です。

投稿用のテンプレートを作る

投稿には専用のテンプレートファイルが用意されています。それがsingle.phpです。

single.phpファイルの作成

1. 新しいファイルを作成
   • テーマフォルダにsingle.phpファイルを新規作成
2. page.phpの内容をコピー
   • 既存のpage.phpのコードをそのままsingle.phpにコピー
3. 表示メッセージを変更
   • 「※このページは page.php テンプレートで表示されています」を「※この投稿は single.php テンプレートで表示されています」に変更
4. 保存

動作確認

再度投稿ページを表示すると、single.phpがテンプレートとして採用されていることが確認できます。これで、投稿には投稿専用のテンプレートが適用されるようになりました。

投稿の件数を増やしてみる

投稿一覧の動作をより詳しく確認するために、投稿をいくつか追加してみましょう。

投稿の追加

管理画面から「投稿」>「新規追加」で、以下のような投稿を5件ほど作成してください。タイトルや内容は適当で大丈夫です。

1. Webサイト開設のお知らせ
2. 夏季休暇のお知らせ
3. WordPress講習会開催のお知らせ
4. SNS総フォロワー100人を達成しました
5. 新店舗オープンのお知らせ

一覧表示の確認

投稿を追加したら、ようこそページ（トップページ）を開いて一覧の表示を確認してください。

「Hello world!」を含め、計6件の投稿が一覧に表示されているはずです。各投稿のタイトルをクリックすると、詳細ページへ遷移できることも確認してください。

投稿は日付順

固定ページは順序で設定により並び変わりましたが、投稿はデフォルトで投稿日の降順（新しい順）に並びます。

もちろん並び替えの順番を変更することは可能ですが、基本的に順序は使わず、投稿日やカテゴリーの順に並べるのが一般的です。

パーマリンクの概念を理解する

投稿のURLを確認してみてください。おそらく以下のようなURLになっているはずです。

http://sample.local/Webサイト開設のお知らせ

このように、タイトルがそのままURLになっています。これは、投稿のスラッグがタイトルになるためです。

そして、投稿を作成する際、タイトルを入力すると自動的にスラッグも生成されます。

例えば、「Webサイト開設のお知らせ」というタイトルを入力すると、スラッグも「Webサイト開設のお知らせ」となり、それがそのままURLに反映されます。

パーマリンクとは

WordPressでは、サイト内のURLのをパーマリンクと呼びます。「Permanent Link（永続的なリンク）」の略で、以下の特徴があります。

• 各投稿に対して一意のURLが生成される
• 管理画面や関数名でも「パーマリンク」「permalink」という用語が使われる
• 設定により、さまざまな形式のURLを生成できる

パーマリンクの概念は、WordPressを学ぶ上で重要な概念ですので、ぜひ覚えておいてください。

今回の学習はここまで

今回は、投稿一覧の表示から投稿専用テンプレートの作成、そしてパーマリンクの基本概念まで学習しました。これで、WordPressの投稿システムの基本的な仕組みを理解することができました。

投稿も基本的には固定ページと同じなので、これまで学習を進めてきた皆様にとっては、十分理解できる内容だったかと思います。

まとめ

今回は、以下の内容について学習しました：

1. 標準機能のループブロックを使った投稿一覧の表示
2. single.phpテンプレートを使った投稿の表示
3. 投稿データの追加による動作確認
4. パーマリンクの概念の理解

今回はWordPressの標準機能であるループブロックを使用しましたが、自分でループを作成することも可能です。自分でループを作成することにより、レイアウトやデザインをより自由自在にカスタマイズできるようになります。この方法については、後の記事で詳しく紹介する予定です。

次回予告

次回の記事では、以下の内容を予定しています：

パーマリンクの書式変更

• http://sample.local/news/Webサイト開設のお知らせ
• http://sample.local/news/123（IDを使用）

のように、パーマリンクの形式を変更する方法を解説します。

カテゴリーの活用

• カテゴリーを使った投稿の分類方法
• 特定のカテゴリーだけを一覧に表示する方法

これらの機能を理解することで、より効率的で使いやすいWordPressサイトを構築できるようになります。

成果物

この記事で作成した成果物は、以下のページでまとめて確認することができます。

成果物をまとめて確認する

［成果物］投稿一覧の表示と投稿テンプレートを使った投稿の表示

【投稿一覧の表示と投稿テンプレートを使った投稿の表示】の成果物です。投稿の学びを終えた時点の構成を一覧でご確認いただけます。

この投稿をシェアする