2009年1月26日
dTree カテゴリーリストにブログ記事数を表示する
Posted at January 26,2009 1:55 AM
Category:[JavaScript, カテゴリー, 新着表示]
Tag:[Customize, dTree, MovableType]
Category:[JavaScript, カテゴリー, 新着表示]
Tag:[Customize, dTree, MovableType]
Movable Type に表示する dTree カテゴリーリストに、ブログ記事数を表示するカスタマイズです。このカスタマイズを行なえば、dTree のカテゴリーリストにブログ記事が公開されているカテゴリーにブログ記事数を表示します。

ご要望を頂きましたので、本エントリーにて紹介致します。なお、このカスタマイズは「dTree サブカテゴリーリスト + 新着表示 for Movable Type」のカスタマイズを元にしています。
以下、サブテンプレートのみ示します。
「dTree サブカテゴリーリスト + 新着表示 for Movable Type」のひとつめのリストは、次の内容に変更してください。
<script type="text/javascript">
d = new dTree('d');
d.config.useCookies=false;
d.add(0, -1,'Categories','javascript: void(0);');
<mt:setVar name="cat_number" value="1" />
<mt:setVar name="level" value="1" />
<mt:topLevelCategories>
<mt:setVar name="cat_number" op="++" />
<mt:setVar name="tree[$level]" value="$cat_number" />
<mt:if name="level" eq="1">
d.add(<mt:getVar name="cat_number" op="--" />, 0,'<mt:categoryLabel escape="html" /><mt:if tag="CategoryCount"> [<$mt:CategoryCount$>]</mt:if> <span class="new"><mt:entries lastn="1"><mt:entryDate format="%Y:%m:%d:%H:%M:%S" /></mt:entries></span>','<mt:if tag="CategoryCount"><mt:categoryArchiveLink /><mt:else>javascript: void(0);</mt:if>');
<mt:else>
d.add(<mt:getVar name="cat_number" op="--" />, <mt:setVar name="tmp" value="$level" /><mt:setVar name="tmp" op="--" /><mt:getVar name="tree[$tmp]" op="--" />,'<mt:categoryLabel escape="html" /><mt:if tag="CategoryCount"> [<$mt:CategoryCount$>]</mt:if> <span class="new"><mt:entries lastn="1"><mt:entryDate format="%Y:%m:%d:%H:%M:%S" /></mt:entries></span>','<mt:if tag="CategoryCount"><mt:categoryArchiveLink /><mt:else>javascript: void(0);</mt:if>');
</mt:if>
<mt:setVar name="level" op="++" />
<mt:subCatsRecurse />
<mt:setVar name="level" op="--" />
</mt:topLevelCategories>
document.write(d);
</script>
</div>
<p style="text-align:center"><a href="javascript: d.openAll();">open all</a> | <a href="javascript: d.closeAll();">close all</a></p>
<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') {
if (spans[i].childNodes[0]) {
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>
「dTree サブカテゴリーリスト + 新着表示 for Movable Type」のふたつめのリストは、次の内容に変更してください。
<script type="text/javascript">
d = new dTree('d');
d.config.useCookies=false;
d.add(0, -1,'Categories','javascript: void(0);');
<mt:setVar name="cat_number" value="1" />
<mt:setVar name="level" value="1" />
<mt:topLevelCategories>
<mt:setVar name="cat_number" op="++" />
<mt:setVar name="tree[$level]" value="$cat_number" />
<mt:if name="level" eq="1">
d.add(<mt:getVar name="cat_number" op="--" />, 0,'<mt:categoryLabel escape="html" /><mt:if tag="CategoryCount"> [<$mt:CategoryCount$>]</mt:if>','<mt:if tag="CategoryCount"><mt:categoryArchiveLink /><mt:else>javascript: void(0);</mt:if>','<mt:entries lastn="1"><mt:entryDate format="%Y:%m:%d:%H:%M:%S" /></mt:entries>');
<mt:else>
d.add(<mt:getVar name="cat_number" op="--" />, <mt:setVar name="tmp" value="$level" /><mt:setVar name="tmp" op="--" /><mt:getVar name="tree[$tmp]" op="--" />,'<mt:categoryLabel escape="html" /><mt:if tag="CategoryCount"> [<$mt:CategoryCount$>]</mt:if> ','<mt:if tag="CategoryCount"><mt:categoryArchiveLink /><mt:else>javascript: void(0);</mt:if>','<mt:entries lastn="1"><mt:entryDate format="%Y:%m:%d:%H:%M:%S" /></mt:entries>');
</mt:if>
<mt:setVar name="level" op="++" />
<mt:subCatsRecurse />
<mt:setVar name="level" op="--" />
</mt:topLevelCategories>
document.write(d);
</script>
</div>
<p style="text-align:center"><a href="javascript: d.openAll();">open all</a> | <a href="javascript: d.closeAll();">close all</a></p>
<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') {
if (spans[i].childNodes[0]) {
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>
Posted by yujiro このページの先頭に戻る
- MTEntriesタグのcategoryモディファイアに「AND」を含むカテゴリを指定する
- ブログ記事ページに自分が属するカテゴリのツリーと直属カテゴリの他のブログ記事一覧を表示する
- Movable Type 5でのMTEntriesタグのcategory/catgoriesモディファイアの動作改善について
- 親カテゴリーアーカイブにサブカテゴリーのブログ記事を表示する場合に特定のサブカテゴリーのブログ記事をフィルタリングする
- 特定のカテゴリのブログ記事を表示する
- 親カテゴリページにサブカテゴリページのリンクを表示する
- Movable Type 5(MT5)のカテゴリ削除動作
- sort_method モディファイア(その2)
- sort_method モディファイア(その1)
- Movable Type でカテゴリ別にブログ記事の背景画像を切り替える(カスタムフィールド編)
- Movable Type でカテゴリ別にブログ記事の背景画像を切り替える
- 親カテゴリーアーカイブに表示したサブカテゴリーのブログ記事にサブカテゴリー名を表示する
- ブログ記事のない親カテゴリーに子カテゴリーのブログ記事を表示する(Movable Type 4.25~)
- カテゴリーアーカイブページの最後に「続きを読む」のリンクを表示する
- Movable Type のカテゴリーリストで特定のカテゴリーを非表示にする
- カテゴリークラウド for Movable Type
- カテゴリーの階層別にデザインを切り替える for Movable Type 4
- カテゴリーリストの中に月別カテゴリーリストを表示する
- サブカテゴリーリストを定義型リストでマークアップする
- ブログ記事に同一カテゴリーのブログ記事の前後リンクを表示する
この記事を読んだ人はこんな記事も読んでいます
人気エントリー
Hatena Hot Entries
Hatena Entries
トラックバックURL
コメントする
greeting
