WordPressで特定のカテゴリの最新投稿を表示する方法

WordPressサイトで特定のカテゴリの最新投稿を表示したいですか?カテゴリ別に投稿をフィルタリングすると、より関連性の高い最新投稿を読者に表示できます。

訪問者が最も関心のあるコンテンツを見つけやすくすると、サイトに滞在する可能性が高まることがわかりました。これにより、直帰率を減らし、ページビューを増やすことができます。

この記事では、WordPressで特定のカテゴリの最新投稿を表示するさまざまな方法を紹介します。

WordPressで特定のカテゴリの最新投稿を表示する方法

WordPressでカテゴリ別に投稿をフィルタリングする理由

最新投稿を表示することで、ユーザーはウェブサイトを閲覧しながら新しいコンテンツを発見できます。これは、ブログのトラフィックとページビューを増やすのに大いに役立ちます。

また、コンテンツを発見しやすくし、ブログ記事間の内部リンクを改善することで、サイトの検索エンジン最適化にも役立ちます。

最近の投稿リストをさらに便利にするには、ユーザーが現在表示しているコンテンツに関連する投稿のみを表示したい場合があります。

カテゴリから最新の記事を表示してページビューを増やす

この簡単なステップで、訪問者はあなたのサイトでより多くの時間を費やすようになり、それはより多くのメール購読者や顧客につながる可能性があります。

特定のカテゴリのすべての投稿を別のページに表示したい場合、WordPressはすでにこれを自動的に処理してくれます。

カテゴリページを見つけるには、単に投稿 » カテゴリ » 表示ページに移動し、カテゴリの下にある「表示」リンクをクリックするだけです。

カテゴリ別に投稿を表示する

それでは、ウェブサイトのさまざまな領域でカテゴリ別に最近の投稿を簡単に表示する方法を見てみましょう。次の方法をカバーしますので、興味のあるものにジャンプできます。

方法1:ブロックエディターを使用してカテゴリごとの最新投稿を追加する

デフォルトでは、WordPress には ブロックエディター に最新投稿ブロックが付属しています。これにより、ページや投稿内に最新投稿を簡単に表示でき、カテゴリ別にフィルタリングすることもできます。

まず、カテゴリ別の最新投稿を表示したい投稿またはページを編集する必要があります。投稿編集画面で、新しいブロックを追加するボタン(+)をクリックし、「最新の投稿」ブロックを探します。

最新投稿ブロック

コンテンツエリアにブロックが表示され、最新の投稿のプレビューが表示されます。ブロックをクリックして選択すると、右側の列にブロック設定が表示されます。

設定の一番上には、アイキャッチ画像、投稿者、日付、コンテンツを表示するなどのさまざまなオプションが表示されます。

カテゴリで並べ替え

次に、ブロック設定の下にある「並べ替えとフィルタリング」セクションまでスクロールダウンする必要があります。ここで、投稿を表示したいカテゴリの名前を入力します。

カテゴリ名をカンマで区切ることで、複数のカテゴリを選択することもできます。

最新投稿のプレビューが、選択したカテゴリの投稿のみを含むように変更されることに気づくでしょう。

投稿やページを保存し、ブラウザウィンドウでプレビューできるようになりました。これは、特定のカテゴリからの最新投稿を、アイキャッチ画像と投稿抜粋とともに表示した、テストサイトでの表示例です。

カテゴリ別の最新投稿の表示

方法2:WordPressサイドバーにカテゴリ別の最近の投稿を追加する

この方法は、WordPressのサイドバーに特定のカテゴリの最新投稿を表示したいユーザーにおすすめです。

単純に外観 » ウィジェットページに移動し、サイドバーに「最新投稿」ブロックを追加します。

サイドバーウィジェットに最新投稿ブロックを追加する

デフォルトでは、ブロックには最新の投稿が表示されます。ブロック設定を編集し、「並べ替えとフィルタリング」セクションまでスクロールします。

ここから、投稿を表示したいカテゴリを選択できます。

カテゴリを選択

オプションで、アイキャッチ画像、抜粋、著者などを表示することを選択できます。

変更を公開するには、「更新」ボタンをクリックすることを忘れないでください。

これで、カテゴリ別にフィルタリングされた最新の投稿をウェブサイトで確認できるようになりました。

サイドバーのカテゴリ別最新投稿

方法3:コードを使用してカテゴリ別に最近の投稿を追加する

この方法では、WordPressウェブサイトにコードを手動で追加する必要があります。以前にこれを行ったことがない場合は、WordPressにコードスニペットをコピーして貼り付ける方法に関するガイドを参照してください。

まず、WordPressテーマのfunctions.phpファイルまたはコードスニペットプラグインに、以下のコードをコピー&ペーストする必要があります。

function wpb_postsbycategory() {
// the query
$the_query = new WP_Query( array( 
    'category_name' => 'travel', 
    'posts_per_page' => 5 
) ); 
   
// The Loop
if ( $the_query->have_posts() ) {
    $string .= '<ul class="postsbycategory widget_recent_entries">';
    while ( $the_query->have_posts() ) {
        $the_query->the_post();
            if ( has_post_thumbnail() ) {
            $string .= '<li>';
            $string .= '<a href="' . get_the_permalink() .'" rel="bookmark">' . get_the_post_thumbnail($post_id, array( 50, 50) ) . get_the_title() .'</a></li>';
            } else { 
            // if no featured image is found
            $string .= '<li><a href="' . get_the_permalink() .'" rel="bookmark">' . get_the_title() .'</a></li>';
            }
            }
    } else {
    // no posts found
 $string .= '<li>No Posts Found</li>';
}
$string .= '</ul>';
   
return $string;
   
/* Restore original Post Data */
wp_reset_postdata();
}
// Add a shortcode
add_shortcode('categoryposts', 'wpb_postsbycategory');

「travel」を独自のカテゴリ スラッグ(URLで使用されるカテゴリ名)に置き換えることを忘れないで、変更を保存してください。

ヒント: カンマで区切って複数のカテゴリを追加することもできます。

このコードは、WordPressのコードスニペットプラグインである最高のWPCodeを使用して追加することをお勧めします。これにより、functions.phpファイルを編集することなく、安全にWordPressにコードを追加できます。したがって、サイトが壊れる心配はありません。

開始するには、無料のWPCodeプラグインをインストールして有効化する必要があります。ヘルプが必要な場合は、WordPressプラグインのインストール方法に関するチュートリアルをご覧ください。

有効化したら、WordPressダッシュボードからCode Snippets » + Add Snippetに移動します。

これでスニペット追加ページに移動します。ここから、「カスタムコードを追加(新規スニペット)」オプションを見つけて、その下にある「+カスタムスニペットを追加」ボタンをクリックします。

WPCodeでカスタムスニペットを追加する

次に、画面に表示されるオプションのリストから、コードタイプとして「PHPスニペット」を選択する必要があります。

WPCodeでPHPスニペットを選択

次に、コードが何であるかを覚えておくのに役立つ任意のタイトルをページの上部に追加します。

その後、上記のコードを「コードプレビュー」ボックスに貼り付けます。

スニペットにタイトルを追加し、特定のカテゴリから最新の投稿を表示するためのコードを貼り付けます

それが完了したら、スイッチを「非アクティブ」から「アクティブ」に切り替え、「スニペットを保存」ボタンを押します。

WPCodeでスニペットをアクティブ化して保存する

このコードは、WordPressに「news」カテゴリから最新の投稿を5件表示するように指示するだけです。その後、サムネイルサイズのアイキャッチ画像付きの箇条書きリストとして投稿を表示します。

最後に、ページ、投稿、またはサイドバーウィジェットに追加するショートコード[categoryposts]を作成します。次に、このショートコードの使用方法を説明します。

ショートコードを使用して投稿や固定ページにカテゴリ別の最新投稿を追加する

カテゴリ別の最新投稿を表示したい投稿またはページを編集するだけです。投稿編集画面で、新しいブロックを追加するボタン(+)をクリックし、コンテンツエリアにショートコードブロックを追加します。

カテゴリからの投稿を表示するショートコードの追加

次に、ブロック設定にショートコード[categoryposts]追加する必要があります。

これで、投稿またはページを保存し、特定のカテゴリからの最新の投稿がどのように機能するかをプレビューできます。これは、テストサイトでの表示方法です。

カテゴリごとの投稿コードメソッド(スタイルなし)

ご覧の通り、スタイリングはあまり整っていません。心配いりません、テーマにカスタムCSSコードを追加することで変更できます。

単純に、外観 » カスタマイズページに移動してテーマカスタマイザーを起動し、左側の列にある「追加CSS」タブに切り替えます。

テーマにカスタムCSSコードを追加する

開始点として、次のカスタムCSSコードを追加できます。

ul.postsbycategory {
list-style: none;
}
.postsbycategory li {
padding-bottom:5px;
}
.postsbycategory img {
margin-right:5px
}

カスタムCSSコードを保存するには、「公開」ボタンをクリックすることを忘れないでください。これで、投稿またはページにアクセスして、最近の投稿を、よりきれいにスタイル設定された状態で表示できます。

スタイル付きのカテゴリ別最新投稿

WordPressサイドバーにカテゴリ別の最近の投稿ショートコードを追加する

同じショートコードをWordPressのサイドバーまたはウィジェット対応エリアに追加できます。

単純に外観 » ウィジェットページに移動し、「ショートコード」ブロックをサイドバーに追加してください。

サイドバーにショートコードを追加する

これで、ショートコード[categoryposts]をブロック設定に貼り付けることができます。ウィジェット設定を保存するために、更新ボタンをクリックすることを忘れないでください。

カテゴリ別の最新投稿ウィジェットが機能しているか確認するために、ウェブサイトにアクセスできるようになりました。こちらがテストウェブサイトでの表示例です。

サイドバーのカテゴリ別最新投稿プレビュー

この記事がWordPressで特定のカテゴリから最新の投稿を表示する方法を学ぶのに役立ったことを願っています。また、WordPressでユーザーごとにパーソナライズされたコンテンツを表示する方法に関するガイドや、サイトをさらにカスタマイズするためのおすすめのWordPressブロックプラグインのリストも参照してください。

この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterFacebookでもフォローできます。

開示:当社のコンテンツは読者によってサポートされています。これは、当社のリンクの一部をクリックすると、当社が手数料を得る可能性があることを意味します。WPBeginnerがどのように資金提供されているか、それがなぜ重要か、そしてどのように私たちをサポートできるかについては、こちらをご覧ください。当社の編集プロセスはこちらです。

究極のWordPressツールキット

無料のツールキットにアクセスしましょう - すべてのプロフェッショナルが持つべきWordPress関連の製品とリソースのコレクションです!

読者とのインタラクション

32 CommentsLeave a Reply

    • 投稿が公開された日付を意味する場合、最近の投稿ブロックにはそれを表示するオプションがあります!

      管理者

  1. 非常に役立つ投稿をありがとうございます!あなたのコンテンツはいつも本当に役立ちます。新しいページに「最新の投稿」ブロックを追加し、そのページに表示したいカテゴリを入力しました。うまくいきました!質問ですが、100件以上の投稿を表示するにはどうすればよいですか?何か方法がありますか?数は上限があるようです…重ねてありがとうございます!どんな助けでも大変感謝いたします。プラグインが必要でしょうか?

    • 1ページに多くの投稿があるとサイトが遅くなる可能性があるため、通常は上限があります。現時点では、一度に多くの投稿をリストするための推奨プラグインはありません。

      管理者

  2. もう一つ素晴らしい投稿です、本当にありがとうございます – 昨日何時間もこれに悩んでいましたが、こんなに簡単だったなんて!あなたのブログは私のブックマークに入っています。

  3. この記事とすべてのオプションを示してくれてありがとう。ブロックを使用して、それぞれ異なるカテゴリを持つ2つの異なる記事ランディングページをウェブサイト用に作成しました。これまでのところ簡単です。残念ながら、これは、すべての便利なコントロールを備えたデフォルトのブログアーカイブが私のニーズに合わないことを意味しました。今必要なのは、これらのページにページネーションを追加する機能ですが、できません。何かヒントはありますか?

    • 現時点では、探しているページネーションを作成するにはカテゴリページを作成する必要があります。メニューにカテゴリを追加することでそれを行うことができます。

      管理者

  4. カテゴリが複数あり、例えばカテゴリX、Y、Zがあり、それらをスニペットコードに追加した場合、このコードはそれらのカテゴリの投稿のみを表示しますか?つまり、カテゴリXの投稿を見ている場合、カテゴリYやZではなく、カテゴリXの他の投稿のみが表示されますか?同様に、Yにいる場合はYの投稿のみが表示されますか?

    • そのようなものを表示するには、条件付きウィジェットを使用する必要があります。

      管理者

  5. フォントスタイルがデフォルトと全く異なります。テーマに合わせて変更するにはどうすればよいですか、またはCSSは何ですか。

    • 競合するスタイルがないことを確認するために、テーマのサポートに問い合わせる必要があります。

      管理者

    • こんにちは、レッジさん、

      これらの行は、おそらくテーマによってCSSで追加されています。Inspectツールを使用して、それらを担当するCSSを見つけ、カスタムCSSを追加してオーバーライドできます。

      管理者

  6. Recent Posts Extended ウィジェットを使い始めたばかりなのですが、なぜか意図したものを意図した場所に表示させることができません。私は自動車教習所を経営しており、WP & Divi Builder を使用してウェブサイトを構築しました。Recent Posts Extended を 7 つ使用しています。1 つは、サービスを提供するすべての地域のお客様のレビューをウェブサイトのホームページに表示するため、3 つは試験合格に関するもの、そして 3 つはカバーしている 3 つの地域の顧客レビューで、それぞれ独自のページがあります。しかし、各 Recent Posts Extended で「カテゴリに制限」を選択しようとすると、チェックボックス付きで 7 つのカテゴリが表示されるはずなのに、選択できるカテゴリは 5 つしかありません。私は開発者ではないので、CSS コードを理解することは中国語を読むようなものです。ウェブを検索しましたが、私のニーズに合った答えは見つかりませんでした。

  7. こんにちは、このスニペットをありがとうございます。特定のカテゴリの投稿を表示し、そのカテゴリだけでは十分でない場合に通常の投稿を表示する方法はありますか?

    例えば、私は「特集」カテゴリにチェックを入れた投稿が1つありますが、ホームページには3つの投稿を表示する必要があり、残りは2つの空きスペースになります。

    Thanks! :)

  8. 特定のカテゴリの投稿を新しいページに表示したい場合、どこにスニペットをコピーすればよいですか?

  9. このプラグインを有効にしたところ、最初のサイドバーでは正常に機能しました。2番目のカスタムサイドバーには、最初のサイドバーと同じカテゴリが表示されました。結局2番目のものを削除しましたが、今はまったく表示されません。このウィジェットが最新のアップデートによりWordPressでサポートされなくなったことについて、他にフィードバックはありますか?何かアドバイスがあれば幸いです。

  10. これ、ありがとうございます。「Sydney」WPテーマで使用しており、ホームページに特定のカテゴリのプロジェクトをポートフォリオ/ケーススタディとして表示しようとしています。ウィジェットは希望する投稿とともに正常に表示されましたが、縦に表示されています。モバイル以外では、グリッド状に横並びに表示したいです。何かアイデアはありますか?ありがとうございます!

  11. ありがとうございます!!! 命を救っていただきました。お客様のウェブサイトで作業しており、スライダーにニュースのみを表示する必要がありました。カスタマイズ方法を教えていただきました。

  12. こんにちは、チュートリアルをありがとうございます。質問が一つだけあります。ホームページに最新記事のカルーセルをプレビュー画像付きで表示しようとしています。試したプラグインはどれも画像のレイアウトが悪く、サイズが異なる画像がたくさんあります。そこで、プラグインを使わずに、WordPressに直接コードを書いて実装したいと思いました。
    私のコードにプレビュー画像を追加して、プレビュー画像付きの最新記事を表示する方法を教えていただけますか? どうもありがとうございます。

  13. そして…現在の投稿カテゴリの最新投稿を表示したい場合はどうなりますか?

    可能ですか?どうやって?

    よろしく

  14. Hello,

    このプラグイン(最終更新1年前)を最新のWordPressで試しましたか?
    WordPressのサポートを確認したところ、このプラグインはもうサポートされていないようで、一部のユーザーは最近のWordPressで正しく使用できていないようです。

    敬具

  15. コードを functions.php に含めたい場合は、次のように使用できます。

    function include_posts_from_recentPostWidget_by_cat() { $include = array( ‘cat’ => ‘2, 5’ ); return $include; } add_filter(‘widget_posts_args’,’include_posts_from_recentPostWidget_by_cat’);

    2と5は表示したいカテゴリのIDです。同様に「-2、-5」を使用してカテゴリを除外することもできます。

  16. 最新の投稿を表示している投稿が最新の投稿の一部であり、the_content()を表示している場合はどうなりますか?無限ループになりませんか?

返信を残す

コメントを残していただきありがとうございます。すべてのコメントは、当社のコメントポリシーに従ってモデレーションされますので、ご了承ください。メールアドレスは公開されません。名前フィールドにキーワードを使用しないでください。個人的で有意義な会話をしましょう。