最終更新日:2021.10.26（公開:2020.4.8）

WordPress（ワードプレス）で新着記事に「NEW」マークをつける方法

宮城のWEB担当者の皆様、こんにちは！今日はWordPressの新着記事に「NEW」マークをつける方法についてです。

結構簡単にできちゃいますので、WEB担当者の方はご検討ください！

そもそもNEWマークは必要？

はい、必要です！

検索エンジン経由で訪れるユーザーは下層ページがランディングになることが多いので、そんなに意識しなくてもいのですが、トップページへ直接来てくれるリピーターに対してNEWマークはとても有効に作用すると思います。視覚的に新しい記事であることが伝わりますので、「まだ読んでいない記事ですよ！」と視覚的に伝えることができます。更に「きちんと更新しているサイト」ということを、これも視覚的に印象づけることができます。

NEWマークのつけかた

日数単位でNEWマークをつける

下記は「3日だけNEWマーク」を付ける場合です。


<?php
$days = 3;  // NEWマークを表示する日数
$now = date_i18n('U');  // 現在の時間
$entry = get_the_time('U');  // 投稿した時間
$term = date('U',($now - $entry)) / 86400;
if( $days > $term ){
	echo '<span class="new-mark">NEW</span>';
}
?>

お気づきかと思いますが、5行目の「86400」というのは1日の秒数です。ここが肝になります。

この秒数が表示する「日付や時間の単位」になります。上記の場合は、変数$dayの3と合わせて3日間となるわけです。

1週間NEWマークを付けたい時は、$dayを7に設定することになります。

時間単位でNEWマークをつける

下記は「3時間だけNEWマークを付ける」場合です。


<?php
$hour = 3;  // NEWマークを表示する時間
$now = date_i18n('U');  // 現在の時間
$entry = get_the_time('U');  // 投稿した時間
$term = date('U',($now - $entry)) / 3600;
if( $hour > $term ){
	echo '<span class="new-mark">NEW</span>';
}
?>

1時間の秒数である「3600」で割ります。変数$hourの3と合わせて3時間となります。

分単位でNEWマークをつける

使うことはないと思いますが、「3分だけNEWマークを付ける」場合です。60秒に変更します。


<?php
$min = 3;  // NEWマークを表示する分
$now = date_i18n('U');  /// 現在の時間
$entry = get_the_time('U');  // 投稿した時間
$term = date('U',($now - $entry)) / 60;
if( $min > $term ){
	echo '<span class="new-mark">NEW</span>';
}
?>

1分間の秒数「60」で割ります。変数$minの3と合わせて3分間となります。