プラグイン

WordPressで新着記事を簡単に表示できるプラグイン!

2020年2月28日

新着記事はユーザーに新しい情報を伝えるために、Webサイト・ブログには欠かせない要素です。

WordPressでブログを運営していく中でトップページだけでなく、固定ページや投稿の関連記事部分、サイドバーなどに新着記事を表示させたい時ってありますよね。

今回はWordPressで構築したサイトに新着記事を表示させる方法としてプラグインで表示させる方法をご紹介いたします。

プラグインで新着記事を表示させる

WordPressのプラグインを利用して新着記事を表示させる方法をご紹介します。

HTML・CSS、PHPといったプログラミングに関する専門知識が無い方は、WordPressのプラグインを利用することをおすすめします。初心者でも設定が簡単にできます。

プラグインで新着記事を表示させる場合、プラグインをインストールした後で、Webサイトのどこに表示させるのか、またどのように表示させるか設定する必要があります。

新着記事を表示できるプラグインでは、「What’s New Generator」と「Newpost Catch」が特におすすめです。

What’s New Generator

What’s New Generatorはショートコードを利用してWebサイトの好きなところに新着記事を表示できるプラグインです。

WordPressのプラグイン独自メニューから表示に関する設定を行います。メニューは日本語に対応しており、設定箇所も少ないのでスムーズにできます。

What’s New Generatorのインストール

WordPressの管理画面の左メニューから「プラグイン」>「新規追加」を選択します。遷移したプラグイン新規追加画面で検索窓に「What’s New Generator」と入力します。検索にヒットしたら「インストール」ボタンをクリックします。

次に「有効化」ボタンをクリックします。有効化ボタンをクリックしないとプラグインを利用できないので注意しましょう。

What’s New Generatorの設定

こちらが「What’s New Generator」のプラグイン専用メニューの画面になります。

保存する前にプレビューを見て表示確認できるので間違えなく設定できます。

項目説明
タイトル見出しのタイトルを入力できます。
タイトルのタグh◯タグを自由に設定できます。
見た目をCSS調整する時に便利です。
表示するコンテンツ表示するページのタイプを選択します。
投稿のみ、固定ページのみ、両方の3つから選択できます。
カテゴリーのスラッグカテゴリーのスラッグを入れます。
該当のカテゴリーの記事だけが新着記事として表示されます。
表示順序公開日時か更新日時か選択できます。
表示件数表示件数を設定できます。
デフォルトでは10件、最大30件まで表示できます。
NEW!マーク表示期間NEW!アイコンの表示期間を設定できます。デフォルトでは7日間で最大30日間で設定できます。
最新記事にNEW!マークをつける最新記事にNEW!アイコンをつけるかどうかを設定できます。

ページ下部にプレビューが表示されています。

固定ページや投稿でショートコードを選択して、「[showwhatsnew]」を貼り付けたら完成です。

公開されると新着記事の一覧が表示されます。

Newpost Catch

Newpost CatchはWordPressのウィジェットから表示させたい箇所に、新着記事を表示させることができるプラグインです。

ウィジェットでWebサイトの変更ができるようなWordPressテーマを利用していると、色々なところに新着記事の表示が可能です。

Newpost Catchのインストール方法

WordPressの管理画面の左メニューから「プラグイン」>「新規追加」を選択します。遷移したプラグイン新規追加画面で検索窓に「Newpost Catch」と入力します。検索にヒットしたら「インストール」ボタンをクリックします。

次に「有効化」ボタンをクリックします。有効化ボタンをクリックしないとプラグインを利用できないので注意しましょう。

Newpost Catchの設定方法

WordPressの管理画面の左メニューから「外観」>「ウィジェット」を選択します。

ウィジェットはWebサイトのWordPressテーマによりますが、Webサイト上の共通部分のフッター、サイドバーから個々の投稿・固定ページなどの要素を変更できる画面です。

上記画面では、右側にフッターの要素が表示されており、要素を自由に変更できます。

左側の「利用できるウィジェット」から要素を右側のフッターの枠内にドラックアンドドロップで入れるだけで要素の追加ができます。

実際に「利用できるウィジェット」の「Newpost Catch」をドラックアンドドロップしてみてください。

ウィジェットでNewpost Catchを追加した後に、新着記事の表示について詳細に設定することができます。

項目説明
タイトル見出しのタイトルを入力できます。
サムネイルの設定幅と高さ、投稿件数の設定を変更できます。
投稿日チェックを入れると投稿日を表示できます。
先頭に固定表示している投稿固定表示している投稿を表示できます。
プラグインフォルダ内のデフォルトCSSチェックを入れるとNewpost Catchでデフォルトで設定されているCSSを適応できます。
投稿タイプ投稿か固定ページのどちらを表示させるか選択できます。
特定のカテゴリーを指定して表示記事IDを入力することで、表示させないように設定できます。

これは必須という設定はないので、お好みで設定をアレンジしてみてください。

設定を保存すると、上記のように表示されました。

フッターよりもサイドバーの方が目に付くので、サイドバーに新着記事を表示させています。

また最近ショートコードが使えるようになったので、投稿や固定ページでもショートコードを使って新着記事を表示できるようになりました。

当サイトで申込みが多いプログラミングスクール・教室はこちら!

【1位】ポテパンキャンプ:Webエンジニア輩出率No1

【2位】CodeCamp:満足度96.6%のプログラミングレッスン

【3位】DMM WEBCAMP:プログラマー転職成功率98%

【4位】TechAcademy:プログラミングスクール受講者数No1

【5位】GEEK JOB:満足度・転職率が高い・20代社会人経験者向け

-プラグイン