top

ダイナミックで月送りカレンダー(4) MT4版

いや、ダイナミックだけじゃなくて静的生成でも使えますが、タイトルの継承の都合上、こうなっております(^^;。今回の覚え書きは「ダイナミックで月送りカレンダー(3) 非iframe版」の改訂版です。

080822_1.gif

これはごくシンプルで簡単な月送りカレンダーなのですが、１点だけネックがありまして、それが月送り部分を担当しているMTArchivePreviousとMTArchiveNext。
これは本来、日付アーカイブ系の中でしか使えません。そのはずなんですが、過去のバージョンではけっこうブログ記事でも使えてしまっていて（4.1でも動作してました＞汗）、そのおかげで月アーカイブだけでなく「どこでも月移動カレンダー状態」になってしまっていました。
が、さすがに4.2になってタグチェックが厳しくなって、日付系の外で使うとエラーするようになったので（それで当たり前なんですが）、4.2になったのを機に正しく動作するタグ組みに修正しました。

  • 前月・次月のリンクをクリックすると、その月のアーカイブに飛ぶという最も基本的な形の月送りカレンダーです。
  • カレンダー用のアーカイブテンプレートを作る必要がありません。
  • ウィジェットを組み込むだけなので簡単に設置できます。
  • javascriptもAjaxもPHPも使ってないのでどの環境でも使えます。
  • 月別・日別・エントリーアーカイブではその月に合致したカレンダーが表示されます。
  • メインページ・カテゴリでは前月へのリンク付きの最新のカレンダーが表示されます。

ここでは MT4デフォルトで使えるようウィジェットとして作成してますが、もちろんテンプレートに直接書いてもＯＫです。その場合は「カレンダー月移動」ウィジェットの内容を見ながらテンプレートに合わせてカレンダーを条件分枝で囲って下さい。

１．ウィジェットの作成
まず、以下の名前でウィジェットを２つ作ります（ウィジェット名は自分で分かりやすいものに変えてもらってかまいません）。

ウィジェット名：月移動カレンダー

<div class="widget-calendar widget">
<h3 class="widget-header">カレンダー</h3>
<div class="widget-content">
<table summary="リンク付きのカレンダー">
<caption>
<MTArchivePrevious archive_type="Monthly">
<a href="<$MTArchiveLink archive_type="Monthly"$>">&lt;</a>&nbsp;&nbsp;
</MTArchivePrevious>
<$MTCalendarDate format="%B %Y"$>
<MTArchiveNext archive_type="Monthly">
&nbsp;&nbsp;<a href="<$MTArchiveLink archive_type="Monthly"$>">&gt;</a>
</MTArchiveNext>
</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 month="this">
<MTCalendarWeekHeader><tr></mt:CalendarWeekHeader>
<td><MTCalendarIfEntries>
<MTEntries lastn="1"><a href="<$MTEntryPermalink$>" title="<$MTEntryTitle$>"><$MTCalendarDay$></a></MTEntries>
</MTCalendarIfEntries>
<MTCalendarIfNoEntries><$MTCalendarDay$></MTCalendarIfNoEntries>
<MTCalendarIfBlank>&nbsp;</MTCalendarIfBlank></td>
<MTCalendarWeekFooter></tr></MTCalendarWeekFooter>
</MTCalendar>
</table>
</div>
</div>

ウィジェット名：カレンダー月移動

<MTIf name="datebased_only_archive">
<$MTInclude widget="月移動カレンダー"$>
<MTElse>
<MTIf name="entry_template">
<MTSetVarBlock name="thismonth"><$MTEntryDate format="%Y%m"$></MTSetVarBlock>
<MTArchiveList archive_type="Monthly">
<MTSetVarBlock name="month"><$MTArchiveDate format="%Y%m"$></MTSetVarBlock>
<MTIf name="month" eq="$thismonth">
<$MTInclude widget="月移動カレンダー"$>
</MTIf>
</MTArchiveList>
<MTElse>
<MTArchiveList archive_type="Monthly" lastn="1">
<$MTInclude widget="月移動カレンダー"$>
</MTArchiveList>
</MTIf>
</MTIf>

＊緑字：月アーカイブ用、赤字：ブログ記事用、青字：メイン・カテゴリ用

スタイルシートに以下を追加（内容はお好みで）。

.widget-calendar table {
width: 100%;
}
.widget-calendar caption {
text-align: center;
padding-top:5px;
font-size:12px;
}

２．ウィジェットのセット

080822_2.gif

「カレンダー月移動」ウィジェットを好きなところに配置。保存ボタンを押してブログを開けば各頁にカレンダーが表示されてます（静的の場合は再構築が必要です）。

【補足】
カレンダーのリンク先を日別アーカイブに変えたい場合は、テンプレートで日別アーカイブを作成した後、赤字の部分を以下のものと差し替えます。

<MTEntries><MTDateHeader>
<a href="<$MTEntryLink archive_type="Daily"$>" title="</MTDateHeader>[<$MTEntryTitle$>]<MTDateFooter>">
<$MTCalendarDay$></a></MTDateFooter>
</MTEntries>

＊静的生成の場合、日別アーカイブを作ると再構築するファイルが倍近くに増えてMTに負担がかかりますので、注意が必要です。日別アーカイブのように、カレンダーのためだけに存在し滅多にアクセスされないファイルはダイナミックが向いていると思います。

＜追記＞
現在の月を表示する版をエントリーしました。トップページやカテゴリに「最新の月」ではなく「現在の月」のカレンダーを表示したい場合に使えます。

2008年8月23日 14:50 | カレンダー

← 　→

トラックバックの一覧

トラックバック 暦月移動　　»» 2008年10月 9日 20:32
れきげついどう
トラックバック ニュースやらアーカイブをいじる　　»» 2009年1月15日 01:04
どうも、先週はBMメンバーで２日連続ボーリングにいって、２日とも最低スコアが10...
トラックバック Movabletypeを色々いじってみる(覚書)　　»» 2012年2月 4日 12:48
本サイトはMovabletypeというCMSツールを用いて作成しております。かつてはBlog用のツールだったのが、現状としてはBlog以外のページも作れた...

コメント

投稿者 ひこぼし | 2008年10月10日 16:36

すばらしいカレンダーを、ありがとうございます。こういうカレンダーが長年の夢でした。
愚生のブログもこれでカレンダーがきちんと動作するようになりました。
【感謝！】

投稿者 ＴＡＥＫＯ | 2008年10月10日 23:10

こんにちは。
これは移動先を月アーカイブにしてるだけのとても簡単な月移動カレンダーなのですが、レンタルブログなどに最初から付いてるカレンダーではこういう形式がほとんどではないかと思います。
動きが自然で使い良いですよね。^^

投稿者 eri | 2008年10月11日 18:05

こんにちわ。

こちらのほうので試してトップに設置したのですが11月になってしまいました。
まだ、4.1でやってますが4.2にしてから悩んでみたいと思います。

また、よろしくお願いします。

投稿者 ＴＡＥＫＯ | 2008年10月12日 11:13

＞eriさん
こちらのは4.2用に書き直しただけで以前のものと仕様は変わりませんので、11月（未来の月）に記事があれば11月（未来の月）のカレンダーが表示されます。

MT4系ならMTタグだけでご希望のことが出来ますので、「現在の月を表示する版」を新しくエントリーしておきました。
http://wing.w-museum.com/200810121042.html
参考になれば幸いです

投稿者 くろ | 2008年10月16日 21:29

こんにちは。
改訂版より今はコチラの方が気に
入ってます。
ですが、IE6のせいか何なのか、、
カレンダーが左に寄って、しかも
小さい。
スタイルシートでフォントサイズを
イジっても何の変化も見られません。
カレンダーのサイズを大きくしたい
のですが、良い方法はないでしょうか。

投稿者 ＴＡＥＫＯ | 2008年10月16日 23:54

＞くろさん
こんにちは。
スタイルシートの追加は行われてますでしょうか？（ウィジェットセットの図の上にあるcssです）
IE6の後方互換モードで見るとテーブル幅が「width:100%」では少し広がり過ぎかもしれないので、「width:160px～170px」くらいにした方がいいかもしれません。幅の数字はお使いのテンプレート・テーマに合わせて調整して下さい。それでいけると思います。

投稿者 くろ | 2008年10月17日 05:49

早速にありがとうございます。
「デザイン」→「テンプレート」→
「スタイルシート(styles.css)」には
記述加えています。また上にAjaxｶﾚﾝﾀﾞｰの
記述が残ってたので、それは＃でｺﾒﾝﾄｱｳﾄ
して、更にwidthを100%から160pxにも
して、再構築してみましたが、相変わらず
です。。
ま～、オリジナルのものとほぼ同じサイズ
なので、取り敢えず「良し」かも知れ
ません。

投稿者 ＴＡＥＫＯ | 2008年10月17日 12:05

＞くろさん
cssのコメントアウトは「#」ではなくて、「/* コメントアウト部分 */」です。
#をつけたらidへのcss指定になってしまうのではと。
該当頁を見せていただけると原因が分かるかもなのですが…。

デフォルトのテンプレートにはカレンダー用のcssがないので、これだけの記述で足りるのですが、カレンダー用のcssが組み込まれているテンプレートをお使いの場合、tr、th、tdなどにも細かく設定が行われているかもしれないので、その辺も確認してみて下さい。

投稿者 くろ | 2008年10月17日 13:26

オ～ マイ ガッ!! です。
コメントアウトといえば「#」っていう先入観が全てを狂わせていました。。
早速直したら、キチンと枠内に収まって、老眼に優しい状態になってくれました。
本当にありがとうございます。

尚、気付いたのですが、一旦先月のアーカイブに飛ぶと、カレンダー右上の「>」では今月のアーカイブに飛んでしまうので、元のメインページには左上の「←戻る」で戻ることになるんですね、、ってまだどこかオカシイのしょうか？

投稿者 ＴＡＥＫＯ | 2008年10月17日 22:36

＞くろさん
カレンダー無事枠内に広げられたようでよかったです。
先月のアーカイブの「>」が今月のアーカイブに飛ぶのはこのカレンダーの仕様です。メインページには普通にブログタイトルから戻って下さい。
作りが単純な代わりに設置も簡単というのが売り！？なので、申し訳ありませんがそういうことでよろしくです(^^;。

投稿者 くろ | 2008年10月18日 07:10

ご確認ありがとうございました。
ところで、、取り入れさせて頂いた小技大技を忘れない様に、バナーを貼らせて頂きたいのですが
(例えば Wing車Memo)、宜しいでしょうか？

投稿者 ＴＡＥＫＯ | 2008年10月18日 08:39

＞くろさん
はい、ありがとうございます。
バナーは以前作ったものがこの辺↓にあるのでお好きなものをお使い下さい。
http://wing.w-museum.com/200512012056.html
200×40はWingMemo用ではないのでそれ以外なら何でも。

投稿者 くろ | 2008年10月18日 14:42

ご案内ありがとうございます。
ブログ用のものを使わせて頂きます。ありがとうございました。

投稿者 ＴＡＥＫＯ | 2008年10月20日 10:17

＞くろさん
バナーリンクありがとうございます。
これからもよろしくお願い致します。^^

投稿者 ひこぼし | 2008年10月25日 08:17

このカレンダーをありがたく使わせていただいています【感謝！】
ところで、カテゴリーアーカイブスと個別記事のカレンダーの表示は無意味だし紛らわしいので不要だと思うのですが、表示を消す方法をご教授くださると、助かります。
ど～ぞ、おひまな時で結構ですからヨロシクお願いしますm(_ _)m

投稿者 ＴＡＥＫＯ | 2008年10月25日 23:05

＞ひこぼしさん
こんにちは。^^
それでしたら、カレンダー月移動ウィジェットを以下のようにしたらいいと思います。

<MTIf name="datebased_only_archive">
<$MTInclude widget="月移動カレンダー"$>
<MTElse>
<MTIf name="main_index">
<MTArchiveList archive_type="Monthly" lastn="1">
<$MTInclude widget="月移動カレンダー"$>
</MTArchiveList>
</MTIf>
</MTIf>

これで日付アーカイブとメインインデックスだけにカレンダーが表示されると思います。
アーカイブインデックスにもカレンダーを表示させたい場合は
<MTIf name="archive_index">
<MTArchiveList archive_type="Monthly" lastn="1">
<$MTInclude widget="月移動カレンダー"$>
</MTArchiveList>
</MTIf>
を追加してみて下さい。

投稿者 ひこぼし | 2008年10月26日 17:11

お知恵をいただきありがとうございました
結局、カレンダー月移動ウィジェットをいまのところ以下のように変更してみて、一応満足のゆくようになっています。

<MTIf name="datebased_only_archive">
<$MTInclude widget="月移動カレンダー"$>
<MTElse>
<MTIf name="entry_template">
<MTEntries><MTDateHeader>
<a href="<$MTEntryLink archive_type="Daily"$>" title="</MTDateHeader>[<$MTEntryTitle$>]<MTDateFooter>">
<$MTCalendarDay$></a></MTDateFooter>
</MTEntries>
<MTElse>
<MTUnless name="category_archive">
<MTUnless name="entry_archive">
<MTArchiveList archive_type="Monthly" lastn="1">
<$MTInclude widget="月移動カレンダー"$>
</MTArchiveList>
</MTUnless>
</MTUnless>
</MTIf>
</MTIf>

投稿者 ＴＡＥＫＯ | 2008年10月27日 14:04

＞ひこぼしさん
満足いくように出来たようでよかったです。
ところで、個別頁（ブログ記事）のカレンダーですが、その記事の月が表示されませんか？　「個別記事にはその月のカレンダーが表示されてほしい」というのが私のこだわりなので、このカレンダーなら該当月のカレンダーになるはずなのですが…。

もしかして予約変数「entry_template」が正しく動作してないのでしょうか。もしそうなら、ブログ記事テンプレートの一番上に<MTSetVar name="entry_template" value="1">を追加してみて下さい。