ケケンタこんにちは！ ケケンタです。
今回は
WordPressのオリジナルテーマで
「投稿一覧ページ」を作成する方法
をご紹介します。
- サイトのトップページを「投稿一覧ページ」にする方法
- トップページとは別に「投稿一覧ページ」を作成する方法
- 「投稿一覧ページ」へのリンクを作成する方法
WordPressではオリジナルテーマでも簡単に「投稿一覧ページ」を作成することが可能です。
しかし、実際に初めて作成しようとしてみると、意外と作成手順に迷ってスムーズに作業が進められなかったりします。
ケケンタこの記事が投稿一覧ページ作成の一助となれば幸いです！
格安レンタルサーバーを
お探しなら
格安サーバーをお探しならリトルサーバーがおすすめ！
- 月額150円～利用可能
- 標準で全サーバー毎日自動バックアップ付き
- 全プランWordPress対応（簡単インストール機能付き）
- 独自SSLが無料（全プランがSSLに完全対応）
- 提供ドメインが複数あるため独自ドメインが無くても複数サイト運営可能
- 独自ドメイン無制限（サブドメインも無制限で利用可能）
- 無料お試し期間がある
リトルサーバーの最大の特徴は安価な月額料金です
＼ 利用料金比較表 ／
| ミニプラン | ワードプラン | リトルプラン | ビッグプラン | |
|---|---|---|---|---|
| 月額料金 | 150円～ | 195円～ | 250円～ | 430円～ |
| SSD容量 | 20GB | 30GB | 60GB | 120GB |
| 提供ドメイン | アカウント＋２ | アカウント＋２ | アカウント＋３ | アカウント＋５ |
| 独自ドメイン | 無制限 | |||
| バックアップ | ７日分 | |||
有名なサーバーだと月額料金は1000円前後であることが普通です。
仮にリトルサーバーで同じ料金（1000円）を支払ったとすると
最も安いミニプランだと半年分、
おすすめのリトルプランでも４カ月分のサーバーがレンタル可能！
こんな方にオススメ
- 実案件でテスト用のサーバーを用意したい
- とりあえずサーバーというものに触れてみたい
- 試しにWordPressを本番運用してみたい
- いま利用しているサーバーが高額だから安価なレンタルサーバーに乗り換えたい
ケケンタリトルサーバーには無料お試し期間があります。
ご興味のある方は是非ご検討してみてはいかがでしょうか。
＼無料お試しのお申し込みはこちら／
「仕事が忙しい方」、「すぐに商品が欲しい方」にピッタリのサービス
日時指定便が「無料」で使えるので不在で商品を受け取れないという心配が無くなる
最短で注文した「翌日」に商品が届くので欲しいものがすぐ手に入る
※ご注文の時間帯やお住まいの地域によります。
Amazonプライムの無料体験は「何度でも」利用可能
Amazonプライムの無料体験を何度も利用する方法
- Amazonプライムに会員登録する
- 会員の自動更新を解除しておく＝期限が来たら自動解約
- １～３ヶ月ぐらいすると再度無料体験の案内が表示される
ケケンタ僕自身、過去に少なくとも３回は無料体験を利用しています。
【その①】「投稿一覧ページ」をサイトのトップページにする方法
いま現在、「何らかのページ」をトップページとして設定していないのであれば、恐らくデフォルトで「投稿一覧ページ」がサイトのトップページに設定されているはずです。
まずは現在のトップページの設定状況を確認するために
管理画面の「設定」→「表示設定」
をご確認ください。
こちらの画面で「最新の投稿」が選択されていれば、すでに「投稿一覧ページ」がサイトのトップページとして設定されています。
補足
「投稿一覧ページ」がサイトのトップページとして設定されているにも関わらず、トップページに何も表示されないという場合には、以下のいずれかのファイルをテーマディレクトリ直下に作成し、こちらのソースコードを記述してみて下さい。
- front-page.php …… トップページ用のテンプレートファイル
- home.php …… 投稿一覧用のテンプレートファイル
【その②】トップページとは別に「投稿一覧ページ」を作成する方法
トップページとは別に「投稿一覧ページ」を作成する主な流れは以下の通りです。
- 「投稿一覧ページ用の固定ページ」を作成する
- 投稿一覧ページ用のテンプレートファイル（home.php）を作成する
ケケンタ順を追ってご説明します！
【手順①】「投稿一覧ページ用」の固定ページを新規作成する
まずは「投稿一覧ページ用の固定ページ」を作成していきます。
新規に固定ページを追加します。
固定ページにタイトルをつけます。
このとき、タイトルは自由なもので大丈夫なのですが、分かりやすく「投稿一覧ページ」や「ブログ一覧ページ」などとすることをおすすめします。
固定ページにタイトルをつける
ケケンタ本文は「空欄」のままでOKです。
タイトルまで入力したら「公開」をクリックしましょう。
次に、固定ページの「スラッグ」を決めます。
※ここで決めたスラッグは最終的に「投稿一覧ページのURL」に使用します。
こちらもタイトルと同様で自由なスラッグ名で問題はないのですが、分かりやすく「blog」や「post」とするのが一般的です。
固定ページにスラッグをつける
最後に、管理画面「設定」→「表示設定」で、作成した固定ページを「投稿ページ」に設定します。
作成した固定ページを「投稿ページ」に設定
【手順②】投稿一覧ページ用のテンプレートファイル（home.php）を作成する
【手順①】が完了したら、続いて投稿一覧ページ用のテンプレートファイル（home.php）を作成していきます。
テーマディレクトリ直下にhome.phpを作成します。
※念のため補足で、以降のディレクトリ画像はローカル上のものです。
home.phpを作成
STEP1まで完了していれば、「投稿一覧ページ」を表示すること自体は可能です。
しかし、このままだとhome.phpの中身が空っぽで何も表示されないため、STEP2ではhome.phpに必要なソースコードを追加します。
home.phpに追加するソースコードの例
<main>
<div>
<h2>投稿一覧ページ</h2>
<!-- メインループを回して記事をひとつずつ出力する -->
<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<!-- タイトル -->
<?php the_title(); ?>
<?php endwhile ?>
<?php endif; ?>
</div>
</main>
【補足】「投稿一覧ページ」へのリンクを作成する方法
前章の方法で「投稿一覧ページ」を作成した場合における「投稿一覧ページ」へのリンクを作成する方法をご説明します。
ケケンタ方法はいたってシンプルで、以下の１行で「投稿一覧ページ」へのリンクを作成することが可能です。
「投稿一覧ページ」へのリンク
<a href="<?php echo esc_url( home_url('/先ほど作成した固定ページのスラッグ/') ); ?>">投稿一覧ページ</a>例えば、投稿一覧ページ用に作成した固定ページのスラッグが「blog」であれば、以下のような記述になります。
（例）スラッグが「blog」の場合
<a href="<?php echo esc_url( home_url('/blog/') ); ?>">投稿一覧ページ</a>まとめ
いかがだったでしょうか。
投稿一覧ページを作成する場合、
トップページとしてすでに別のページが設定されているかどうか
によってその方法が若干異なってきます。
その方法の違いは
「投稿一覧ページ用の固定ページ」を作成するかどうか
です。
トップページがすでに別に用意されている、あるいは別に用意する予定であれば、「投稿一覧ページ用の固定ページ」を別途実装する必要があります。
投稿一覧ページは恐らくWordPressオリジナルテーマにおいて実装頻度が高い方かと思いますので、この記事がお役に立ったなら何よりです。
ケケンタそれでは、最後までご覧いただきありがとうございました。
当ブログではWordPressやWeb制作、PHPの情報を発信しています。
ご興味のある方は他の記事もご覧いただけると嬉しいです。
コメント