top

ダイナミックで月送りカレンダー(5) MT4版~現在の月編

これはダイナミックで月送りカレンダー(4) MT4版の改編版です。

081012.gif

MTタグだけで実装できるとても簡単な月送りカレンダーですが、「indexにカレンダーを設置した場合に最新のものではなく、現在の月にしたい」というご質問を受けました。

実はMTにデフォルトで用意されているカレンダーならご要望通りの動きになります。MT標準のカレンダーは「常に現在の月を表示する」仕様になっていますので。しかし標準のカレンダーには月送り機能がありません。しかも記事の有無に関係なく現在の月を表示するため、単純に
<MTArchiveList archive_type="Monthly" lastn="1"><MTArchivePrevious>~では前月へのリンクを出せないというややこしさがありました。

そのためこれまでのカスタマイズでは、index(日付・ブログ記事でないもの)はカレンダーをまるごと<MTArchiveList archive_type="Monthly" lastn="1">で包んでしまうことによって、前月へのリンクを出していました。ただ、この方法では「記事の存在する最新の月」となってしまうため、新しい月に入って記事がまだ1つもない時は前月(月リストの中での最新月)のカレンダーが表示されます。通常はそれで問題ないと思うのですが、もし未来の月に記事があったら? 当然未来のカレンダーが表示されてしまいますよね。前月のカレンダーならともかく、未来のカレンダーはさすがに変ですよね(^^;。

今回の改編版は「未来の月に記事があってもindexでは現在の月が表示されるようにする」ためのものです。以下のようなケースに向いています。(上の見本は現在の月には記事がなく、前後の月に記事がある場合のindexでの表示例です)

  • 未来の記事があってもindex(メイン・カテゴリ)では現在の月を表示させたい。
  • 記事の有無に関係なく、index(メイン・カテゴリ)には月が変わったら常にその月のカレンダーを表示させたい。

以下の特徴を備えています。

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

ダイナミックで月送りカレンダー(4) MT4版と重複している部分がありますが、差分の追記だけでは説明がややこしくなるので、あらためて独立したエントリーとして書き起こしています。なお、ダイナミックで月送りカレンダー(4) MT4版を導入されて改編版に変更される場合は、月移動カレンダーウィジェットは内容に変化ないのでそのまま使えます。

1.ウィジェットの作成
まず、以下の名前でウィジェットを3つ作ります(ウィジェット名は自分で分かりやすいものに変えてもらってかまいません)。

ウィジェット名:月移動カレンダー
(日付・ブログ記事用)

<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>

ウィジェット名:月移動カレンダー現在の月
(メイン・カテゴリ用)

<div class="widget-calendar widget">
<h3 class="widget-header">カレンダー</h3>
<div class="widget-content">
<table summary="リンク付きのカレンダー">
<MTSetVarBlock name="thismonth"><$MTDate format="%Y%m"$></MTSetVarBlock>
<caption>
<MTArchiveList archive_type="Monthly">
<MTUnless name="prev">
<MTSetVarBlock name="prevmonth"><$MTArchiveDate format="%Y%m"$></MTSetVarBlock>
<MTIf name="prevmonth" lt="$thismonth">
<a href="<$MTArchiveLink archive_type="Monthly"$>">&lt;</a>&nbsp;&nbsp;
<MTSetVar name="prev" value="1">
</MTIf>
</MTUnless>
</MTArchiveList>
<$MTDate format="%B %Y"$>
<MTArchiveList archive_type="Monthly" sort_order="ascend">
<MTUnless name="next">
<MTSetVarBlock name="nextmonth"><$MTArchiveDate format="%Y%m"$></MTSetVarBlock>
<MTIf name="nextmonth" gt="$thismonth">
&nbsp;&nbsp;<a href="<$MTArchiveLink archive_type="Monthly"$>">&gt;</a>
<MTSetVar name="next" value="1">
</MTIf>
</MTUnless>
</MTArchiveList>
</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></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>

ちょっと説明。月リストから現在の月に合致したものを表示させる方法だと現在の月に記事がない場合に対応できないので、カレンダー部分はMT標準のものを使用。その場合、MTArchivePreviousが使えないので、それとは別の方法で前後リンクを出しています。ヒントになったのは同一カテゴリー内での前後エントリーへのリンク(3)改。ほとんどそのまま移植してます(青字の部分)。バージョンに依存するタグは使ってないのでMT4ならどれでも動くと思います。未来の月へのリンクは要らない、という場合は青字の<MTArchiveList archive_type="Monthly" sort_order="ascend">~</MTArchiveList>部分をとって下さい。

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

<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>
<$MTInclude widget="月移動カレンダー現在の月"$>
</MTIf>
</MTIf>

*緑字:月アーカイブ用、赤字:ブログ記事用、青字:メイン・カテゴリ(日付・ブログ記事以外)用。

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

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

2.ウィジェットのセット

080822_2.gif

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

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

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

*通常使用される分にはダイナミックで月送りカレンダー(4) MT4版で足りると思いますので、必要に応じてご利用下さい。

 

トラックバックURL

トラックバックされる際にはこの記事へのリンクをお願い致します

トラックバックの一覧

トラックバック MT:デザインはこれでFIX  »» 2008年12月 6日 13:08
カレンダー表示のところをいじくりたかったのですが、どうもうまくいかなかった。カレ...
トラックバック MTのカレンダー  »» 2010年2月 9日 01:19
MT標準のカレンダーはしょぼい。前月・次月へのリンクが無い。コレじゃ困るなぁ・・...

コメント

こんばんわ。
ありがとうございました。できました。
もといろいろと入れていけるようにしたいと思います。
ありがとうございました。

ご希望のことが出来たようでよかったです。
これからもよろしくです。^^

こんばんわ。いつもありがとうございます。

カレンダーうまく動いていてくれてますが。翌月の>をクリックすると一覧表示になってしまいます。「>」をクリックしたときに画面はかわらずにカレンダだけ入れ替わるというのはどうなんでしょうか。

土曜日曜とかの色つけていうのも難しいのでしょうか。

よろしくお願いします。

こんにちは。

>翌月の>をクリックすると一覧表示になってしまいます。
すみません、それはこのカレンダーの仕様です。これは月別アーカイブ頁へ移動するのが目的のカレンダーですので(^^;。

画面は変わらずカレンダーだけを入れ替えるには、カレンダー専用の月別アーカイブを作ってiframeやjavascript(Ajax)で呼び出すという複雑なカスタマイズが必要になります。土日祝日の色分けもjavascriptなどの外部スクリプトを使わないと出来ないので、MTタグだけでは実装出来ません。

iframe版の例(土日の色分けはなし)
http://taeko.w-museum.com/wing/200512251554.html
Ajax版の例(小粋空間様:土日祝日色分け付き)
http://www.koikikukan.com/archives/2007/08/18-033333.php

ただどちらの例もindexの当月表示には対応していません。
土日色なし、iframeでいいのなら、当サイトのiframe版を当月仕様にすることは出来ますが、Ajaxで土日色付きを望まれるなら小粋空間さんのカレンダーを当月表示出来るようにカスタマイズするしかないと思います。小粋空間さんにその要望が可能かどうか問い合わせてみられたらどうでしょうか。

こんにちわ。

ご回答ありがとうございました。

お休みの部分はできればという感じでした。
iframe版でできればお願いしたいと思います。
よろしくお願い致します。

>iframe版でできればお願いしたいと思います。
分かりました。ところでちょっと確認させていただきたいことが。

iframe版は(Ajax版もそうですが)月アーカイブを使ってカレンダーの書き出しを行いますが、月アーカイブには記事のない月の頁を生成する機能はありません。そのため、9月と11月に記事があって10月(現在の月)には記事がない場合、indexを最初に開いた時は10月のカレンダーが表示されても、「<」「>」をクリックしてカレンダーを移動させると、「<」「>」ではもう10月のカレンダーには戻れなくなります。
つまり、9月のカレンダーの「>」をクリックすると11月に飛び、11月のカレンダーの「<」をクリックすると9月に飛ぶことになります。
それでよろしいでしょうか?

こんばんわ。

はい。全く問題ないです。毎月なにかしら入ると思いますので。

よろしくお願いします。

分かりました。
しばらくお待ち下さいね。

<追記>
出来ました。
http://taeko.w-museum.com/wing/200810281347.html

こんにちは!
カレンダー上手く表示できました。
上記のカレンダーを活用して、

<MTMultiBlog include_blogs="2,3">
などのように、複数ブログを指定して、エントリー読込ませたいのですが、どうも上手くゆきません。

記述の方法を教えていただけると、
大変助かります。

どうぞ、宜しくお願いします。

>miyaさん
こんにちは。
これは1つのカレンダーから複数のブログの記事に飛べるようにしたいということでしょうか?

ちょっと試してみたところ、カレンダーでこういう使い方はあまり想定されてないんじゃないか…と思いました。
MTCalendarにはMTMultiBlogタグは上手くきかないようですね。また、MTCalendarにはblogs_ids="1,2"というモディファイアもないようです。miyaさんは具体的にはどこにどういうタグを入れて試されたのでしょう?

また、仮に上手く表示できたとしても、「1つのカレンダーに複数ブログの記事を表示させる」のと「月移動」は上手く両立しないような気がします。

このカレンダーはもともと月移動させるのが目的なので、「前後の月アーカイブ」へ飛ぶ仕様になっています。が、ブログ1には1月の記事がなくブログに2には1月の記事がある場合、移動先はどうしたらいいのでしょう?
ブログ1に1月の月アーカイブがなかったら前年の12月に移動してしまいますから、ブログ1のカレンダーでブログ2の1月の記事を表示するのは不可能になってしまいますよね? それともブログ1からブログ2の1月のアーカイブに飛んでしまっていいのでしょうか?? でもカレンダーの移動先が違うブログになったら閲覧者が混乱しませんか?
それに月アーカイブへ移動した時、そのアーカイブ内で表示されるのはそのブログの記事だけなのに、カレンダーだけ違うブログの記事も表示するのですか?

この辺がちょっとよく分からないので、何故そうしたいのか、その意味と目的なども併せてもう少し詳しくご説明いただけると嬉しいです。

早速回答ありがとうございます。

やろうとしていた事は、イベントカレンダーのようなものです。

ブログID=1では、毎月カレンダー一覧表を生成し、月別移動をさせ、ブログ2.3.4に各コーナー別のイベント情報を登録しておき、ブログ1に読み込ませようと思っていました。

MTCalendar内に、<MTMultiBlog include_blogs="2> <MTEntryTitle></MTMultiBlog><MTMultiBlog include_blogs="3> <MTEntryTitle></MTMultiBlog>など書いても効きませんでした。

やっぱり、カレンダータグとマルチブログタグの併用は、タグの機能的に無理?なんでしょか。。。。><

>miyaさん
なるほど、イベントカレンダーですか。
もしかしてそのカレンダーはイベント専用で、イベント記事だけにリンクを張れればいいのでしょうか? それなら、MTCalendarにはcategory="カテゴリ名"というモディファイアがあるので、例えばイベント情報は全てイベントカテゴリに書いて、
<MTCalendar month="this" category="イベント">
とすればMTMultiBlogを使わなくてもイベント記事専用のカレンダーが作れると思います。イベントカテゴリはブログ1内でカレンダー以外の所では表示させないようにすることも出来ますし。

イベント記事をブログ2で表示させたい時には
<MTEntries lastn="1" blog_ids="1" tags="@ブログ2">
みたいにすれば出来ます。
記事を書くときに、@付きのプライベートタグを設定しておけば、そのブログのイベント記事だけを表示できます。

イベント記事はどうしてもそれぞれのブログ内で書かねばならないのなら、また別の方法を探さねばですが、こういうやり方もあるということで…。

こんにちは、miyaです。
イベントカレンダーですが、カテゴリー化で振分けることにし、月移動も無事にできました。色々とありがとうございました。

ちなみに、マルチブログを使いたかった理由は、イベントが各コーナーで入力項目が若干違うのと、担当者ごとに、編集できるブログを指定したかったのです。

MTまだまだ奥が深いですね。
今回は、本当にお世話になりました。
ありがとうございました。

>miyaさん
カテゴリの振り分けで出来たようでよかったです。^^

なるほど、ブログを分けようと考えられていたのは投稿する方に分かりやすく配慮するためだったのですね。確かにイベント毎に専用の入力コーナーを用意できたら便利でしょうね。

あれから変数を使う方法でカレンダーのMTMultiBlog化に挑戦してみたのですが、やっぱり難しいようでした。MTは本当に奥深しで、うっかり夢中になるとハマってしまいます(笑)。
これからもよろしくお願いします。

MovableTypeを始めたばかりkerokeroと申します。mt カレンダー 月送りで検索してここにたどり着きました。

ダイナミックで月送りカレンダー(4) MT4版では、なぜか最新の月に戻った時にエラーになったので、こちらでやるとうまくいきました。
勉強不足のため今回は、コピペさせていただきました。ありがとうございます。これからは、自分でも勉強していきたいと思っています。コメント書き込みも不慣れなのですが、お礼を述べたくて書き込みました。

>kerokeroさん
こんにちは。お役に立てたようで嬉しいです。^^
(4)MT4版ではエラーになりましたか? 時間のある時にでも調べてみますね。
これからもよろしくお願い致します。

コメントを投稿

 


 <注意>
 ご利用のブラウザ、設定ではコメントのプレビューおよび投稿はご利用になれません。
 コメント投稿の際はお手数ですがjavascriptをオンにして下さい。
 *javascriptオフのまま投稿ボタンを押すと送信内容が消えますのでご注意下さい。