WordPressで投稿記事を並べるときに、最新の記事数件に【NEW!】といったマークなりテキストを付けたいときがあります。
こうして目立つようにしておくと、新着記事に注目が集まって便利ですよね。
今回はそんなときに役立つコードをご紹介します。
「◯日以内に更新された記事にはNEWマークをつけたい」という場合
「今日からさかのぼって1週間以内に更新された記事は新着記事として扱いたい」とかそんな時には、WordPressの記事ループ内にこちらのコードを使うと良いです。
1 2 3 4 5 6 7 8 | <?php $post_time = get_the_time('U'); $days = 7; //New!を表示させる日数 $last = time() - ($days * 24 * 60 * 60); if ($post_time > $last) { echo '<span class="new-txt">NEW!</span>'; } ?> |
もしNEWマークを表示させる日数を変更したければ$daysに入れる数値を変えればOKです。
テキストではなくて画像アイコンを表示させたかったり任意のクラスを付けたいという場合は、表示されるHTMLコードを適当にいじってください。
「最新の投稿◯件目まではNEWマークをつけたい」という場合
もうひとつよくあるパターンとして「時間で区切るのではなく、最新3件の投稿はいつまでも新着記事として扱いたい」という場合があります。
そんな時は以下のコードを使ってループを書いてみてください。
1 2 3 4 5 6 7 8 9 10 11 12 | <?php $the_query = new WP_Query(array( // 何かループに条件をつけたければ書く 'cat' => 1, 'posts_per_page' => 10 )); while($the_query->have_posts()) : $the_query->the_post(); if ($the_query->current_post < 4) { echo '<span class="new-txt">NEW!</span>'; } endwhile; ?> |
WP_Queryのcurrent_postプロパティは、ループ内で表示しようとしている投稿の数を知らせてくれます。
これを利用して3件目まではNEW!というテキストが表示されるようにしています。
WP_Queryの扱いについて詳しくはリファレンスをご確認ください。
まとめ
新着記事にNEWマークを付けるというカスタマイズは派手さはありませんが、サイトの使い勝手も上がるため多くのサイトで必要になる要件です。
そういったときにこうしたコードを覚えておくとサッとつかうことができて便利です。
今回はこちらのページのコードを参考にさせていただきました。
ありがとうございます。
参考:WordPressでNew!を表示するパターン別4つの方法
それではまた!
ホームページ制作はもちろん、ブログ・SNSの運用やコンテンツ企画もお任せください。