【SWELL】WordPressで新着記事一覧ページを作成し表示させる方法

どうも、ひろもん(@hiromon_com)です。

『SEWLL』に限ったことではありませんが、WordPressで新着記事一覧を表示させたいことってありますよね?

WordPressの設定でホームページの表示を「最新の投稿」にしている場合、トップページに新着記事一覧が表示されるので問題ありませんが、ホームページの表示を「固定ページ」に設定している場合、新着記事一覧ページを表示させるにはひと手間かける必要があります。

そこで今回は、ホームページの表示を[固定ページ]にしている場合の、新着記事一覧ページ作成方法を解説します。

もくじ

新着記事一覧ページ

新着記事一覧ページとはその名の通り、記事が新着順に一覧表示されるページのことで、WordPressの初期設定ではホームページの表示が[最新の投稿]になっており、ブログのトップページに新着記事一覧が表示されるようになっています。

ホームページの表示設定

ブログのトップページに何を表示させるか決める設定です。

  1. 最新の投稿に設定 → トップページに記事が新着順に表示される(ブログ風)
  2. 固定ページに設定 → トップページに任意の固定ページを表示される(サイト風)

ホームページの表示が「最新の投稿」

ホームページの表示設定の確認方法は以下です。

ホームページの表示確認手順1

[設定]にカーソルを合わせるとサブメニューが表示されるので、[表示設定]をクリックします。

ホームページの表示確認手順2

一番上にあるのがホームページの表示で、初期設定では画像のように[最新の投稿]になっており、この設定だとトップページに新着記事一覧が公開順に表示されます。

ひろもんブログのトップページ表示例

上の画像はホームページの表示を[最新の投稿]にしている場合のトップページの表示例ですが、この設定のままブログを運営する方はトップページに新着記事が一覧表示されるので、とくに作業は必要ありません。

続いてホームページの表示を[固定ページ]にした場合について解説していきます。

ホームページの表示が「固定ページ」

ホームページの表示を[固定ページ]にすると、自分で作成した固定ページをブログのトップページに表示させられるので、凝った作りのトップページにできます。

ただし、初期設定で表示されていた新着記事一覧は表示されなくなるので、新着記事一覧ページを表示させたい場合は、自分で作成する必要があります。

ホームページの表示を固定ページに設定

当ブログではあらかじめ作成した固定ページをトップページに設定しており、新着記事一覧ページはこれから紹介する手順で作成し表示させています。

新着記事一覧ページ作成手順

作業手順は非常に簡単です。

新着記事一覧ページ作成手順
  1. 本文なしの固定ページを作成
  2. 作成した固定ページを投稿ページとして設定
  3. 本文なしの固定ページに新着記事一覧が表示される

まずは固定ページの作成から始めます。

新着記事一覧ページ作成手順1

本文を空欄にした固定ページを新規作成します。

タイトル:新着記事(任意で変更)
パーマリンク:new-post(任意で変更)

タイトルもパーマリンクも新着記事一覧ページだとわかるように入力し、そのままページを公開します。

新着記事一覧ページ作成手順2

続いてホームページの表示設定にある[投稿ページ]に、先程作成した本文なしの固定ページを設定します。

これで先程まで本文なしだった固定ページに新着記事一覧が表示されるようになったので、試しにページを表示してみます。

新着記事一覧ページ作成手順3

ページの左上には先程設定したタイトルが表示され、新着記事一覧がきちんと表示されています。

ちなみに1ページに表示される最大投稿数は、以下の設定で変更できます。

1ページに表示する最大投稿数の変更手順

ホームページの表示設定のすぐ下にある「1ページに表示する最大投稿数」の数値を変更すると、新着記事一覧ページの表示数を変更できます。

まとめ

新着記事一覧ページ作成手順
  1. 本文なしの固定ページを作成
  2. 作成した固定ページを投稿ページとして設定
  3. 本文なしの固定ページに新着記事一覧が表示される

今回はホームページの表示を[固定ページ]にしている場合の、新着記事一覧ページ作成方法を解説してきましたが、いかがでしたか?

やり方は簡単なので、「新着記事一覧ページってどうやるんだっけ?」と思っていた方の参考になれば嬉しいです。

ひろもん

トップページを固定ページにしていても、新着記事一覧ページを作成していない方もわりといるので、ユーザーのことを考えると作成しておいた方がいいかもしれません。

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!

コメント

コメント一覧 (6件)

    • ゆうさん、こんにちは。
      コメントありがとうございます。

      わかりやすさに気をつけているので、
      そう言っていただけて嬉しいです^^

      また遊びに来てください。

  • こんにちは。
    ブログで、トッッページに記事を4列表示(サイドバーなし)にし、記事をクリックすると、記事ページに進むとサイドバーを表示することはできますか?
    ひろもんさんのページの、最上部にある4列表示になっている状態をトッッページ全体に表示させたいと思っているわけです。
    突然のぶしつけな質問でご迷惑をおかけしますが、お教えいただければ幸いです。
    よろしくお願いします。

    • shinpeiさん、コメントありがとうございます。

      ■トップページ
      ・サイドバーなし
      ・記事を4列表示
      ■記事ページ
      ・サイドバー表示

      上記のようにしたいとのことですが、
      「SWELL」はページ単位で
      サイドバーの表示/非表示を切り替えられるので、
      ご希望の配置にも対応可能です。

      「SWELL」が手元にないとイメージしずらいかと思いますが、
      以下の手順で対応可能かと思います。

      1、固定ページを新規追加
      2、フルワイドブロック追加
      3、フルワイドブロック上にカラムブロック追加
      4、カラムブロックを4列に設定(幅はお好みで設定)
      5,各カラムに記事のサムネを画像として配置
      6、配置したサムネ画像に記事へのリンクを追加
      7、サイドバーを非表示に設定し記事を公開
      8,作成した固定ページをトップページに設定

      参考になれば幸いです。

  • 「新着記事をもっと見る」をクリックしても、新着記事が出てこない問題がこの記事のおかげで解消されました!ありがとうございます。

コメントする

もくじ
閉じる