WordPressで最終更新投稿のリストを表示する方法

人気の記事のいくつかを最新のヒントや新しいスクリーンショットで更新するのに丸一 weekend を費やしたことを覚えています。その仕事に誇りを持っていましたが、誰もそれを見ていないことに気づきました。

私の最終更新投稿は、元の公開日で並べ替えられたブログアーカイブの10ページ目にまだ埋もれていました。私の努力がすべて見えないかのようでした。

これは、デフォルトのWordPressセットアップでよくある問題です。シンプルな時系列ブログには適していますが、貴重な更新済みコンテンツを読者から隠してしまいます。これにより、一生懸命最新の状態に保とうと努力していても、サイトが古く感じられる可能性があります。

幸いなことに、簡単な解決策があります。最も最近更新された投稿のリストを作成することで、最高のコンテンツにスポットライトを当て、訪問者にとってより魅力的な体験を作成できます。

このガイドでは、私が自身のウェブサイトでどのようにこれを行っているかを正確に説明します。簡単なプラグイン方法と、より多くの制御を求める人向けのカスタムコードソリューションの両方をカバーします。

WordPressで最終更新投稿のリストを表示する方法

WordPressで最終更新投稿を表示する理由

WordPressで最終更新投稿を表示すると、訪問者や検索エンジンに最新のコンテンツを効果的にアピールできます。これにより、重要で最近更新された記事がブログアーカイブの奥深くに埋もれるのを防ぎます。

ほとんどのWordPressテーマは、公開日を基準に投稿を逆時系列順に表示します。これは標準的なブログでは論理的ですが、昨日更新した記事が、最も最新の情報を含んでいるにもかかわらず、アーカイブの10ページ目に埋もれてしまう可能性があります。

これはユーザーエクスペリエンスを低下させます。訪問者はあなたの最高の作品を見逃し、コンテンツメンテナンスの努力から十分な価値を得られなくなります。

一方で、最も最近更新された記事専用のスペースを作成すると、訪問者にとってサイトのエンゲージメントが高まります。

この設定を支援するために、2つの異なる方法を説明します。以下のクイックリンクを使用して、最適なソリューションに直接ジャンプできます。

方法 1: プラグインを使用して最後に更新された投稿を表示する

最近更新された投稿のリストを表示する最も簡単な方法は、プラグインを使用することです。この方法は、コードを必要とせず、視覚的な制御ができるため、初心者にとって最適です。

無料の Kadence Blocks プラグインの使用をお勧めします。これは、最も人気のあるブロックプラグインの 1 つであり、エディターに強力な新しいブロックのスイートを追加するため、このプラグインを選びました。クラシックまたはモダンなブロックベースの WordPress テーマのいずれとも完全に連携します。

非常にカスタマイズ性の高い「投稿」ブロックの使用方法を紹介します。これは、最近公開された投稿ではなく、最近更新された投稿を表示するように簡単に設定できるためです。

プラグインのインストールと有効化

まず、Kadence Blocks プラグインをインストールして有効化する必要があります。詳細については、WordPress プラグインのインストール方法に関するステップバイステップガイドをご覧ください。

ブロックを使用する利点は、サイトのほぼどこにでも追加できることです。次に、それを単一のページ、サイドバーのようなクラシックテーマのウィジェットエリア、またはブロックテーマのテンプレートパーツに追加する方法を示します。

シングル投稿またはページに投稿ブロックを追加する

リストを単一のページまたは投稿に追加したい場合は、WordPressエディターで開くだけです。開いたら、プラス(+)アイコンをクリックして新しいブロックを追加します。

検索バーに「投稿」と入力し、Kadence Postsブロックを投稿またはページにドラッグします。

WordPressエディターにKadence Postsブロックを追加する

クラシックテーマを使用している場合は、ブロックをウィジェットとして追加して、サイト全体に表示できます。

WordPressダッシュボードから、外観 » ウィジェットに移動します。

編集したいウィジェットエリア(例:「サイドバー」)を見つけ、プラス(+)アイコンをクリックし、Kadenceの「投稿」ブロックをドラッグアンドドロップで追加します。

Kadence投稿ブロックをクラシックテーマのウィジェットエリアに追加する

最新のブロックテーマでは、フルサイトエディターを使用します。

ダッシュボードから外観 » エディターに移動します。エディターの左側のメニューで「パターン」を選択し、編集したいテンプレートパーツ(例:「フッター」や「サイドバー」)を見つけます。

Kadence の「Posts」ブロックをリストを表示したい場所にドラッグアンドドロップするだけです。

Kadence投稿ブロックをブロックテーマのテンプレートパーツに追加する
最終更新日で並べ替えるようにブロックを構成する

ここからが重要な部分です。投稿ブロックを選択すると、右側のサイドバーにその設定が表示されます。ここで、投稿を最終更新日で並べ替えるように指示します。

ブロック設定の「一般」タブの下にある「並べ替え」というラベルの設定を見つけます。ドロップダウンメニューをクリックし、「新しいものから古いものへ」から「更新日降順」に変更します。

Kadence Posts Block を最終更新日で並べ替えるように設定する

ブロックは、最近更新された投稿を即座に表示するように更新されます。

ここで、表示する投稿数や、アイキャッチ画像や投稿抜粋を表示するかどうかなど、他の多くの設定もカスタマイズできます。

Kadence Posts Block 設定

⚠️ 重要: デフォルトでは、Kadence Posts ブロックは投稿をグリッド形式で表示する場合があります。シンプルなリストを好む場合は、ブロック設定の「一般」タブにある「レイアウト」オプションを探し、リストスタイルを選択してください。

完了したら、「更新」または「保存」ボタンをクリックするだけです。これで、サイトで最新の更新済み投稿のリストがライブで表示されていることを確認するために、ウェブサイトにアクセスできます。

方法 2: カスタムコードを使用して最終更新投稿を表示する

コードの追加に慣れており、リストの外観を完全に制御したい場合は、この方法が最適です。正確なHTML出力をカスタマイズできるため、高度なスタイリングに最適です。

コードをサイトに追加する最も安全な方法は、無料のWPCodeプラグインを使用することです。これは、カスタムスニペットのために私が常に使用しているプラグインであり、サイトを破損する可能性のある間違いを防ぎ、テーマの更新中にコードを安全に保ちます。

注意: WPCodeの無料バージョンには、このチュートリアルに従うために必要なすべてが含まれています。コードに慣れてきたら、スニペット用のクラウドライブラリやスマート条件付きロジックのような便利な機能を提供するProバージョンにアップグレードできます。

ステップ1:WPCodeをインストールして新しいスニペットを作成する

まず、無料のWPCodeプラグインをインストールしてアクティベートします。ヘルプが必要な場合は、WordPressプラグインのインストール方法に関するガイドを参照してください。

次に、ダッシュボードから コードスニペット » スニペットを追加 に移動し、「カスタムコードを追加(新規スニペット)」を選択します。

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

次に、スニペットのコードタイプを選択する必要があります。画面の下部で、「PHP」オプションをクリックするだけです。

ステップ 2: カスタム PHP コードの追加

次の画面で、スニペットに「最終更新投稿ショートコード」のようなタイトルを付けます。

WPCode でスニペットのタイトルとコードを追加する

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

function wpb_lastupdated_posts( $atts ) {
    // Initialize the output string to prevent "Undefined variable" warnings.
    $output_string = '';

    // Parse the shortcode attributes.
    // 'limit' is the attribute name, and 5 is its default value if not provided.
    $atts = shortcode_atts( array(
        'limit' => 5,
    ), $atts, 'lastupdated-posts' );

    // Sanitize the 'limit' attribute to ensure it's a positive integer.
    $posts_limit = intval( $atts['limit'] );
    if ( $posts_limit <= 0 ) {
        $posts_limit = 5; // Fallback to default if an invalid limit is provided.
    }

    // Query Arguments for WP_Query.
    $lastupdated_args = array(
        'orderby'             => 'modified',         // Order posts by their last modified date.
        'ignore_sticky_posts' => 1,                  // Exclude sticky posts from the list.
        'posts_per_page'      => $posts_limit,       // Set the number of posts to display based on the 'limit' attribute.
        'post_status'         => 'publish',          // Only retrieve published posts.
    );

    // Create a new WP_Query instance.
    $lastupdated_loop = new WP_Query( $lastupdated_args );

    // Check if there are any posts found by the query.
    if ( $lastupdated_loop->have_posts() ) {
        // Added the 'last-updated-posts' CSS class to the <ul> tag.
        $output_string .= '<ul class="last-updated-posts">'; // Start the unordered list with a CSS class.

        // Loop through each post found by the query.
        while ( $lastupdated_loop->have_posts() ) :
            $lastupdated_loop->the_post(); // Set up post data for the current post.

            // Append each post as a list item with its link, title, and modified date.
            $output_string .= '<li><a href="' . get_permalink() . '">' . get_the_title() . '</a> ( ' . get_the_modified_date() . ') </li>';
        endwhile;

        $output_string .= '</ul>'; // Close the unordered list.
    } else {
        // Optional: Message to display if no recently updated posts are found.
        $output_string .= '<p>No recently updated posts found.</p>';
    }

    // Reset post data. This is crucial to restore the global post data
    // to the main query after running a custom query.
    wp_reset_postdata();

    // Return the generated HTML string.
    return $output_string;
}

// Add the shortcode.
// This registers the 'lastupdated-posts' shortcode to be handled by the 'wpb_lastupdated_posts' function.
add_shortcode( 'lastupdated-posts', 'wpb_lastupdated_posts' );

このコードが何をするのかを簡単に説明します。これは、WordPressがデータベースから投稿を取得するための標準的な方法である「WP_Query」を使用する関数を作成します。投稿を「更新日」で並べ替えて取得するように設定しました。

次に、この関数をショートコード[lastupdated-posts]でラップします。これはサイトのどこでも使用できます。

最後に、wp_reset_postdata() はメインの WordPress クエリを復元します。これは、カスタムコードがページ上の他の機能を誤って壊すのを防ぐための重要なベストプラクティスです。

次に、「挿入」セクションまでスクロールし、方法が「自動挿入」に設定されており、場所が「すべて実行」になっていることを確認してください。これはショートコードの標準設定であり、WordPress がサイトのどこでも認識できるようにします。

WPCodeの挿入オプション

「すべてで実行」の場所を持つ「自動挿入」メソッドが正しい設定です。これにより、サイトのどこで使用することにしても、WordPress はショートコードを認識します。

最後に、上部にあるスイッチを「アクティブ」に切り替え、「スニペットを保存」ボタンをクリックします。

WPCode でスニペットをアクティブ化して保存する
ステップ3:サイトにショートコードを追加する

ショートコードを受け付けるサイト上のどこにでもリストを追加できるようになりました。

投稿またはページを編集し、ショートコードブロックを追加して、次のように入力します。

[lastupdated-posts]

これにより、デフォルトの 5 件の投稿が表示されます。

別の数を表示するには、次のように 'limit' パラメータを使用できます。

[lastupdated-posts limit="10"]

このコードは、テーマのリンクとリストアイテムのデフォルトのスタイルを継承した、単純でスタイル設定されていないリストを生成します。必要に応じて、テーマのスタイルシートにカスタムCSSを追加して、「.last-updated-posts」クラスをスタイル設定できます。

私のテストサイトのサイドバーでは、このように表示されます。

最終更新投稿の例

ボーナス: 個別投稿に「最終更新日」を表示する方法

ホームページやサイドバーにリストを表示するだけでなく、「最終更新日」を記事の冒頭に表示するのも良いアイデアです。これにより、読者は情報が最新で信頼できることをすぐに知ることができ、多くの信頼性を築くことができると私は考えています。

投稿に表示される最終更新日時のプレビュー

多くの人気テーマにはこのオプションが組み込まれています。テーマの設定を 外観 » カスタマイズで確認してください。投稿メタまたはブログ/投稿レイアウトに関連する設定を探してください。

テーマにこのオプションがない場合は、簡単に追加できます。完全な手順については、WordPressで投稿の最終更新日を表示する方法に関するガイドを参照してください。

注意: これらの変更を行ってもリストがすぐに表示されない場合は、WordPressのキャッシュをクリアする必要がある場合があります。

最近更新された投稿の表示に関するよくある質問

最近更新された投稿の表示に関する、よくある質問への回答を以下に示します。

1. 投稿を更新すると、URL や SEO に影響しますか?

いいえ、投稿のコンテンツを更新するだけでは、そのURL(パーマリンク)は変更されません。実際、古いコンテンツを更新および改善することは、検索ランキングを向上させることができる、非常に推奨されるSEOのベストプラクティスです。

2. 最後に更新されたリストから特定の投稿を除外できますか?

はい。言及したKadenceブロックプラグインを使用すると、ブロック設定から特定のカテゴリを含めたり除外したりできます。カスタムコードメソッドを使用している場合は、コードスニペットのWP_Query引数を変更して、特定のID、カテゴリ、またはタグで投稿を除外できます。

3. 更新日は公開日とどのように異なりますか?

公開日は、投稿がサイトで最初に公開された日付です。更新日は、投稿に何らかの変更が加えられて最後に保存された日付です。投稿は数年前に公開された日付を持つことができますが、更新日は昨日である可能性があります。

このガイドが WordPress で最後に更新された投稿を表示する方法を学ぶのに役立ったことを願っています。また、プラグインなしでサムネイル付きの関連記事を表示する方法に関するガイドをチェックして、訪問者をさらに長く引き付けたり、サイトの最も便利な WordPress ウィジェットの専門家による選択を確認したりすることもできます。

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

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

究極のWordPressツールキット

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

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

39 CommentsLeave a Reply

  1. ファンダムのように日付を表示する方法はありますか?「x日」と言う代わりに、「x時間前」や「x日前」と言う方が良いのではないでしょうか。

  2. こんにちは。
    「modified」を「date」に変更しました。その後、$lastupdated_loop->have_posts() がメインページに表示される最後の投稿数に制限されていることに気づきました。wpの設定に保存されている6ではなく、例えば50件の最後の投稿(独立した数)を取得するにはどうすればよいですか?

    • コードの12行目にある「&& $counter < 5」のセクションで、表示したい投稿数に合わせて5を別の数字に変更できます。

      管理者

      • ありがとうございます。これが最初にやったことだと確信できます。しかし、コード内の数値を変更しても結果がないことに注意してください。たとえば、「&& $counter <20」と入力しても、WordPress の設定に 6 があるため機能しません。したがって、問題は、これらの設定を一時的に上書きする方法、または WordPress の最大投稿数あたりのページ設定に対応せずに機能する他の解決策を見つける方法です。

        • テーマがクエリをそのようにオーバーライドしているため、6行目の末尾にカンマを追加し、次の行に「posts_per_page」=> 20 を追加して、テーマの投稿ごとのページ数をオーバーライドするように試すことができます。

    • 通常、ウィジェットや同様のオプションがあるため、eコマースプラグインに推奨されるオプションを確認することをお勧めします。

      管理者

  3. 5つ以上、例えば30件の最近更新された投稿をリストするにはどうすればよいですか?

  4. 指示をありがとうございます。まさに探していたものでした!ついにサイドバーに最新の更新を表示できます。

  5. こんにちは、

    うまく機能しますが、ページのコンテンツ権限を尊重しません。すべてのコンテンツが誰にでも表示されるようになります…

  6. こんにちは、

    「カスタムWordPressウィジェットの作成方法」と「サイト固有のWordPressプラグインの作成」を含め、すべてフォローしましたが、完璧に動作しました。素晴らしいチュートリアルで、「Hello world」というテキストがサイドバーに表示されるようになりました。

    しかし、これは私を完全に困惑させています。チュートリアルをできる限り従いましたが、更新された投稿のリストは表示されず、「Hello world」というテキストが表示されるだけです。

    カスタムプラグインファイルのどこに `wpb_lastupdated_posts()` 関数を記述すればよいですか? `add_shortcode` はどこに記述し、`if (function_exists(wpb_lastupdated_posts)) :` ステートメントはどこに記述すればよいですか?

    Many thanks, Des

  7. あなたの記事「サイト固有のWordPressプラグインを作成することの、何、なぜ、そしてどのように」で教えていただいたように、サイト固有のプラグインを1つ作成し、プラグインにfunction wpb_lastupdated_postsを挿入しましたが、テキストウィジェットのショートコードを機能させるためにプラグインにこの行を追加する必要がありました:

    add_filter(‘widget_text’, ‘do_shortcode’);

  8. 本当にありがとうございます。この記事のおかげで助かりました。コードは完璧に動作しています。

  9. 指示通りにコードをインストールしました。ショートコードを使用する際、投稿の最後に付け加えていますが、コードを表示すると、情報が投稿の上部に表示されます。奇妙です。

    • ここでも同じリクエストです。最近更新されたページを一覧表示し、最終更新日を表示することに興味があります。理想的には、抜粋またはページからの文字数を含めたいです。

  10. 素晴らしいコードですが、特定のユーザー(管理者)によるコメントに基づいて、この全く同じ機能を取得し、リストの先頭に最も最近のコメントを表示する方法はありますか?

    ありがとうございます!

  11. こんにちは…素晴らしい投稿です…。ところで、何か手伝っていただけませんか?最新の3つの公開投稿の画像とタイトルを取得して、ギャラリーのようなものに配置する必要があります(最新の3つの公開記事を表示するだけで、そのようなプラグインがあるかどうか、コードをそのまま使用できると思いますが、DB構造についてはあまり確信がありません)。

    前もって感謝します…=)

  12. こんにちは

    ところで、素晴らしい記事ですね。それで、疑問があります。

    このコードはどこに配置しますか?

    ""

    ありがとう

  13. WordPressのウェブサイトでオフィスの所在地住所を変更する方法がわかりません。いくら試しても、変更することができません。http://www.mastheadpa.ca 簡単で直接的な回答をいただけると幸いです。ほとんどのメンテナンスはできますが、その住所変更だけはうまくいかず、WPの情報やチュートリアルにもその鍵が見つかりません。助けてください。

    • @Pierre、オフィス の場所はウィジェット内に保存されています。WordPress の管理画面で、外観 » ウィジェット に移動してください。右側の列に、現在サイトで使用されているウィジェットのリストが表示されます。フッターウィジェットエリアを探し、そこに表示される「お問い合わせ」ウィジェットを編集して変更を保存できます。

      管理者

  14. こんにちは、この記事はとても気に入っていますが、「このように使用してください:
    1」と記載されている部分で、具体的に何を更新すればよいのかよく理解できません。

    これはどのファイルですか?

    Steve

    • 一部のユーザーは、WordPressテーマの異なるテンプレートに最終更新投稿を表示したい場合があります。そのようなユーザーは、このコードを使用して追加できます。他のユーザーは、投稿、ページ、ウィジェットに追加するためにショートコードを使用できます。

      管理者

  15. ループに$counterを使用する代わりに、WP_Query引数で'posts_per_page'属性を使用しませんか?

    私のはこうです:

    $lastupdated_args = array( ‘orderby’ => ‘modified’, ‘ignore_sticky_posts’ => 1, ‘posts_per_page’ => 5 );

    Also, when I try the above code, it only give me one last modified post (not five as it should be). Wonder why …

  16. I love your articles but this one is way over my head. Are there any plugins for this? :)

    ウェブサイトの「内部」についてはよくわからないため、いくつか試した際にサイトを壊してしまいました。

    とても良いアイデアですね。素晴らしいお仕事、ありがとうございます。 メアリー

    • 上記のコードは実際には「プラグイン」です。最初のコードを機能プラグインにコピー&ペーストするだけです。次に、投稿リストを表示するには、テンプレートタグを使用するか、最も簡単な方法として [lastupdated-posts] ショートコードを使用するかの 2 つの方法があります。

返信する

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