SKYNETs_EYE

MovableTypeでカテゴリ名は五十音順でソートされる。
カテゴリに入れ子式にサブカテゴリを設定すればある程度大きな単位でのまとまりができる。
しかし、大見出しであるカテゴリは好きな並びにできないし、複数作ったサブカテゴリも任意にソートできない。

また、サブカテゴリでも同名をつけた場合、MovableType上では認識できるが、ecto上では同じ名前で違いがわからなくなってしまう。
例えばこのサイトで「Diablo_コラム」を「コラム」という名前だけにしたら、「Diary」の「コラム」との違いがecto上では解らなくなる。

かといっていちいち大見出しを受けた名前に設定するとカラムの幅が間に合わず複数行で表示されて見苦しい。

こういう場合、任意のソートの実現も含めてカテゴリ名の頭にソートしたい順番で任意の数字を振っていくやり方がよい。
例えば、このサイトだと 一番エントリ数の多い 「Diary」を頭に持ってきたい。
(現在の「Cinema」が頭にあるのは別に私が映画好きで仕方がないからという訳ではなく単に五十音順でこうなっていただけのことだ。)

その場合 01Diary 02Internet ....と 頭に数字を入れればこちらの希望通りにソートしてくれる。

でもこのやり方だと頭の数字がいかにも見苦しく、名前が長いとカラムの幅からはみ出る可能性もある。
でも、みんな同じ事で悩んでいるようで、カテゴリ名の頭にある数字だけ見えなくするプラグインがあったので導入してみた。

●MovableTypeのカテゴリーソートに使える数字置換プラグイン
MTタグで表示されるカテゴリー名などの先頭部分に付けた数字を任意の文字列に置き換えるプラグインです。実験的に作ったもので、内容はPerlで置換してるだけの至って簡単なものですが、これを使うとカテゴリーの順番を自分の好きなように並び替えることが出来ます。

他のサイトでよく紹介されている「カテゴリーの説明」部分を使う方法ではないので「説明欄」もそのまま使えます。MTのカテゴリーはASCII配列順で強制的にソートされてしまうのでなんとも気分が悪い!だからといって「カテゴリーの説明」部分をつぶすのもイヤなので作ってしまいました。そー

【使用例】
カテゴリータイトル入力の際に「010)カテゴリータイトル」のように頭に数字とカッコを付ければMTは先頭の数字順に勝手に並べ替えてしまいます。この性質を利用すれば数字の付け方で並び順を自由にコントロールできます。 ただこのままでは頭に数字が付いていて見た目が悪いですね。

そこでこのプラグインは何をするかというと、

「頭の数字とカッコを違う文字に置き換える」ということをやります。
★や■などのリストマークに置き換えることも出来ますし、「空白」に置き換える指定をすれば数字を消す事も出来ます。
プラグイン自体のサイズも極限まで小さくしてますので軽快高速です。

【ダウンロード】
pmHeadChanger Ver.1.2(※MT ver.3.2ja2まで動作確認済)

Ver.1.2 up date = 2006/04/14
・半角数字と-の組み合わせ(例:123-タイトル)でも使えるようにしました。
・文字コードごとに3つの実行ファイルを用意していたのをやめて1つにしました。



【設置方法】
解凍してpm_headchanger.plをMTインストールディレクトリーのpluginsディレクトリーにアップロードして、パーミッションを「755」もしくは「705」にします。アップロード後、「システム・メニュー」の「プラグイン」ページを開いて、pmHeadChanger バージョン 1.2 が表示されていればプラグインとして認識されています。

【指定方法】テンプレートのMTタグにパラメータを追記するだけです。
例 : 頭に付けた数字部分を★印に変えたいなら

<$MTCategoryLabel$> → <$MTCategoryLabel pmhc="★"$>

結果はこうなります↓

010)カテゴリータイトル1 → ★カテゴリータイトル1

例 : 数字部分を表示したくない場合は、pmhc=""と指定します。
カテゴリーページのタイトルとかはこの方が良いかもしれません

<$MTArchiveTitle$> → <$MTArchiveTitle pmhc=""$>

結果はこうなります↓

010)カテゴリータイトル1 → カテゴリータイトル1

※半角数字と)の組み合わせに反応します。頭の数字は何桁でもかまいません。(現バージョンでは半角数字と-にも対応しています。)

とりあえずはメインページ、カテゴリーアーカイブ、個別エントリーアーカイブ、日付アーカイブの各テンプレートのMTCategoryLabelと MTArchiveTitleのすべてにパラメータを追記すればいいと思います。手作業でやってもしれてますがエディタの検索や置換機能を使って書き換えれば楽ちんです。 最後に再構築して完了です。

一部、テンプレートのタグにパラメータを追加する必要があったので、備忘録として個々に貼り付けておく。

<MTSubCategories pmhc="">
<MTSubCatIsFirst><ul class="tree"></MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li class="tree<MTSubCatIsLast>_end</MTSubCatIsLast>"><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><MTCategoryLabel pmhc=""></a> [<$MTCategoryCount$>]
<MTElse>
<li class="tree<MTSubCatIsLast>_end</MTSubCatIsLast>"><MTCategoryLabel pmhc="">
</MTElse>
</MTIfNonZero>
<MTSubCatsRecurse max_depth="3">
</li>

試験的に導入してみたが、ちゃんとDiaryが頭に来るようになった。
これさえできれば、カテゴリ分けをもっと細かく設定できる。
以前にも書いたがMovableTypeなどのブログシステムは所詮、つまるところ「データベース」なのである。
そしてデータベースで何が肝要かというと、適切なカテゴリ分けである。
適切な入れ物(カテゴリ)があって初めて様々なデータを放り込めるのである。
そうして一見、関係のなさそうなエントリを自動的に繋げて見せてくれることが次世代サイト「SKYNET's SYNAPSE」の基本構想である。
これからエントリの多い物に関しては更に分割したりとカテゴリ分けをもう一度見直して、より使いやすいサイトを目指してゆこうと思う。

MovableTypeを3.2.2jpに戻した後に、しばらくテンプレートをいじくっていたが、その時の何かの手違いで中のcgiの一部が動かなくなっていた。
まぁ前の安定稼働時のテンプレートのバックアップがあるからそれに戻せばいいじゃんと気軽に復元した。
おかげでcgiプログラムが無事に動くことを確認して安心したのだが、それもつかの間、今度は管理画面からテンプレートのページが表示できなくなってしまった。

テンプレートのボタンを押すと

maketext doesn't know how to say: _SYSTEM_TEMPLATE_SEARCH_TEMPLATE as needed at lib/MT.pm line 859

というエラーが表示されて、それから先には進めない。

訳がわからないのでくだんのエラーログでググって調べた結果,それは3.3と3.2のテンプレート編集の違いによるものらしいと判明した。
共通しているのが、ちょっと試しにVer3.3にして、それから3.2に戻した人に発生している。

実は3.3から検索用のテンプレートを管理画面のテンプレートでカスタマイズできるようになっている。
一方3.2では該当するテンプレートをローカルでカスタマイズして、ホストにUPする方法である。

それで3.2が無いはずの検索用テンプレートを読み込もうとしてひっかかっていると推測した。
テンプレートバックアップログを読んでみるとそれっぽい箇所を見つけた。

テンプレート40「検索結果」を「tmpl40.cgi」にバックアップしました

そこで、以前にバックアップを取っていた3.2.1標準のテンプレートで復元をしてみた。
これでテンプレート編集画面が無事に表示されればめでたしなのだが、現実はそうではなかった。
やはり、いろんなところで話が上がっている通り、データベースファイルそのものが3.3特有の物に変えられてしまったらしい。

で、ここでいつもだったらMovableType3.3.3がリリースされたことだし、そのままアップしちゃうかって流れになるのだが、あいにく今はそんな暇はない。
第一、以前に3.3.2が私の環境ではいまいち不安定でで3.2.2に戻した経緯がある。
ここはもうテンプレートをいじれなければいじれないで良いじゃん。というちょっと諦観の境地でこのまましばらくは運用したいと思う。

昨日実現したばかりのサイドメニューのツリー化だが、JavaScript を用いずに実現する方法が見つかり、本日、小粋空間さんのサイトで発表された。

この方法は JavaScript を用いたカスタマイズと比較して、下記のメリットがある。

• ブラウザで JavaScript を OFF にしている場合でもツリー表示が可能
• JavaScript 起動による表示遅延がなし
• JavaScript 関連のカスタマイズが不要

昨日の今日で、設置したばかりのツリー機能は1日も使っていないのだが、より良い方法が見つかればそれを使わない手はない。
実際にページリロード後にツリーの表示だけワンクッション置かれることが気になっていた。
まったくこの種の技術は日進月歩で予断を許さない。

1.基本的な設定方法
JavaScript を用いないため、ul 要素、li 要素に class 属性を記述する。

ul 要素:class="tree" を追加
li 要素:class="tree[MT開始タグ]_end[MT終了タグ]" を追加

Categories(カテゴリーリスト:サブカテゴリー表示)

<MTSubCategories>
<MTSubCatIsFirst><ul class="tree"></MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li class="tree<MTSubCatIsLast>_end</MTSubCatIsLast>"><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><MTCategoryLabel></a> [<$MTCategoryCount$>]
<MTElse>
<li class="tree<MTSubCatIsLast>_end</MTSubCatIsLast>"><MTCategoryLabel>
</MTElse>
</MTIfNonZero>
<MTSubCatsRecurse max_depth="3">
</li>
<MTSubCatIsLast></ul></MTSubCatIsLast>
</MTSubCategories>

CSS設定項目

ul.tree {
margin: 0!important;
padding: 0!important;
font-size: 9px;
list-style: none!important;
}
ul.tree ul {
margin: 0!important;
padding: 0!important;
}
ul.tree li {
margin: 0!important;
padding: 0 0 0 16px!important;
background-image: url(tree_lst.gif);
background-repeat: no-repeat!important;
list-style: none!important;
}
ul.tree li.tree_end {
background-image: url(tree_end.gif);
list-style: none;
}

JavaScript を用いる場合のCSSとほぼ同じだが、一番最後のセレクタ名(tree_end)だけが異なっている。

参考:ツリー表示の仕組み

ツリー化を行うために、「順序無しリスト(ul - li)」を利用する。
通常の順序無しリストは左側にリストマークが表示されるが、ツリー化ではリストマークを非表示にし、その代わりにツリー画像("├" または "└")を、CSS の background-image プロパティを利用して表示する。

全てのリストに同じ画像を表示するのであれば簡単なのだが、ツリーの最後に "└" を表示するため、下記のように最後の li 要素に class 属性の指定が必要になる。

<ul>
<li>aaa</li>
<li>bbb</li>
<li class="tree">ccc</li>
</ul>

この class 属性によりどちらのツリー画像を表示するか判別する。
例えば class 属性がない li 要素には途中の画像 "├" を表示し、class 属性がある場合は最後の画像 "└" を表示する。

JavaScript を利用したツリー化のカスタマイズでは、JavaScript 実行により class 属性を付与している。
(したがってブラウザの「ソースの表示」では class 属性が設定されていないようにみえる)

早速反映してみて、表示速度が上がった事を確認した。
ツリーの横棒と文字の間隔がJavaScriptを用いたときよりも若干離れているがこれはulタグを使うためだろう。
全体の表示レスポンスを考慮に入れても気にするほどのことはないと思う。

MovableType3.2からは標準でカレンダ表示をしなくなってしまった。
タグや表示するための機能は保持しているのだが、おそらくカレンダから日別のエントリを表示する場合
その日ごとのhtmlページを用意しなくてはならず、システム全体のレスポンスを気にしてのことだろう。
加えて別の見方をすれば、MT自体がCMS化の流れもあるらしく、ブログらしい外観のカレンダを非表示することでイメージを変えたい狙いもあると思うのだが。

私自身はカレンダ機能はよく使う。
別にその日を決め打ちしてページの表示をすることはあまりないのだが、カレンダの投稿日の変化で更新の頻度が一目で解るので重宝している。
自分の努力が目に見える形で表示されると頑張り甲斐があるというものである。
逆にさぼっているとその期間だけ色が塗られておらず少々寂しくなる。
毎日更新のモチベーション維持にもカレンダ表示はやはり必要だと思う。

でもMTの標準ではカレンダは当月のみの表示である。
先月以前の物をカレンダとして表示する場合、ちょっとした工夫が必要である。
小粋空間さんのところでそのやり方が解説されている。
そのままでだとちょっとデザイン的に馴染まないので、このサイト向けに少しコードをいじった。

<!-- カレンダー開始 -->
<MTIfArchiveTypeEnabled archive_type="Daily">
<div class="side">
<div class="calendar">
<table summary="投稿した日にリンクする月別のカレンダー">
<div class="sidetitle">
<MTArchivePrevious><a href="<$MTArchiveLink$>">?</a> </MTArchivePrevious>
<$MTCalendarDate format="%B %Y"$>
<MTArchiveNext> <a href="<$MTArchiveLink$>">?</a></MTArchiveNext>
</div>
<tr>
<th abbr="Sunday"><span class="calendar"><span class="holiday">Sun</span></span></th>
<th abbr="Monday"><span class="calendar">Mon</span></th>
<th abbr="Tuesday"><span class="calendar">Tue</span></th>
<th abbr="Wednesday"><span class="calendar">Wed</span></th>
<th abbr="Thursday"><span class="calendar">Thu</span></th>
<th abbr="Friday"><span class="calendar">Fri</span></th>
<th abbr="Saturday"><span class="calendar"><span class="saturday">Sat</span></span></th>
</tr>

<MTCalendar month="this">
<MTCalendarWeekHeader><tr></MTCalendarWeekHeader>
<td><MTCalendarIfBlank><MTElse><span class="calendar"></MTElse></MTCalendarIfBlank><MTCalendarIfEntries>
<MTEntries sort_order="ascend">
<MTDateHeader><a href="<$MTEntryPermalink archive_type="Daily"$>" title="</MTDateHeader><$MTEntryTitle$><MTDateFooter>" target="_top"><$MTCalendarDay$></a><MTElse> / </MTElse></MTDateFooter>
</MTEntries>
</MTCalendarIfEntries><MTCalendarIfNoEntries><$MTCalendarDay$></MTCalendarIfNoEntries><MTCalendarIfBlank>
<MTElse></span></MTElse></MTCalendarIfBlank></td><MTCalendarWeekFooter></tr></MTCalendarWeekFooter></MTCalendar>
</table>
</div>
</div>
</MTIfArchiveTypeEnabled>
<!-- カレンダー終了 -->

<script type="text/javascript">
<!--
data = new Date();
year = data.getYear();
year = (year < 2000) ? year + 1900 : year;
month = data.getMonth() + 1;
date = data.getDate();
table = document.getElementById('calendarTable');
flag = 0;
summary = table.getAttribute('summary');
text = year + '年' + month + '月';
if (summary.indexOf(text) != -1) {
elements = table.getElementsByTagName('span');
for(k = 0; k < elements.length; k++) {
if (elements[k].childNodes){
if((elements[k].childNodes)[0].nodeName == 'A') {
if((elements[k].childNodes)[0].innerHTML == date) {
elements[k].parentNode.setAttribute('class','today');
elements[k].parentNode.setAttribute('className','today');
}
} else {
if (elements[k].innerHTML == date) {
elements[k].parentNode.setAttribute('class','today');
elements[k].parentNode.setAttribute('className','today');
}
}
}
}
}
//-->
</script>

ただし、月送りが出来るのは月別アーカイブのページのみで、indexページでは表示しない。

友人の音声ファイルデータベース作成のテストをするために試験的にカテゴリを増やしてみた。
カテゴリリストが増えると階層構造が把握しにくくなる。
そこでカテゴリリストのツリー化をすることにした。

ツリー化にはJavaScriptとCSSで実現する。
ツリーその物の部分はgif画像で表示する。

詳細は小粋空間さんのところで書かれているので、ここではメモ書き程度にとどめる。

1.まずはJavaScriptのmaketree.jsの内容をコピペしてtextに保存する.
エンコードはUTF-8。

ファイル名をmaketree.js と保存して、自分のサーバーのBlogディレクトリに置いておく。

2.ツリー表示するページのテンプレートコードを一部追加。

<head>~</head> の間に下記のタグを追加する。

<script type="text/javascript" src="<$MTBlogURL$>maketree.js" charset="utf-8"></script>

サブカテゴリの表示部分を下記に書き換える。

<div class="side">
<div id="categories">
<MTSubCategories>
<MTSubCatIsFirst><ul></MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><MTCategoryLabel></a> [<$MTCategoryCount$>]
<MTElse>
<li><MTCategoryLabel>
</MTElse>
</MTIfNonZero>
<MTSubCatsRecurse max_depth="3">
</li>
<MTSubCatIsLast></ul></MTSubCatIsLast>
</MTSubCategories>
</div>
</div>

<script type="text/javascript">
<!--
generateSubcategoryTree();
//-->
</script>

3.スタイルシートに以下のコードを追加

ul.tree {
margin: 0px!important;
padding: 0px!important;
font-size: 9px;
list-style: none!important;
}
ul.tree ul {
margin: 0px!important;
padding: 0px!important;
}
ul.tree li {
margin: 0px!important;
padding: 0px 0px 0px 16px!important;
background-image: url(tree_lst.gif);
background-repeat: no-repeat!important;
list-style: none!important;
}
ul.tree li.end {
background-image: url(tree_end.gif);
list-style: none;
}

あとはコードに指定されているgif画像、tree_list.gif , tree_end.gif をダウンロード。
これをベースに自分のサイトに合うように加工を加える。

私のサイトはかなり薄めのデザインにしているからそのままではちょっと濃すぎて使いもににならない。
「ツリーを採用しましたっ!」となんて主張はいらないのでほのかに見える程度に色を調整した。
どちらかというとこの調整が一番時間がかかったくらい他の作業は楽にこなせた。

以上でツリー表示になった。
あとはアーカイブページにも同じ処理をすればメニューのあるところは全てツリー表示になる。

ツリー表示にはこのほかに月別アーカイブにも可能らしいが、今のところ昨年の12からのエントリしかないので必要はない。
もう少し数が増えて全体感が把握しにくくなったら採用しようと思う。

つぎはサブカテゴリの折りたたみ化に挑戦してみよう。

・画像のポップアップウィンドウのテンプレート

アーカイブの画像ポップアップテンプレ
そのままでも十分だが右上のクローズボックスをクリックしなくても
画像クリックでウィンドウ閉じます。

<html>
<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
<a href="" onclick="window.close()"><img src="<$MTImageURL$>" width="<$MTImageWidth$>" height="<$MTImageHeight$>" border="0" /></a>
</body>
</html>

・メインページ::カテゴリ内のエントリ数表示

<div id="categories">
<h2>カテゴリー</h2>
<MTSubCategories>
<MTSubCatIsFirst><ul></MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><MTCategoryLabel></a> (<MTCategoryCount>)
<MTElse>
<li><MTCategoryLabel>
</MTElse>
</MTIfNonZero>
<MTSubCatsRecurse max_depth="3">
</li>
<MTSubCatIsLast></ul></MTSubCatIsLast>
</MTSubCategories>
</div>

・メインページ::最近のコメント表示

<h2>最近のコメント</h2> <ul> <MTEntries recently_commented_on="10"> <li><a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a><br /> <MTComments lastn="5"> └ <$MTCommentAuthor$> <a href="<$MTEntryPermalink$>#c<$MTCommentID$>">at <$MTCommentDate format="%Y.%m.%d"$></a><br /> </MTComments></li> </MTEntries> </ul>

まぁ一般的なブログで備えている機能なので、対応させておいた方が良いのだろう。

ブログをメモ用のデータベースとして使いやすいものにするべく
やはりカレンダーも月送りになった方が良いだろうとやり方を調べてみた。
MovableTypeにはその機能を備えているものの、ディフォルトのテンプレートでは使われていないらしい。
まずは、カレンダーの表示箇所を他を参考にしながら以下の通りに書き換えてみた。
併せて、アーカイブのテンプレートも2コラム形式に書き換えてカレンダーを表示させるようにしてみた。
ただしメインページからいらないと思われる項目は削っておく。
(カウント・最近の投稿・google検索)

<h2 class="module-header">カレンダー</h2>
<div class="module-content">
<div id="calendar">
<MTArchiveList archive_type="Monthly" lastn="1">
<table summary="投稿されたエントリーへのリンク付き月間カレンダー">

<caption>
<MTArchivePrevious>
<a href="<$MTArchiveLink$>" title="<$MTArchiveTitle$>">&laquo;&#160;</a>
</MTArchivePrevious>
<$MTArchiveTitle$>
<MTArchiveNext>
<a href="<$MTArchiveLink$>" title="<$MTArchiveTitle$>">&#160;&raquo;</a>
</MTArchiveNext>
</caption>

<tr>
<th abbr="日曜日">sun</th>
<th abbr="月曜日">mon</th>
<th abbr="火曜日">tue</th>
<th abbr="水曜日">wed</th>
<th abbr="木曜日">thu</th>
<th abbr="金曜日">fri</th>
<th abbr="土曜日">sat</th>
</tr>

<MTCalendar month="this">
<MTCalendarWeekHeader><tr></MTCalendarWeekHeader>
<td<MTCalendarIfToday> class="today"</MTCalendarIfToday>><MTCalendarIfEntries><MTEntries lastn="1"><a href="<$MTEntryPermalink$>"><$MTCalendarDay$></a></MTEntries></MTCalendarIfEntries><MTCalendarIfNoEntries><$MTCalendarDay$></MTCalendarIfNoEntries><MTCalendarIfBlank> </MTCalendarIfBlank></td><MTCalendarWeekFooter></tr></MTCalendarWeekFooter>
</MTCalendar>
</table>
</MTArchiveList>
</div>
</div>

う~んこうれだと前月の内容を表示させても今月のカレンダーを表示してしまうのね。
しょうがないので更にいじってみる。
幸い、月送りのカレンダーの設定方法が細かく書かれたサイトがあったのでそのまま引用させていただく。
引用: 小粋空間:月送りカレンダー

1.カレンダー用ディレクトリ設定
Movable Type、管理メニューの「設定」→「公開」の「アーカイブの設定」にチェックをいれ、その下に表示されたフォームに下記の内容を設定する。

アーカイブURL:http://ブログURL/archives/
アーカイブパス:アーカイブURLまでのパス

例えば当サイトであれば

アーカイブURL:
http://y-sky.net/blog/archives/
アーカイブパス:
/home/sites/lolipop.jp/users/lolipop.jp-dp08079804/web/blog/archives

という具合になる。

2.カレンダー用スタイルシート作成
管理メニューの「テンプレート」→「インデックス」→「テンプレートを新規作成」をクリック。
次画面で下記を設定する。
設定が終わったら「保存」をクリック。

テンプレートの名前:style-calendar
出力ファイル名:calendar.css
テンプレートの中身:下記

@charset "utf-8";

body {
margin: 0;
padding: 0;
font-family: Verdana, Arial, sans-serif;
}

.calendar {
color: #444444;
text-align: center;
}

.calendarhead {
font-size: 9px;
letter-spacing: .2em;
}

.calendar table {
padding: 0;
border-collapse: collapse;
}
.calendar th {
padding-top: 5px;
font-size:8px;
width : 20px ;
}

.calendar td {
padding: 2px 0;
font-size:10px;
line-height: 120%;
}

.today {
display: block;
border: 1px solid #444444;
}

.holiday {
color: #e50003;
}

.saturday {
color: #0000ff;
}

3.カレンダー用アーカイブテンプレート作成
管理メニューの「テンプレート」→「アーカイブ」→「テンプレートを新規作成」をクリック。
次画面で下記を設定する。
設定が終わったら「保存」をクリック。

テンプレートの名前:カレンダー
テンプレートの内容:下記(本日の日付部分がboldになるように記述)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0/ Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" /><title><$MTBlogName$></title>
<link rel="stylesheet" href="<$MTBlogURL$>calendar.css" type="text/css" />
</head>
<body >
<div class="calendar">
<table summary="<$MTArchiveDate format="%Y/%m"$>">
<caption class="calendarhead">
<MTArchivePrevious>
<a href="<MTBlogURL>archives/calendar/<MTArchiveDate format="%Y/%m/index">.html"><</a>
</MTArchivePrevious>
<$MTArchiveDate format="%B %Y"$>
<MTArchiveNext>
<a href="<MTBlogURL>archives/calendar/<MTArchiveDate format="%Y/%m/index">.html">></a>
</MTArchiveNext>
</caption>
<tr>
<th abbr="Sunday" ><span class="holiday">Sun</span></th>
<th abbr="Monday" >Mon</th>
<th abbr="Tuesday" >Tue</th>
<th abbr="Wednesday" >Wed</th>
<th abbr="Thursday" >Thu</th>
<th abbr="Friday" >Fri</th>
<th abbr="Saturday" ><span class="saturday">Sat</span></th>
</tr>

<MTCalendar month="this">
<MTCalendarWeekHeader><tr></MTCalendarWeekHeader>
<td><MTCalendarIfBlank><MTElse><span<MTCalendarIfToday> class="today"</MTCalendarIfToday>></MTElse></MTCalendarIfBlank><MTCalendarIfEntries>
<MTEntries lastn="1">
<a href="<$MTEntryLink archive_type="Daily"$>" target="_top"><$MTCalendarDay$></a>
</MTEntries>
</MTCalendarIfEntries><MTCalendarIfNoEntries><$MTCalendarDay$></MTCalendarIfNoEntries><MTCalendarIfBlank>
<MTElse></span></MTElse></MTCalendarIfBlank></td><MTCalendarWeekFooter></tr></MTCalendarWeekFooter></MTCalendar>
</table>
</div>
</body>
</html>

4.ファイルの関連付け
予め、管理メニューの「設定」→「公開」の「アーカイブ・マッピング」の項目の右側にある「マッピングを新規作成 」をクリックして下記の設定を実施する。

アーカイブの種類:月別(またはMonthly)
テンプレート:カレンダー
設定後、「追加」をクリック。
正常に保存されると下の「月別」の欄にカレンダーテンプレートが追加される。
追加された部分の設定は下記の通り。

ラジオボタン:日付アーカイブ(またはDate-Based Archive)のまま出力フォーマット:下記

calendar/%y/%m/index.html

5.カレンダーの設置
「テンプレートの編集」 で各テンプレートのカレンダー表示用タグを削除し、下のタグと入れ替えてる。

<div align="center" class="side">
<iframe name="cal-iframe" src="<MTBlogURL>archives/calendar/<MTDate format="%Y/%m/index">.html" width="150" height="115" scrolling="NO" frameborder="0" marginwidth="0" marginheight="0">
</iframe>
</div>

6.サイトの再構築