TopMovable Typeリポジトリ > 2006年1月
2006年1月27日

StyleCatcher 用のテンプレートでカレンダーを表示する

現在公開中のMovable Type 3.2 テンプレート(for StyleCatcher)に、カレンダーを設置する場合のカスタマイズです。スタイルシートをすでにカスタマイズされている方は下記の手順で実施してください。なおリポジトリのスタイルシート内容もカレンダー追加を想定して先ほど修正致しました(不具合ありましたらご連絡ください)。

1.カレンダーテンプレートの設定

カレンダーを表示したページのサイドメニュー(デフォルトテンプレートでサイドメニューがあるのはトップページだけですが)に、下記のタグを追加します。ここでは Movable Type ユーザー・マニュアルに記述されたカレンダーを使っています。

<div class="module-calendar module">
<h2 class="module-header">カレンダー</h2>
<div class="module-content">
<table border="0" cellspacing="4" cellpadding="0" summary="Monthly calendar">
<caption><$MTDate format="%B %Y"$></caption>
<tr>
<th abbr="Sunday" align="center">Sun</th>
<th abbr="Monday" align="center">Mon</th>
<th abbr="Tuesday" align="center">Tue</th>
<th abbr="Wednesday" align="center">Wed</th>
<th abbr="Thursday" align="center">Thu</th>
<th abbr="Friday" align="center">Fri</th>
<th abbr="Saturday" align="center">Sat</th>
</tr>
<MTCalendar>
<MTCalendarWeekHeader><tr></MTCalendarWeekHeader>
<td <MTCalendarIfToday> bgcolor="#EEEEEE" </MTCalendarIfToday> align="center">
<MTCalendarIfEntries><MTEntries lastn="1"><a href="<$MTEntryLink$>"><$MTCalendarDay$></a></MTEntries></MTCalendarIfEntries>
<MTCalendarIfNoEntries><$MTCalendarDay$></MTCalendarIfNoEntries>
<MTCalendarIfBlank> </MTCalendarIfBlank></td>
<MTCalendarWeekFooter></tr></MTCalendarWeekFooter>
</MTCalendar>
</table>
</div>
</div>

2.スタイルシートの設定

デフォルトのスタイルではうまく表示されないため、下記の青色部分の内容をスタイルシート(styles-site,css または リポジトリの classic.css)に追加します。ここでは styles-site.css への追加イメージを掲載しておきます。

/* This is the StyleCatcher theme addition. Do not remove this block. */
@import url(/../base-weblog.css);
@import url(/../classic.css);
/* end StyleCatcher imports */
 
.module-calendar .module-content {
    margin: 0 -10px 0 2px;
    _margin: 0 -2px 0 -3px;
    padding-bottom: 5px;
    font-size: 9px;
}
.module-calendar .module-content th {
    padding-bottom: 3px;
    font-size: 9px;
    _font-size: 8px;
    width: 20px;
}
.module-calendar .module-content td {
    padding: 2px 0;
    font-size: 9px;
    line-height: 120%;
    _line-height: 100%;
}

なお style-site.css に追加した場合、他のスタイルに切り替えた際に追加部分が消去されると思いますので、classic.css への追加を推奨します。

Comments [4] | Trackbacks [2]
Now loading...
ギターに入った猫
掲載広告募集
Styles
Font Size
Default
For defective color vision
Gray Scale
RGB Color
Search this site

このブログをメールで購読する by:FeedBurner

AMN
Categories
Monthly Archives
2020年
2019年
2018年
2017年
2016年
2015年
2014年
2013年
2012年
2011年
2010年
2009年
2008年
2007年
2006年
2005年
2004年
2003年
BlogPeople
Syndicate this site
FeedBurner(RSS1.0/RSS2.0/Atom)
Counter
これまでのアクセス
Powered by
Movable Type 6.0.3