WordPressで新着記事に日付や件数を指定してNewマークを表示する方法

Newを日付や件数を指定して表示する方法

アサル(ASAL)です!

WordPressでブログとして使う場合やコーポレートサイトなど、お知らせやブログ機能を構築する場合、最新の記事には「New」マークをつけますよね。

そんな「New」マークですが、時間や日にち、件数によって、「New」マークの数を調節できるようにしたいですよね?

そこで今回は、「New」マークのカスタマイズについて、下記の悩みを解決していきましょう!

悩み

配置したい場所に出力したい

日時指定でNewを表示したい

件数でNewを表示したい

全部の条件を使ってNewを表示したい

公開後○日間、Newを表示させる

記事を公開してから○日間の間、Newマークを表示させる方法は下記のコードになります。

<?php
$days = 7; //Newを表示させたい期間の日数
$today = date_i18n('U');
$entry = get_the_time('U');
$kiji = date('U',($today - $entry)) / 86400 ;
if( $days > $kiji ){
echo 'New';
}
?>

下の数字を変更することで、表示させたい日数を決めることができます。

$days = 7; //Newを表示させたい期間の日数

もし、Newマークにデザインを付ける場合は、下記のように、spanタグなどで囲ってあげるとcssでのデザインの幅が広がりますね。

echo '<span>New</span>';

全記事から最新記事にNewを表示させる

全記事の中から、常に最新の記事に対してNewマークを表示させる方法になります。

<?php
$last_post_ids = array();
//Newを付ける最新記事の件数
$lastposts = get_posts('posts_per_page=5');
foreach($lastposts as $lastpost) {
$last_post_ids[] = $lastpost->ID;
}
?>
<?php if ( in_array( $post->ID, $last_post_ids ) ) : ?>New<?php endif; ?>

こちらも先ほどと同じく、Newマークにデザインを付ける場合は、下記のように、spanタグなどで囲ってあげるとcssでのデザインの幅が広がりますね。

<?php if ( in_array( $post->ID, $last_post_ids ) ) : ?><span>New</span><?php endif; ?>

件数と日時の両条件でNewマークを表示させる

下記のような場合は、最新記事5件以内と公開日時が10日以下の場合は、Newをが付くという2つの条件でのNewマークの表示方法になります。

このパターンが1番使われているのではないでしょうか?

<?php
$last_post_ids = array();
//New!を付ける最新記事の件数
$lastposts = get_posts('posts_per_page=5');
foreach($lastposts as $lastpost) {
$last_post_ids[] = $lastpost->ID;
}
?>
<?php
$days = 10; //Newを表示させたい期間の日数
$today = date_i18n('U');
$entry = get_the_time('U');
$kiji = date('U',($today - $entry)) / 86400 ;
if( $days > $kiji ){
?>
<?php if ( in_array( $post->ID, $last_post_ids ) ) : ?>New!<?php endif; ?>
<?php
}
?>

Newマークにデザインを付ける場合は、下記のように、spanタグなどで囲ってあげます。

<?php if ( in_array( $post->ID, $last_post_ids ) ) : ?><span>New!</span><?php endif; ?>

まとめ

いかがでしたか?

WordPress案件やコーポレートサイトで、よく使われるのではないでしょうか?

クライアントにも柔軟に対応できるようにしておきましょう!

アサル(ASAL)でした!

他にもこんな記事があります!