top

リアルタイムカレンダー

先日買った「公式タグリファレンス」に面白そうなタグがあったので、ちょっと遊んでみました。

<MTCalendarIfToday>~</MTCalendarIfToday>

カレンダー内で日付が「今日」の時だけ表示するタグなんだそうです。これを使えばカレンダーに「今日」の日付を表示することが出来ますね。「カレンダーが再構築された時点での今日」ということなので、静的生成ではその日に更新がないと「今日」になりませんが、ダイナミック・パブリッシングなら更新や再構築の有無にかかわらず、常にアクセスした時点での「今日」を表示することが出来ます。

よって、ダイナミックならこのタグを入れるだけで即座に「リアルタイムカレンダー」になりますねっ♪
以下、いろいろ試してみたサンプルの覚え書きです。

■下準備
リアルタイムにするならダイナミックでないと意味ありません。よってダイナミック生成のカレンダーを使いますので、例によってアーカイブマッピングでの日別頁アドレスの準備をしておきます(詳しくはこちらを)。ここでは日別頁のアドレスは<$MTBlogArchiveURL$><$MTArchiveDate format="%Y%m%d"$>.htmlとしたものとして進めます。

■通常型カレンダー

<table summary="投稿されたエントリーへのリンク付き月間カレンダー">
<caption><$MTDate format="%B %Y"$></caption>
<tr>
<th abbr="日曜日">日</th>
<th abbr="月曜日">月</th>
<th abbr="火曜日">火</th>
<th abbr="水曜日">水</th>
<th abbr="木曜日">木</th>
<th abbr="金曜日">金</th>
<th abbr="土曜日">土</th>
</tr>
<MTCalendar>
<MTCalendarWeekHeader><tr></MTCalendarWeekHeader>
<MTCalendarIfToday><td class="tody">
<MTElse><td></MTElse>
</MTCalendarIfToday>
<MTCalendarIfEntries><MTEntries><MTDateHeader>
<a  href="<$MTBlogArchiveURL$><$MTArchiveDate format="%Y%m%d"$>.html" title="</MTDateHeader>[<$MTEntryTitle$>]<MTDateFooter>">
<$MTCalendarDay$></a>
</MTDateFooter>
</MTEntries></MTCalendarIfEntries>
<MTCalendarIfNoEntries><$MTCalendarDay$>
</MTCalendarIfNoEntries>
<MTCalendarIfBlank>&nbsp;</MTCalendarIfBlank></td>
<MTCalendarWeekFooter></tr></MTCalendarWeekFooter>
</MTCalendar>
</table>

スタイルシート

.tody {
    background : #EEEEEE;
    border : 1px solid #CCCCCC;
}

■横一列型カレンダー

<b><$MTDate format="%Y&nbsp;%b"$></b>|
<MTCalendar>
<MTCalendarIfEntries>
<MTEntries><MTDateHeader>
<a href="<$MTBlogArchiveURL$><$MTArchiveDate format="%Y%m%d"$>.html" title="</MTDateHeader>[<$MTEntryTitle$>]<MTDateFooter>">
<MTCalendarIfToday><span class="tody"></MTCalendarIfToday>
<$MTCalendarDay$>
<MTCalendarIfToday></span></MTCalendarIfToday>
</a>
</MTDateFooter></MTEntries>
</MTCalendarIfEntries>
<MTCalendarIfNoEntries>
<MTCalendarIfToday><span class="tody"></MTCalendarIfToday>
<$MTCalendarDay$>
<MTCalendarIfToday></span></MTCalendarIfToday>
</MTCalendarIfNoEntries>
</MTCalendar>

ここではスタイルシートは上の通常版と共有にしてありますが、好みでアレンジをどうぞ。

いずれも青字の部分がこのタグによって追加・編集された部分です。

■応用~画像表示横一列カレンダー

<b><$MTDate format="%Y&nbsp;%b"$></b>|
<MTCalendar>
<MTCalendarIfEntries>
<MTEntries><MTDateHeader>
<a href="<$MTBlogArchiveURL$><$MTArchiveDate format="%Y%m%d"$>.html" title="</MTDateHeader>[<$MTEntryTitle$>]<MTDateFooter>">
<MTCalendarIfToday><img border="0" src="画像のアドレス">
<MTElse>
<$MTCalendarDay$>
</MTElse></MTCalendarIfToday>

</a>
</MTDateFooter></MTEntries>
</MTCalendarIfEntries>
<MTCalendarIfNoEntries>
<MTCalendarIfToday><img border="0" src="画像のアドレス">
<MTElse>
<$MTCalendarDay$>
</MTElse></MTCalendarIfToday>

</MTCalendarIfNoEntries>
</MTCalendar>

↑「今日」の日付部分が数字ではなくて画像になっています。

ただしコレ、今のスタイルだと使い道がないところがアレですが…(笑)。
まあこやって書き留めておけば、いつか使う日が来るかもしれない…かも(う~むむ)。