トップページに表示させているカレンダーが当月分しか表示できなくていまいちなので、diving to ...: 月間移動可能なMovableTypeのカレンダーを参考にしてカレンダーを作り変えてみた。
下記の様に設定したアーカイブテンプレート"calendar"をまず用意する。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1./ Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" /> <title><$MTBlogName$></title> <link rel="stylesheet" href="<$MTBlogURL$>styles-cal.css" type="text/css" /> <MTBlogIfCCLicense> <$MTCCLicenseRDF$> </MTBlogIfCCLicense> </head> <body> <div id="calendar" align="center"> <table table width="160" border="0" cellspacing="4" cellpadding="0" summary="投稿されたエントリーへのリンク付き月間カレンダー"> <caption> <MTArchivePrevious> <a href="<MTBlogURL>archives/calendar/<MTArchiveDate format="%Y/%m/index">.php"> <<</a> </MTArchivePrevious> <$MTArchiveDate format="%B %Y"$> <MTArchiveNext> <a href="<MTBlogURL>archives/calendar/<MTArchiveDate format="%Y/%m/index">.php"> >></a> </MTArchiveNext> </caption> <tr height="20"> <th abbr="Sunday" align="center">日</th> <th abbr="Monday" align="center">月</th> <th abbr="Tuesday" align="center">火</th> <th abbr="Wednesday" align="center">水</th> <th abbr="Thursday" align="center">木</th> <th abbr="Friday" align="center">金</th> <th abbr="Saturday" align="center">土</th> </tr> <MTCalendar month="this"> <MTCalendarWeekHeader><tr></MTCalendarWeekHeader> <td align="center"><span class="calendar"> <MTCalendarIfEntries><MTEntries lastn="1"> <a href="<$MTEntryLink archive_type="Daily"$>" title="[<$MTEntryTitle$>]" target="_top"> <$MTCalendarDay$></a> </MTEntries></MTCalendarIfEntries> <MTCalendarIfNoEntries><$MTCalendarDay$></MTCalendarIfNoEntries> <MTCalendarIfBlank> </MTCalendarIfBlank></span></td> <MTCalendarWeekFooter></tr></MTCalendarWeekFooter> </MTCalendar> </table> </div> </body> </html>
で、"ウェブログの設定"-"アーカイブの設定"ページの、"新しく、テンプレートとアーカイブを関連付ける。"の項目で、"アーカイブの種類"を"月別"に、"テンプレート"を"Calendar"にして追加。
さらに、下記のようなCalendarページ用スタイルシートをテンプレートで定義。
body { margin: 0px 0px 0px 0px; background-color: #FFFFFF; text-align: center; } a { text-decoration: underline; } a:link { color: #8FABBE; } a:visited { color: #8FABBE; } a:active { color: #8FABBE; } a:hover { color: #006699; } #calendar { line-height: 140%; color: #666666; font-family: Verdana, Arial, sans-serif; font-size: x-small; padding: 2px; text-align: center; margin-bottom: 20px; } #calendar table { padding: 2px; border-collapse: collapse; border: 0px; width: 100%; } #calendar caption { color: #666666; font-family: Verdana, Arial, sans-serif; font-size: x-small; text-align: center; font-weight: bold; text-transform: uppercase; letter-spacing: .3em; } #calendar th { text-align: center; font-weight: normal; } #calendar td { text-align: center; }
あとは"Main Index"テンプレートの適当な場所に下記のタグを貼って再構築すれば完成。
<div align="center"> <iframe class="calendar" src="<MTBlogURL>archives/calendar/<MTDate format="%Y/%m/index">.php" scrolling="no" frameborder="0" marginwidth="0" marginheight="0"></iframe> </div>
いつ更新をサボったのか分かり易くなってしまったのがまずいな。
コメントする