Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPBカップ
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

カテゴリー: WordPressで最近の投稿を表示する方法

編集メモ: WPBeginner のパートナーリンクから手数料を得ています。手数料は編集者の意見や評価に影響を与えません。編集プロセスについて詳しく知る。

WordPressで最近の投稿を表示したいですか?最近の投稿を表示することで、ユーザーが簡単に新しいコンテンツを発見し、サイトに滞在する時間を増やすことができます。

サイドバー、投稿コンテンツの最後、ショートコードによる投稿コンテンツ内、フッターウィジェットエリアなど、お好きな場所に最新投稿リストを追加できます。

この投稿では、WordPressで様々な方法を用いて最近の投稿を表示する方法を紹介する。

How to display recent posts in WordPress

なぜWordPressに最近の投稿を追加するのか?

WordPressブログやサイトを長く運営している場合、検索エンジンなどから定期的にトラフィックを集めている古い投稿があるかもしれません。

訪問者の多くは、探していた情報をチェックして去っていきます。そのような訪問者の75%以上は、二度とあなたのサイトを見ることはないでしょう。

ユーザーをリピーターにするには、サイト滞在時間を長くする必要があります。

その1つの方法は、ユーザーが見るべき他の最近の投稿を表示することです。これにより、ユーザーはあなたのサイトのコンテンツをより多く発見することができ、あなたのサイトでより多くの時間を費やすようになります。

ユーザーがより多くのページを表示することで、メールマガジンに登録したり、購入したりするように説得する時間が生まれます。

ということで、WordPressで複数の方法を使って簡単に最近の投稿を表示する方法を見てみましょう。以下のクイックリンクをクリックすると、それぞれの方法にジャンプできます:

動画チュートリアル

Subscribe to WPBeginner

もし、文章での説明がお望みなら、このまま読み進めてほしい。

方法1:WordPressの最新投稿Gutenbergブロックを使う

WordPressのブロック(Gutenberg)エディターには、最新の投稿を表示するためのビルトインブロックがあります。サイトの投稿やページに簡単に追加できます。

このブロックを使うには、最近の投稿を表示したい投稿を編集するだけです。投稿編集画面で、コンテンツエリアに「最新の投稿」ブロックを追加する必要があります。

Add latest posts block

このブロックを設定する方法はたくさんあります。初期設定では投稿タイトルが表示されるだけですが、簡単にカスタマイザーすることができます。

例えば、右側のペインで投稿コンテンツのオン・オフを切り替えることができます。これにより、タイトルの次に投稿コンテンツまたは抜粋を追加するかどうかを選択できます。

抜粋の長さもカスタマイズでき、初期設定は55ワードですが、10~100ワードの間で任意の値を選ぶことができます。

Show post content in recent posts

必要であれば、投稿日と投稿者を表示することもできる。

投稿メタ情報の「投稿日を表示」と「投稿者名を表示」のオプションを有効化するだけです。

Display post date and author

また、投稿をどのように表示するかも選択できます。初期設定の「新しい順」から「古い順」に並べ替えたり、特定のカテゴリーから最新の投稿だけを表示することもできます。

設定パネルから、投稿数を選択することもできます。初期設定では、ブロックには5投稿が表示されますが、1~100投稿の間で表示させることができます。

Sort and filter recent posts

また、最近の投稿をリストではなく、カラムグリッドで表示する設定もあります。

ツールバーの「グリッド表示」オプションを選択するだけです。

View latest posts in grid view

画面右の設定を使って、グリッドをカスタマイズできます。

例えば、投稿にアイキャッチ画像を表示したり、画像のサイズを変更したり、配置を変えたりすることができます。

Show featured images in latest posts

投稿が完了したら、プレビューしてサイトで表示することができます。

完成したブロックのテストサイトでのライブの様子です。

Latest posts preview

方法2:WordPressの最近の投稿ウィジェットブロックを使う

最新投稿のリストをページではなくサイドバーに表示したい場合はどうすればいいでしょうか?WordPressには、サイトのサイドバーやウィジェット対応エリアに最新投稿を表示するための初期設定ウィジェットがビルトインされています。

WordPressダッシュボードで、外観 ” ウィジェットに行き、「最新の投稿」ウィジェットブロックをサイドバーに追加する。

Add latest post widget block

その後、サイドバーで最近の投稿の外観をカスタマイズすることができます。

例えば、WordPressでは投稿コンテンツの表示、投稿者と投稿日の表示、おすすめ投稿画像の有効化、最新投稿の並べ替えなどが可能です。

Customize recent posts widget block

完了したら、「更新」ボタンをクリックして、ウィジェット設定を保存します。

このウィジェットはブログ上に設置され、「新規投稿」のタイトルと日付が有効化されている:

Latest posts in sidebar menu

方法3:Recent Posts Widget With Thumbnailsプラグインを使用する。

前述したビルトイン・ウィジェットはかなり制限されている。

最近の投稿のサムネイルや抜粋を表示したい場合は?サイドバーに特定のカテゴリーからの投稿だけを表示したい場合は?

そんな時に便利なのが、Recent Posts Widget With Thumbnailsプラグインだ。このプラグインはサムネイルだけでなく、様々な機能を備えており、しかも無料だ。

まず、WordPressRecent Posts Widget With Thumbnailsプラグインをインストールして有効化する必要がある。

次に、外観 ” ウィジェットページに行き、’Recent Posts With Thumbnails’ ウィジェットブロックを追加する。

Add recent posts with thumbnails widget block

Recent Posts With Thumbnailsウィジェットには多くのオプション設定があります。WordPressサイトに最近の投稿を表示する方法を完全にコントロールできます。

抜粋表示、特定のカテゴリーからの投稿表示、先頭固定表示の無視、表示する投稿数の選択、投稿者の表示なども可能です。

Customize recent posts with thumbnails

設定が完了したら、忘れずに「更新」ボタンをクリックして設定を保存してください。

あなたのサイトにアクセスすると、最近の投稿をサムネイル付きで見ることができます。

Recent posts widget with thumbnails preview

方法4:ショートコードを使って最近の投稿を表示する

WordPress の投稿やページに最近の投稿を表示するには、「最新の投稿」ブロックを使うのが最も簡単な方法です。しかし、Gutenbergを無効化し、クラシックエディターを維持することを選択した場合は、代わりにショートコードを使用することができます。

まず、関連プラグインをインストールして有効化します。ヘルプが必要な場合は、WordPressプラグインのインストール方法をご覧ください。

WordPressで最も人気のある投稿プラグインの一つです。タイトルや投稿数の編集、おすすめ画像や抜粋、投稿日時の表示など、最新投稿の外観をカスタマイズするための複数のオプションが用意されています。

Change relevant settings

次の投稿は、最近の投稿を表示したい投稿またはページを編集し、ショートコード[bws_latest_posts]を使用するだけです。

最近の投稿リストがどのように表示されるかは以下の通りである:

Display recent posts shortcode

方法5:WordPressで手動で最近の投稿を表示する

より高度なWordPressユーザーは、最近の投稿をWordPressテーマファイルに直接追加したいと思うかもしれない。もちろん、テーマを更新したときに変更内容が失われないように、子テーマを使用してください。

テーマファイルを編集する前に、バックアップを作成しておくとよいでしょう。何か問題が発生した場合は、WordPressの最も一般的なエラーとその修正方法のリストをご覧ください。

手動で最近の投稿を表示する最も簡単な方法は、ビルトインのWP_Queryクラスを使うことです。以下のコードを最近の投稿を表示したい場所に追加するだけです:

<ul>
 
<?php
// Define our WP Query Parameters
$the_query = new WP_Query( 'posts_per_page=5' ); ?>
 
<?php
// Start our WP Query
while ($the_query -> have_posts()) : $the_query -> the_post();
// Display the Post Title with Hyperlink
?>
 
<li><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
 
<li><?php
// Display the Post Excerpt
the_excerpt(__('(more…)')); ?></li>
 
<?php
// Repeat the process and reset once it hits the limit
endwhile;
wp_reset_postdata();
?>
</ul>

このコードは、最新の5つの投稿をタイトルと抜粋とともに表示します。WP_Queryクラスにはたくさんのパラメータがあり、好きなようにカスタマイズすることができます。詳しくはWordPress開発者向けドキュメントを参照してください。

カテゴリー: 投稿日: WordPressで投稿を推薦するエキスパートガイド

WordPressで最近の投稿を表示する方法はお分かりいただけたと思うが、読者へのコンテンツ宣伝に関連する他の投稿もご覧いただきたい。

WordPressで最近の投稿を表示する方法について、この投稿がお役に立てば幸いです。WordPressでブログ投稿用の区切りページを作成する方法や、ドラッグ&ドロップでWordPressのページビルダーを作成できるプラグインをピックアップしたガイドもご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

情報開示 私たちのコンテンツは読者支援型です。これは、あなたが私たちのリンクの一部をクリックした場合、私たちはコミッションを得ることができることを意味します。 WPBeginnerの資金源 をご覧ください。3$編集プロセスをご覧ください。

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

究極のWordPressツールキット

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

Reader Interactions

141件のコメント返信を残す

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Jiří Vaněk says

    I would like to post these recents at the end of each article. But there are already more than 1000 of them. It doesn’t make sense to do it manually. Is it possible to take the php code, insert it into WPCode and use the embed code at the end of each article? Will it work like this?

    • WPBeginner Support says

      There are some options in the plugin settings to limit the categories but at the moment the plugin does not have a modifier like that for the shortcode.

      管理者

  3. Bernie says

    Thanks for lots of great advice!

    I have been spending days so far, to solve a challange here:

    Im using the Twenty Twenty-Three template.

    Using Gutenberg.

    Created a 2nd column where i would like to place a list of the latest posts by CURRENT author, incl. thumbnail, except etc.

    I can only find this solution in plugins with widgets, and as far as I understand this Gutenberg thing, widgets cant be used here.

    Any idea how to solve this?

    • WPBeginner Support says

      If you are manually adding it to each post, there is a latest posts block that gives the option to limit the posts listed by author and a few other sorting options that you can use as well!

      管理者

  4. Matt says

    How to enable a link to more pages/posts? The widget only says up to 100, but how to paginate etc if there are 1000 or more?

    • WPBeginner Support says

      We do not recommend having more than 100 posts in a widget due to that being difficult for most users to read through for its space. If you are displaying that many posts we would recommend displaying it on a page or something similar.

      管理者

  5. Jack Yasgar says

    When I use the WordPress Latest Posts Gutenberg Block, it displays all the texts of the posts. In the preview when I add it to the page, it looks fine, with the “Read More”, but when you actually preview or publish the page, all the text is displayed and it looks terrible. This is on Version 5.9.1. Any suggestions or is it just a bug?

    • WPBeginner Support says

      You would want to check the settings for your widget as that should be where you can customize how your widget is displayed. If it is not following those settings then you would likely want to reach out to the support for your theme in case it is overriding your settings.

      管理者

    • WPBeginner Support says

      The simplest method would be to add a category to your menu and that would link to a category page that would list your most recent posts in that category.

      管理者

  6. Sean says

    I’m using ‘Display Posts’ and love it. I run a gardening website so if a post is called ‘How to Grow Beetroot’, is there any way by using Display Posts that the only part of the title that is displayed is ‘Beetroot’?

    Thank you

    • WPBeginner Support says

      The plugin by default does not change your post titles. You would want to reach out to the plugin’s support if you wanted that functionality

      管理者

  7. Lucy says

    I can’t seem to get the Read More to appear in the published version. It appears in the editor but when I publish, it is gone. I’m using Astra theme.

    • WPBeginner Support says

      You would want to check for if you need to enable excerpts with your specific theme for it to display how you are wanting.

      管理者

  8. Hamza says

    Hi, When I click on the “Read more..” on a post on Recent Posts, it does not to go to that specific post page rather it loads the home page.

    Appreciate if you can help on this.

    Thanks

    • WPBeginner Support says

      It would depend on what method you are using for possible issues and solutions.

      管理者

  9. Julian says

    This was really helpful thanks. Just a correction to note, in the last code snippet the comments are using // but they’re not actually in the php so they will show up if you use this code as-is.

  10. Michael Robinson says

    Hi, I”m still lost. My posts still don’t show up on my homepage, I have content blocks set up on my homepage and using Guterberg to set up the content. When I publish the post. It does not show up on my Homepage feature posts grid. There is something I am not getting.

    • WPBeginner Support says

      You may want to clear any caching on your site to ensure your caching is not preventing the changes from being seen.

      管理者

    • WPBeginner Support says

      You can use the new latest post block and use the built-in grid option in the block’s options

      管理者

    • WPBeginner Support says

      It would depend on why you want to do that. If you want the entire content of a post to be visible to a user it would normally be best to link to the post you want to show so your users can read from the source.

      管理者

  11. Miracle Lawrence says

    My blog shows bulleted post, how do I stop it from being an unordered list, and make it in grid?

  12. Sarah says

    Hello – I am trying to figure out why the Recent Posts widget (the basic one) is excluding my most recent post. I would like that to show. Is there custom CSS I could add to make it show? or can I edit the code?

  13. Ata says

    Thank you for the useful post.
    I have a question. What if I want to display recent posts on front page categories wise. Like recent posts should appear on the front page under a particular category.
    Is it possible?

  14. Arif says

    Awesome as always. When I found wpbeginner is sharing on this topic I was like . But my question is placing post widget on homepage is beneficial or it’s just easy to navigate? Can it help with seo perspective? Can it help with the ranking? Your response highly appreciated

    • WPBeginner Support says

      Making your site easier to navigate can improve your SEO as well as making it easier for your users to continue navigating through your site.

      管理者

  15. Rajiv Dave says

    Thanks for recent post articles. I was trying so much but now its so easy to work just adding adding it. Thanks for sharing

  16. Trang says

    When I tried to edit the page that’s supposed to display blog posts, the editor disappears wit this notice: “You are currently editing the page that shows your latest posts”. Does anyone have this same problem as me?

    • WPBeginner Support says

      The Blog page is automatically generated by your theme so you will not have the option to edit it directly unless you have a theme specific setting to edit it.

      管理者

  17. Nikos Tzortzis says

    HI…..i just started using WP and i need some help! i want to publish articles from 3 different categories to 3 different pages.how can i make a page point to an article category?

  18. Rob says

    Is there a way to customize the way post titles are displayed? I don’t want to display the full title of the post or page, just the keywords… much like you shorten the slug for your url. Actually this is exactly what I’m looking for, to display the slug as a link, and not the entire page title. Ideas?

  19. Bryan Free says

    Great article, When I use the Recent post widget and set it to only display a category my sticky posts do not work. Have you encountered this before or know of a solution?

  20. eyllan8547 says

    Hi, thanks for this complete article.

    I have a doubt, if I have my wordpress integrated with Magento, can I use magento within the short code to put the last entries in my magento house?

  21. Mankirat Deep Kaur says

    The short code to display recent posts with thumbnails does not work… only shows the posts title not the thumbnails… how to fix this.??? please reply…:(

  22. Kevin says

    Hi,

    I am intending on adding the latest posts on my homepage, but I want a different section for the latest post to display on it’s own;

    and another section under this designed differently for the latest posts that range from 2-5. (The 2nd, 3rd, 4th and 5th post).

    What is the shortcode php for this to add to my theme template.

    Many thanks.

  23. James Gielow says

    Hello,

    I have post shortcode on my page:

    I’ve tweaked it a little bit as follows:

    [display-posts posts_per_page=”100″ include_excerpt=”false” image_size=”large” wrapper=”div” orderby=”comment_count”]

    I’m noticing that the spacing in between the posts is cutting off the titles and it makes the page look sloppy. What code can I add to add a little space after each post preview?

    thanks in advance!
    James

  24. Adam says

    Love the idea, the only thing I don’t like is the display.

    So it’s great how it has the thumbnail, title, excerpt, etc but the way the title and excerpt are positioned…I think they should be inline with the thumbnail, not at the bottom of it…it looks awkward and unappealing…any way to make it inline?

  25. Kenneth says

    Please help me with this
    How to display recently post in a post on phone version?
    Reply please… Thanks

  26. djafa says

    Hi, I put [display-posts posts_per_page=”5″ post_type=”page”] on my post, but not working, can you help how to find the problem?

  27. Louise says

    Hi,
    Thank you for this post. Really helped a lot.
    But then I have a problem. When I click on one of the recent posts – it directed me to the static page and not the post itself. Kindly help me resolved this issue. Thank you.

  28. Ellen Allard (Gluten Free Diva) says

    So glad to have found you!

    I’m confused – I can’t seem to get my most recent blog post to appear on my blog page. Can you advise please? Thank you so much!

    best, Ellen Allard, Gluten Free Diva

  29. Tim Zeman says

    So I was able to get the 5 latest post to show in the right sidebar but when I click on a post to read it I get the following error on Home Page Oops something went wrong

    How do I get the selected post to display?

  30. Val Archer says

    Hi – thanks million for this manual method, very grateful. Please can you tell me how to add a thumbnail image to it? I’m referring to the method starting:

    // Define our WP Query Parameters

    • Andrew Wilkerson says

      Hi Val, Hope your doing well, I was just scrolling through this article and saw your name and thought straight away I know that name! It’s a small world.
      I made one of your sprouters in the late 90’s I think it would have been.
      Funny thing is I was just thinking about building another one a few days ago!

      Crazy how things happen sometimes!
      Weird that I then just stumbled across your comment on here today in 2018 while I’m working on my website for something totally unrelated.

      I remember I really enjoyed reading about your life and the move to Sth Africa, your cures for tooth aces etc. I’ll have to have another look into it all again soon when I have time, anyway just thought I’d say Hi.

  31. Farhad says

    Hello, I used the same shortcut in my site but it not show my recent posts at all, what is the probelm?

  32. Joe says

    Hi,

    On my recent posts on the sidebar, when I click a specific post it brings me to the latest post and then displays everything. How do I get it so that when I click a specific post it only shows that post?

    Thanks!

  33. Sally says

    Is there a code I can add to activate pagination using the Recent Posts Extended widget?

    Currently I have my home page widgetized so I’m using the widget.

    Thanks!

  34. Nick NEvsky says

    Hi! Great plugin, thank you!
    Is it possible to have the author listed, instead of the post name?
    Thanks!

  35. Jason says

    The version I downloaded does not include the ability to display thumbnails…cant see the option anywhere. I am using version 0.9.9

    Any clues?

返信を残す

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