ユーザー毎の閲覧記録をローカルストレージに記録するようにしてみました。ワードプレスのサポートならレスキューワーク株式会社のニュース記事部分に実装しています。
HTML5のローカルストレージ機能を利用して実装しています。最初のアクセス時は全て new! を表示します。訪問した時刻をdateに記録します。ニュース記事のIDをnewstodayに記録します。二回目以降は、前回の訪問より7日以上経過していれば、newstodayをnewsにコピーします。newsに記録されているニュース記事は new! を表示しないようにしています。ひとまず7日にしていますが、ここはサイトの更新頻度に応じて調整したほうが良いかもしれません。あくまで暫定的な日数です。
/** * Copyright 2013 Fumito MIZUNO * License: AGPL ver.3.0 or later */ $js = <<<EOS jQuery(document).ready(function(){ var days = 7; // ここで日数を指定する var tmpdata = localStorage.getItem('date'); nowdate = new Date(); var datein = nowdate.getTime(); if (tmpdata === null || datein - tmpdata >= days*24*60*60*1000) { update = true; } else { update = false; } var storage_news = localStorage.getItem('news'); if (update === true) { var todaydata = localStorage.getItem('newstoday'); if(todaydata !== null) { localStorage.setItem('news',todaydata); storage_news = todaydata; } } if (storage_news === null) { postdata = new Array(); } else { postdata = JSON.parse(storage_news); } var val = new Array(); $('.news_box div.blog_set').each(function(){ var id = $(this).attr('id'); if ($.inArray(id,postdata) == -1) { $('#'+id).addClass('new'); } val.push(id); }); if (update === true) { localStorage.setItem('date',datein); localStorage.setItem('newstoday',JSON.stringify(val)); } }); EOS; $css = <<<EOS .new::before{ background-color: aqua; content: " new! "; }' EOS; NosNos::main_controller()->addJavascriptInline($js); NosNos::main_controller()->addCssInline($css);
ウェブサイトによっては「WordPress記事が公開されたら7日間はnewを表示する」という、ウェブ制作者目線の表示になっているケースがあるのですが、ユーザーにとって大事なのは、「自分にとって新しい情報かどうか」だと思われます。なので、この実装のほうが好ましいと思います。