カテゴリリストのカテゴリに「new」マークを付ける
2006/08/26 23:34
小粋空間さんを参考にしました。
http://www.koikikukan.com/archives/2006/02/20-235151.php
<span class="new"><MTEntries lastn="1"><$MTEntryDate format="%Y:%m:%d:%H:%M:%S"$></MTEntries></span>
上記をカテゴリリストに追加する。
うちは、カテゴリレベルを日本語表記にしているので、このようになりました。
<a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>
"><$MTCategoryDescription$></a><span class="new">
<MTEntries lastn="1"><$MTEntryDate format="%Y:%m:%d:%H:%M:%S"$></MTEntries></span>
それで、各テンプレートの下部に下記Javascriptを追加。
<script type="text/javascript">
<!--
// passage time
var pass = 24;
// display content
var content = 'New!!';
var currentDate = new Date();
var spans = document.getElementsByTagName('span');
for (i = 0; i < spans.length; i++) {
if(spans[i].getAttribute('class') == 'new' ||
spans[i].getAttribute('className') == 'new') {
time = spans[i].childNodes[0].nodeValue.split(":");
var entryDate = new Date(time[0], time[1]-1, time[2], time[3], time[4], time[5]);
var now = (entryDate.getTime() - currentDate.getTime())/(60*60*1000);
now = Math.ceil(now);
if(-now <= pass){
spans[i].innerHTML = content;
spans[i].style.display = 'inline';
}
}
}
//-->
</script>
・「new」マークを表示している時間をここで調節。
// passage time
var pass = 24;
・「new」マークの表記をここで調節。タグを入れられるので、画像も可能だそうです。
// display content
var content = 'New';
・cssの設定。
小粋空間さんは、font-weightをboldにしていらっしゃったんですが、うちはboldにしたくなかったのでカット。
span.new {
display: none;
color: red;
}
----
本当は特定カテゴリのみにnewマークを表示したかったんだけど、よくわからなかったのでこれで妥協。
