WordPressで新着記事に『NEW』マークをつける方法

2022年12月7日

新着情報の横に『NEW』マークをつける方法をご紹介。

WordPressプラグイン『what’s new generator』もコードなしで表示する事ができますが、このプラグインは5年間（2022年12月7日現在）アップデートされていないので、利用している場合はプラグイン削除の上、コードにて対応ください。

長く更新されていないプラグインはセキュリティホールの原因になりますのでご注意ください。

『NEW』マーク時間指定

<?php
    $days = 3;
    $now = date_i18n('U');
    $entry = get_the_time('U');
    $term = date('U',($now - $entry)) / 86400;
    if( $days > $term ) {
        echo '<span class="new-entry">NEW</span>';
    }
?>

「NEW」マークを表示させたい箇所に上記コードを追加します。
NEW箇所は日本語でも何でも好きな表記をご指定ください。
index.phpや記事内であれば single.php など、使っているテーマphpファイル内に指定してください。

1行目「$days = 3」で「New」をつける期間を3日以内、3日以上3日未満の場合はこの数字を変更
4行目「86400」は1日の秒数です。（60秒×60分×24時間=86400）

『NEW』マーク記事数指定

$limit = 5;
$num = $wp_query->current_post;
if ( $limit > $num ):
    echo 'NEW';
endif;

『NEW』マークのカスタマイズ方法

CSSを把握していれば比較的簡単な表現方法となります。

.new-entry {
    color: #ffffff; // フォントカラー
    background: #f35b69; // バックグランドカラー
    position: relative;
    display: inline-block;
    
}

余白などは既存レイアウト、フォントサイズにあわせご指定ください。

WordPressは無駄にプラグインを入れずとも様々な事が実装できますので、できるだけプラグイン依存は避けてください。

Recent Entries