カスタマイズカテゴリ再編成に伴い、一定期間新着表示をするjavascriptを取り入れてみたので覚え書きしておきます。javascriptはjavascript無効の環境では表示されないというデメリットがありますが、new表示くらいなら表示されなくても別に問題ないし、何より静的・動的を問わず手軽に導入できるのがいいところです。
以下のサイト様よりお借りしたスクリプトをMT用にアレンジして使ってみました。ありがとうございました。
■スクリプトの設置
●テキスト表示の場合
以下のスクリプトを<head>～</head>内に貼り付けます。
赤字の部分を自分の設定に合わせて書き換えます。数字は表示させる日数、new! 部分が表示される新着マークになります。
<script type="text/javascript">
<!--
function newM(y,m,d)
{
newday=new Date(y+"/"+m+"/"+d);
oldday= new Date();
n=(oldday-newday)/(1000*60*60*24);
if (n <=3)document.write("<span class='newmark'>new!</span>");
}
//-->
</script>
スタイルシートに以下を追加。好きに装飾して下さい。
.newmark {
color: #FF0000;
}
●画像表示の場合
以下のスクリプトを<head>～</head>内に貼り付けます。
赤字の部分を自分の設定に合わせて書き換えます。数字は表示させる日数、赤字のhttp～部分に画像のアドレスを入れます。
<script type="text/javascript">
<!--
function newM(y,m,d)
{
newday=new Date(y+"/"+m+"/"+d);
oldday= new Date();
n=(oldday-newday)/(1000*60*60*24);
if (n <=3)document.write("<img src='http://画像のアドレス/new.gif' />");
}
//-->
</script>
■テンプレートへの挿入例
●最近のエントリー一覧に新着マークを付ける
エントリー一覧用タグに以下の青字の部分を追加。モデルタグは3.3標準になってます。
<ul class="module-list">
<MTEntries lastn="10">
<li class="module-list-item">
<a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a>
<script type="text/javascript">newM(<$MTEntryDate format="%Y,%m,%d"$>)</script>
</li>
</MTEntries>
</ul>
●新着のあったカテゴリータイトルに新着マークを付ける
カテゴリー一覧用タグに以下の青字の部分を追加。モデルタグは3.3標準になってます。
<MTTopLevelCategories>
<MTSubCatIsFirst><ul class="module-list"></MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li class="module-list-item">
<a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><MTCategoryLabel></a>
<MTEntries lastn="1"><script type="text/javascript">newM(<$MTEntryDate format="%Y,%m,%d"$>)</script></MTEntries>
<MTElse>
<li class="module-list-item"><MTCategoryLabel>
</MTElse>
</MTIfNonZero>
<MTSubCatsRecurse>
</li>
<MTSubCatIsLast></ul></MTSubCatIsLast>
</MTTopLevelCategories>
★この他にも、<$MTEntryDate format="%Y,%m,%d"$>を<$MTEntryModifiedDate format="%Y,%m,%d"$>に変えれば更新エントリーに up! マークを付けることも出来るし、<$MTCommentDate$>や<$MTPingDate$>に変えればコメントやトラバの新着マークにも使えるので応用範囲が広いと思います。
＜ポイント＞
★要は、新着表示させたい部分に、以下の形（西暦,月,日）になるように書き込めばいいだけの話なので、MTだけでなく普通のWEBサイトにも使えます。ソースの西暦・月・日から比較して、アクセスされた日が設定された期間内ならマークを表示し、過ぎたら消してくれるということです。
<script type="text/javascript">newM(2006,12,14)</script>
ということで、これからはメインサイトにも応用してみよう♪ イラストにnew表示した後で頃合を見計らって消しにいくという面倒さがこれで解消されそうです。
関連エントリ
Smarty（PHP）版：Smartyによる新着表示
MTタグのみ版：一定期間new表示をする（MTタグ版）