現在製作中のサイトで、クライアント様から「記事が公開されたときに『New』のサインを表示させて欲しい」との依頼がありました。
もともと WordPress で構築していたサイトだったので比較的簡単に実装できたわけですが、今日はその際に使ったコードを紹介しようと思います。
記事を公開してから○○日間「New」を表示する
WordPress のテンプレート内、「New」を表示させたい場所に以下のコードを記述します。
このまま使用した場合は、記事を公開してから5日間は<span class="new">New</span>
が表示されることになります。
「New」が表示される日数を変更したい場合は、赤字の $days = 5;
の部分を任意の数値に変更してください。
<?php $days = 5; $today = date_i18n('U'); $entry = get_the_time('U'); $elapsed = date('U',($today - $entry)) / 86400; if( $days > $elapsed ){ echo '<span class="new">New</span>'; } ?>
記事を更新してから○○日間「New」を表示する
上記は「記事を公開してから〜」でしたが、「記事を更新してから~」というケースにも対応できます。
基本的に方法は同じで、ほとんど似たようなコードになりますが、先程まで get_the_time
を使用していた箇所を get_the_modified_date
に変更することで、記事が公開された日ではなく、記事が更新された日をベースにすることができます。
<?php $days = 5; $today = date_i18n('U'); $entry = get_the_modified_date('U'); $elapsed = date('U',($today - $entry)) / 86400; if( $days > $elapsed ){ echo '<span class="new">New</span>'; } ?>
複数箇所で使うには?
例えば、投稿で作成した記事に関しては、更新してから3日間「New」を表示させたいけど、カスタム投稿で作成した記事の場合は更新してから10日間「New」を表示させたいというように、「New」を表示させたい場所によって表示日数の条件を変更したいというケースの場合、 functions.php
を利用することで、より簡単に複数箇所で実装することができます。
まずは functions.php
に以下のコードを記述します。
function add_new($date,$days){ $today = date_i18n('U'); $elapsed = date('U',($today - $date)) / 86400; if( $days > $elapsed ){ echo '<span class="new">New</span>'; }}
今までのものと同様、上記 echo
の部分は表示されるタグや文言の部分になるので任意で書き換えてください。
あとは実際に表示させたい箇所に以下のような短いコードを記述していきます。
<?php add_new(get_the_time('U'),5); ?>
「New」が付く日数を変更したい場合は数字の「3」が記述してある部分を任意の数値に書き換えるだけなので簡単ですね。
また、この例では get_the_time
を使用して「公開した日付」をベースにしていますが、get_the_time
の部分を get_the_modified_date
に変更すれば「更新した日付」をベースにすることができます。