WPBeginnerのように、多くの人気ブログは最新の投稿のリストを表示します。それは、最近の投稿を表示することが、訪問者の興味を引きつけ、また訪れてもらうための素晴らしい方法だからです。
最新で最高のコンテンツを目にすれば、クリックしたり、読んだり、サイト探索に時間を費やす可能性が高まります。サイトが新鮮でエキサイティングなものに保たれるのです。
サイドバーや記事の最後、あるいはフッターなど、WordPressサイトのほとんどどこにでも最新投稿リストを追加することができるのだ。
この投稿では、あなたのサイトのどこにでも簡単に最近の投稿リストを追加する方法をご紹介します。訪問者をあなたの素晴らしいコンテンツに夢中にさせる準備をしましょう。
なぜWordPressに最近の投稿を追加するのか?
WordPressブログやサイトを長く運営している場合、検索エンジンなどから定期的にトラフィックを集めている古い投稿があるかもしれません。
訪問者の多くは、探していた情報をチェックして去っていきます。そのような訪問者の75%以上は、二度とあなたのサイトを見ることはないでしょう。
ユーザーをリピーターにするには、サイト滞在時間を長くする必要があります。
その1つの方法は、ユーザーが見るべき他の最近の投稿を表示することです。これにより、ユーザーはあなたのサイトのコンテンツをより多く発見することができ、あなたのサイトでより多くの時間を費やすようになります。
ユーザーがより多くのページを表示することで、メールマガジンに登録したり、購入したりするように説得する時間が生まれます。
ということで、WordPressで複数の方法を使って簡単に最近の投稿を表示する方法を見てみましょう。以下のクイックリンクをクリックすると、それぞれの方法にジャンプできます:
動画チュートリアル
もし、文章での説明がお望みなら、このまま読み進めてほしい。
方法1:WordPressの最新投稿Gutenbergブロックを使う
WordPressのブロック(Gutenberg)エディターには、最新の投稿を表示するためのビルトインブロックがあります。サイトの投稿やページに簡単に追加できます。
このブロックを使うには、最近の投稿を表示したい投稿を編集するだけです。投稿編集画面で、コンテンツエリアに「最新の投稿」ブロックを追加する必要があります。
このブロックを設定する方法はたくさんあります。初期設定では投稿タイトルが表示されるだけですが、簡単にカスタマイザーすることができます。
例えば、右側のペインで投稿コンテンツのオン・オフを切り替えることができます。これにより、タイトルの次に投稿コンテンツまたは抜粋を追加するかどうかを選択できます。
抜粋の長さもカスタマイズでき、初期設定は55ワードですが、10~100ワードの間で任意の値を選ぶことができます。
必要であれば、投稿日と投稿者を表示することもできる。
投稿メタ情報の「投稿日を表示」と「投稿者名を表示」のオプションを有効化するだけです。
また、投稿をどのように表示するかも選択できます。初期設定の「新しい順」から「古い順」に並べ替えたり、特定のカテゴリーから最新の投稿だけを表示することもできます。
設定パネルから、投稿数を選択することもできます。初期設定では、ブロックには5投稿が表示されますが、1~100投稿の間で表示させることができます。
また、最近の投稿をリストではなく、カラムグリッドで表示する設定もあります。
ツールバーの「グリッド表示」オプションを選択するだけです。
画面右の設定を使って、グリッドをカスタマイズできます。
例えば、投稿にアイキャッチ画像を表示したり、画像のサイズを変更したり、配置を変えたりすることができます。
投稿が完了したら、プレビューしてサイトで表示することができます。
完成したブロックのテストサイトでのライブの様子です。
方法2:WordPressの最近の投稿ウィジェットブロックを使う
最新投稿のリストをページではなくサイドバーに表示したい場合はどうすればいいでしょうか?WordPressには、サイトのサイドバーやウィジェット対応エリアに最新投稿を表示するための初期設定ウィジェットがビルトインされています。
WordPressダッシュボードで、外観 ” ウィジェットに行き、「最新の投稿」ウィジェットブロックをサイドバーに追加する。
その後、サイドバーで最近の投稿の外観をカスタマイズすることができます。
例えば、WordPressでは投稿コンテンツの表示、投稿者と投稿日の表示、おすすめ投稿画像の有効化、最新投稿の並べ替えなどが可能です。
完了したら、「更新」ボタンをクリックして、ウィジェット設定を保存します。
このウィジェットはブログ上に設置され、「新規投稿」のタイトルと日付が有効化されている:
方法3:Recent Posts Widget With Thumbnailsプラグインを使用する。
前述したビルトイン・ウィジェットはかなり制限されている。
最近の投稿のサムネイルや抜粋を表示したい場合は?サイドバーに特定のカテゴリーからの投稿だけを表示したい場合は?
そんな時に便利なのが、Recent Posts Widget With Thumbnailsプラグインだ。このプラグインはサムネイルだけでなく、様々な機能を備えており、しかも無料だ。
まず、WordPressRecent Posts Widget With Thumbnailsプラグインをインストールして有効化する必要がある。
次に、外観 ” ウィジェットページに行き、’Recent Posts With Thumbnails’ ウィジェットブロックを追加する。
Recent Posts With Thumbnailsウィジェットには多くのオプション設定があります。WordPressサイトに最近の投稿を表示する方法を完全にコントロールできます。
抜粋表示、特定のカテゴリーからの投稿表示、先頭固定表示の無視、表示する投稿数の選択、投稿者の表示なども可能です。
設定が完了したら、忘れずに「更新」ボタンをクリックして設定を保存してください。
あなたのサイトにアクセスすると、最近の投稿をサムネイル付きで見ることができます。
方法4:ショートコードを使って最近の投稿を表示する
WordPress の投稿やページに最近の投稿を表示するには、「最新の投稿」ブロックを使うのが最も簡単な方法です。しかし、Gutenbergを無効化し、クラシックエディターを維持することを選択した場合は、代わりにショートコードを使用することができます。
まず、関連プラグインをインストールして有効化します。ヘルプが必要な場合は、WordPressプラグインのインストール方法をご覧ください。
WordPressで最も人気のある投稿プラグインの一つです。タイトルや投稿数の編集、おすすめ画像や抜粋、投稿日時の表示など、最新投稿の外観をカスタマイズするための複数のオプションが用意されています。
次の投稿は、最近の投稿を表示したい投稿またはページを編集し、ショートコード[bws_latest_posts]
を使用するだけです。
最近の投稿リストがどのように表示されるかは以下の通りである:
方法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で関連投稿を表示する方法(ステップバイステップ)
- 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.
Louise
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.
WPBeginner Support
Try updating your permalink structure. Simply visit Settings » Permalinks and then click on the save changes button without changing anything.
管理者
Ellen Allard (Gluten Free Diva)
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
Tim Zeman
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?
John Mason
Are links to the recent posts widget dofollow links?
Val Archer
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
Rajkumar
hello,
To display a thumbnail image u can ues
Andrew Wilkerson
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.
Farhad
Hello, I used the same shortcut in my site but it not show my recent posts at all, what is the probelm?
WPBeginner Support
This article shows several ways to display recent posts, which one you tried on your website?
管理者
Marcio
Hey, how to display recent posts from another wordpress site?
WPBeginner Support
You can fetch them using RSS feed. Please see, how to fetch feeds in WordPress.
管理者
Joe
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!
Sally
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!
alin dragoescu
Hello,
Please let me know if it’s posible to show the post list in dropdown?
Nick NEvsky
Hi! Great plugin, thank you!
Is it possible to have the author listed, instead of the post name?
Thanks!
Jason
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?
andrea
Hi, my issue is to display the latest post full content in a static home page… and i was thinking that the last snippet was what i needed… but unfortunately it does not works properly. In effects it shows title but not the content. could u help me please
Tushar
Hi I am new on wordpress, I want to show Client Testimonial using post….How should I do it..? any suggestions please ?
WPBeginner Staff
Here is an easier way. Install Display Posts Shortcode plugin. Create a blank page and add the shortcode as described in plugins documentation. Publish the page. Go to Settings > Reading and select the page you just created as your static page. Redit the static page and add the slider just before the display posts shortcode. Hope this helps you.
philip
please how do decrease the number of words showed before the read more link i.e decrease the excerpt
WPBeginner Support
Please see our guide on How to customize WordPress excerpts (no coding required).
管理者
Emily
Hi, I am wanting to add a slider to the top of my homepage, but it will only allow me to do so if I use a static page. Right now when you go directly to my website, it is my latest posts in full length. If I change my homepage to a static page so that I can include the slider, will this work to add the recent posts below, just as it appears now? Where would I be posting this code? Into the static homepage?
Note– I recently tried messing with my php and broke my code and had some major issues.. so I’m pretty nervous messing with php.
Subrata
hi!…can anyone tell me how to display top rated blog posts (only 5) in increasing order (numeric order) by using PHP codes?
Oliver
Hi there. I am a designer so I’ve never been good at PHP. At least I can read and change it for my conditions most of the time. This time I’d like to call for the nine latest posts excluding the very last one inside my slideshow container.
For now I just set the first post on display none. This works fine; however the slideshow still counts to ten. That’s why you find the last page empty.
Is there any way to exclude the very last post when calling for recent posts? Thank you so much in advance!
KalanaDe
Hi, I want to display blog posts only from a category called ‘Blog’ only. (I want to exclude all other posts from other categories.) What should I add to this code.?
Oliver
Hi KalanaDe! I guess you already found a solution. In case you did not – here’s a widget that does the job:
https://wordpress.org/plugins/recent-posts-by-category-widget/
Bucur
showposts is deprecated. However, posts_per_page is perfect for use with query_posts(), or even more particularly, WP_Query::query().
numberposts may be the equivalent argument for get_posts().
Dan
This worked perfect! Thanks a lot to the author of this article.
Gabriel
The link to Limit-Post Plugin doesnt work!?
WPBeginner Support
Thanks for notifying us. We have updated the article with a new code snippet that does not require you to install any plugins. Hope this helps.
管理者
Art
Good article.
One piece of info that would increase it’s usefulness though, is how to (or a plugin that can) include an offset.
For example, I want my two most recent posts to be full text — got that.
But what if I want the next 10 to be excerpts, and maybe the next 10 older to be headlines only — the list?
So — how can you include an offset?
Cheers,
Art
Ryan
Hi there,
I want my latest 4 posts to display inline across the screen, how would I do this?
Currently they only display down the page.
Thanks
Ryan
Mike
Sounds like you need to create a container with the height/width you want the posts to appear as. Then allow them to wrap over.. make sure that the last piece of your “Post” code doesn’t have a line break.
Wilko
Great post! Thanks!
Just one question. Is it possible to hide the latest post out of 5? I mean on my website I display the latest post already with full content, so I would like to hide the first.
WPBeginner Support
Change your WP_Query like this:
1-click Use in WordPress
管理者
Captain Code
Exactly what I was looking for!
Thank You =)
Actors Alliance
Where do I input the code to change the number of full posts displayed?
Amanda
Lovely! Is there a way to make the headers of each post H2 ? And, can I hide a category?
Editorial Staff
Yes use the second method and wrap it around h2. Use wp_query codex page to look at the parameter for hiding categories.
管理者
Jeremy
Finally a quick and to the point tutorial on this topic. Other posts on calling in the recent blog posts were not as quick and too the point. Thanks
Ellery Davies
Hi Syed,
I use the Wordpress Twenty-Eleven theme and have always displayed recent posts using the widget in Jetpack. But I want this list to show in the individual posts as well. Is there a way to do this? If it involves pasting code, into which file do I paste?
Editorial Staff
Where in the individual posts do you want to show that list? Below post? Sidebar?
管理者
Ellery Davies
The home page of AWildDuck -d0t- com, shows recent posts along the right side, along with subscribe and a tag cloud. But this appears only on the home page. If I send you a link to any individual post (or if you click on the title of any post), the right frame disappears. My visitors can no longer see a list of recent posts. I am very frustrated by this, and I want to know how to get that list of recent posts to appear on all pages. (Not just the home page).
Editorial Staff
Go to Appearance > Theme Options. Change the default Layout to content on left.
Ellery Davies
Hi Syed,
Indeed, this is my current setting. It has always been my setting. Twenty Eleven with “Content on left”.
Editorial Staff
Hmm that’s weird because that’s what I have and it is working fine.
Ellery Davies
I don’t understand… Do you see Recent Posts on the right, even when you are looking at an individual post? If you do, are you using JetPack/Recent Posts?
If the answer to both questions is “Yes”, would you please send me your phone number. You already have my email address. -Or call me: Area code “Five-Oh-EIght”, 485 ..695O.
Thanks, –Ellery
darknote
Thank you and with the_post_thumbnail ?
Editorial Staff
Simply add the_post_thumbnail(); and style it however you like.
管理者
darknote
thank you, yes, but I ask not only for me but thinking of other visitors, it can be more useful in your article, give an example of recent articles with thumbnails.
Kylie
Thanks so much for this tutorial! I used the code to display recent posts with a summary on my website’s homepage.
When adding the_post_thumbnail(); code could you please tell me what file and where in the file to add it? I tried looking it up and experimented by adding it to several files on my own and was not able to get the thumbnails to show up.
Any insight would be greatly appreciated.
Thank you,
Kylie
WPBeginner Support
In your Post Edit area, post thumbnails are called featured image. If you can not see a featured image meta box, then click on Screen Options button on the top right corner of your post edit screen and check Featured image.
vajrasar
Nice Post.
How can I achieve – Recent Posts in Menu. Like I have my category “Crime” on top-menu. Now whenever a user hover it, I want to show 5 recent posts from category “Crime” with their thumbnails?
muhabas
Spent a lot of time to find out this information which works for me 100%. Its very easy and to the point. Thanks…… God bless you.
wanted20
Hello. I have a website with 3 subdomains. It’s possible to display in a widget in the main domain the lastest posts from a subdomain?
cwdcreative
The link to the “limit-post” plugin does not work. Do you have a current link or an alternate?
Thank you!
broghanreilly
I have tried to use this code and it doesn’t seem to work? I am a beginner and am using a standard theme and not hosting. Therefore I can’t upload anything I can only use HTML.
doodark
Thanks so much for posting such a useful and concise article. Much appreciated!
YiLiu
very usefull for me.thanks
Tiago Araujo
Thank you very much for the post, I was looking for it for a while and found your explanation pretty simple and useful. Code worked just fine for me!
Panoz
My WP homepage has a footer displaying the titles of my 4 latest posts (Recent Posts). This makes no sense, as these posts are already displayed above.
My question is how can my footer display the range between 5th and 8th post ??
The code its currently using is
<?php wp_get_archives('type=postbypost&limit=5');
Many thanx in advance for your help
Editorial Staff
You can’t use wp_get_archives for that. You would have to run a loop and add the query_post function with the offset parameter.
管理者
Panoz
Thank you very much for your kind reply. Can you please let me know how I can do that? I know very few stuff and i definately need to have this done by the day after tomorrow that I’m launching my site.
Thanks
Phelan
I’ve been looking for this code for a few days now. I can’t believe it’s not more readily available in the Template Tags pages or any other blogs.
I changed the code to include tags and tags instead of the tags like the following:
<a href="”>
Thanks for posting!
Katie
One problem with the above code is when you call that function in your sidebar which is called before the start of the loop in single.php. Your single.php file will list down all the articles of your blog post irrespective of the one which is called.
In such cases, you can also use
Otherwise, calling query_posts(‘showposts=10’); function is fine.
Both of them will list down latest 10 posts in ul, li format. This is bit easier.
Mike
Hi, is it possible to show the date before the linked post title when using:
<?php get_archives('postbypost', '10', 'custom', '’, ”); ?>
Thanks
Editorial Staff
To do that, the better option would be to run a new loop.
管理者
ali
Hi Guys
I seem to be having some issues with this code. It works great on my index.php page but when I try adding it to either the page.php or single.php it prevents other content showing. For example when I click the ‘about us’ page it will display the latest article!
Hope this makes sense and any help anyone can offer would be greatly appreciated.
Thanks
Editorial Staff
Try reading this article: https://www.wpbeginner.com/wp-tutorials/how-to-create-a-separate-page-for-blog-posts-in-wordpress/
管理者
ravi
i want to display posts in order of post date.. recent one first with pagination i am able to do the pagination but the posts are displaying on each page in random order somebody please help………….:(
Editorial Staff
Don’t see why it wouldn’t display posts in the order of date. The loop method would only display the most recent ones at the top.
管理者
Abhijit V. Chaore
There were few articles around explaining the same thing. But you elaborated the topic with additional information which is very useful. Thanks for your efforts.
seminyak bali
How about on spesific page – example i make new page called blog, i have try the code but get error,
Mark
I want to know how to display rcenet posts with thimthumb thumbnial.
Unfortunately Google is being Google as usual and not giving me the results I want.
Thanks.
Editorial Staff
You can simply add timthumb codes anywhere in these codes, and it should work. The query will be run the exact same way. If you are looking for a step by step guide, we haven’t written one. Although we might write one in the future.
管理者
DaveK
I am so glad I found this, I have been trying to do this for days and I couldnt find exactly how to do this on the wordpress codex !!! the only sollution they seemed to offer screwed up the custom homepage I built, but this works perfect.
Thanks very much.
Editorial Staff
Glad we were able to help
管理者
Justin
Good info!
I’m trying to display the latest 5 posts using the last method you described, but I can’t figure out how to get page numbers. For example, the faux blog page displays the last five posts, but there is no way to go back in time from there.
I have not been able to find a solution for this. Any suggestions?
Thanks!
Editorial Staff
Use the Super WordPress loop tutorial instead. You would just need to add the pagination code in there.
管理者