久しぶりにカスタマイズ没頭。
ヘッダーのタイトル「Movable Typeカスタマイズ中です(-_-)v」画像を、時間ごとに差し替えるというJavaScriptにチャレンジです。

画像差し替えは、大昔、自分のサイトでやってました。
最近受けた仕事では、月ごとにFlash画像を差し替えるというのをやってみましたが、これはおもしろかったです。
http://www2.ocn.ne.jp/~sagajyun/
Flashのスクリプトを別jsファイルに置いて、そこに差し替えJavaScriptを別jsファイルから読み込ませて・・・。
プログラマーではないので、高度な事をするとなんか自分すごいじゃんとうぬぼれてしまう。(^_^;)

さて、今回はどうやったかと言うと。

まず、スクリプトを用意。
-------------------------------------
<SCRIPT LANGUAGE="JAVASCRIPT">
<!--
stcnt = 0;
d=new Date();
h=d.getHours();
if (h >= 0 && h <= 4) {img = "サーバ名/img04.jpg";}
if (h >= 5 && h <=11) {img = "サーバ名/img01.jpg";}
if (h >= 12 && h <=16) {img = "サーバ名/img02.jpg";}
if (h >= 17 && h <=21) {img = "サーバ名/img03.jpg";}
if (h >= 22 && h <=23) {img = "サーバ名/img04.jpg";}
document.write('<a href="インデックス"><IMG src="'+img+'" border="0"></a>');
// -->
</SCRIPT>
-------------------------------------

サーバ名は絶対パスで書きました。テンプレートタグを使うといいのでしょうが、その辺はおいおい知識が増えてから。
それから、テンプレートモジュールのバナーヘッダーを書き換えました。div id="header"を残して、すべてを上記JavaScriptと差し替え。
そのあと、各ページのヘッダー部分を、サイドバーを組み込んだ要領でモジュールを呼び出し。
<$mt:Include module="バナーヘッダー"$>

動作確認は、パソコンのコントロールパネルから「日付と時間」を選び、一時的に時間を変えてその時間の画像が呼び出されるか確認します。（確認後元に戻すのを忘れずに。）

さて、この設定で現在4パターンの画像が差し替えられています。
もう少し増やしてみよう。あと、画像ももうちょっとひねりを加えたいものだ。

参考書には載ってないけど工夫を凝らして出来ると、嬉しいものです。
あと1週間は楽しめそう(^^♪