ガーデンカフェの雑記帳: テンプレート変更箇所（その１）

ここからは、「小粋空間」でどのエントリーを使って変更したかのみお伝えします。

ここまで変更できたあなたは、それだけで簡単に理解できると思います。

１． Top ＞ Movable Type ＞カスタマイズ＞ツリー化＞ JavaScript 不要なサイドメニューのツリー化 for Movable Type

何も難しいところはありません。

４．ツリー画像のダウンロード

でダウンロードした画像ファイルの名前

実線：tree_lst_solid.gif / tree_end_solid.gif

点線：tree_lst_dotted.gif / tree_end_dotted.gif

それぞれ、tree_end.gif とtree_lst.gifに変えてください。

これは、

３．CSS （全リスト共通）の

ul.tree li {

margin: 0!important;

padding: 0 0 0 16px!important;

background-repeat: no-repeat!important;

list-style: none!important;

}

ul.tree li.tree_end {

list-style: none;

}

に合わせるためです。

この設定だと、ブログのルートフォルダ「blog」にアップロードします。

例えば、「/blog/images/system」に一括してシステムに関係する画像を置いておく場合なら、

となります。

「ｕｒｌ（．／　・・・・・」　と見えにくいですが、“．”小文字のドットが入ります。

この小文字のドット１つは、カレントフォルダをさします。「今いるフォルダから」と考えます。

２． Top ＞ Movable Type ＞カスタマイズ＞新着表示＞新着エントリーのあるカテゴリーに New マークをつける

ここも、難しいところはありません。

よかったら、｢イの葉｣が使っている“ＮＥＷ！！”マークnew.gifを使ってください。

ちなみに、これ「ヤフー！」のＮＥＷ！マークに　＋　！したものです。一応作ったので著作権違反はないかと。（笑）

３． Top ＞ Movable Type ＞カスタマイズ＞ PHP化＞ Movable Type の PHP化（その1）

ここも、難しいところはありません。ただここは、ページが５ページに分割されているので注意して下さい。

ちなみに、（その２）がありますが、できませんでした。

Movable Type の PHP化（その2：.html のままPHPを有効にする）

４．カレンダーについて

公開テンプレートでもカレンダーをサポートしています。ただし、以下の設定を行うことでカレンダーは表示されます。設定を行わないと表示されません。

管理画面にある「設定」→「公開」の順にクリックし、次ページの下にある「アーカイブのマッピング」で「日別」の左側にチェックをつけて保存し、再構築してください。

注意：このカレンダーは、月送り機能がありません。

５． Top ＞ Movable Type ＞カスタマイズ＞カレンダー＞月送りカレンダー

ここも難しいところはありませんが、「アーカイブの設定」による違いを見ていきましょう。

「小粋空間」の「１．アーカイブテンプレート用ディレクトリ設定」より

１．１バージョン 3.2 以降

ここにチェックを入れる前は、管理画面は以下のようになっています。

この状態では、ディレクトリ「blog」の中は下記のようになります。

それでは、「アーカイブの設定」にチェックを入れて、「アーカイブURL」と「アーカイブ・パス」を設定し、再構築すると、

下記画像のように、「archives」の下に上記画像（2つ前）の青印部か生成されます。

ここで注意は、ここで設定したからといって、青印部が削除されるわけではありません。MovableTypeには、フォルダの削除機能は無いはずです。

「blog」フォルダがすっきりしました。（ffftpで削除してかまいません。心配なら削除対象のフォルダを任意の名前に変更して、問題が無いことを確かめてから、削除してください。）

２．カレンダー用スタイルシート作成

手順通りに行ってください。

２．１バージョン 3.2 以降

３．カレンダー用アーカイブテンプレート作成

手順通りに行ってください。

３．１バージョン 3.2 以降

ここで注意です、「リスト２：カレンダー用アーカイブテンプレート」を下記のように作成しますが、ここまででPHP化していますので、下の画像の青印部分のようにhtmlからphpに変更してください。

４．ファイルの関連付け

手順通りに行ってください。

４．１バージョン 3.2 以降

下の画像のように、黄印部のラジオボタンはそのまま、青印を「calendar/%y/%m/%i」に変更して、保存します。

この時点で再構築をしても、ブログ自体に変化はありません。あとは、「５．カレンダーの設置」の通りに、各テンプレートにカレンダーを設置することにより、カレンダーが表示されます。

「再構築」すると「blog/archives」フォルダに「calender」フォルダが作成されます。

５．カレンダーの設置

手順通りに行ってください。

「小粋空間」の「５．カレンダーの設置」は、ｐｈｐ化する前の記事なので上記と同様に赤印部を「html からphp」として下さい。

６．サイトの再構築

再度「再構築」すると出来上がりです。＾＾

６． Top ＞ Movable Type ＞カスタマイズ＞カレンダー＞月送りカレンダー状態保持スクリプト

ここも、難しいところはありません。

「小粋空間」に

１．JavaScriptファイルの設定

下記を"calendar.js"というファイル名でローカル・サイト・パスに保存してください。

と言う所がありますが、このローカル・サイト・パスとはレンタル・サーバーのブログのパスのことです。「イの葉」で言えば、「www.inoha.jp/blog」のことで、ここにffftpを使って"calendar.js"をアップロードしてください。

後は順を追って変更すれば問題ないでしょう。

７． Top ＞ Movable Type ＞カスタマイズ＞カレンダー＞リアルタイムカレンダー（改）

ここは、少し難解？？！！

Movable Type のカレンダーでは、エントリー投稿やコメント投稿が行われないとカレンダーは更新されず、本日の日付が古いままです。これを解消するための変更がこの「リアルタイムカレンダー（改）」です。

「小粋空間」では、

ここでは拡張子がすでに .php になっている場合とそうでない場合、および月送りカレンダー利用の場合の3つのケースについて説明しています。それぞれに必要な項目は下記の通りです。

拡張子が .php になっている場合：１、２．１（または２．３）

拡張子が .php になっていない場合：１、３、４

月送りカレンダーの場合：１、２．２

とあります。

現在までで、「イの葉」のブログは拡張子が.php で月送りカレンダー　となっています。

よって、「月送りカレンダーの場合：１、２．２」の変更を行います。

また、

「小粋空間」での

月送りカレンダーの場合の注意事項

この最後の

・月送りカレンダー用ファイルの拡張子を「.html」から「.php」に変更した際、.html ファイルが残っているとカレンダーが正常に表示されない場合があります。 .html ファイルは必ず削除してください。

は注意してください。他の項目は大丈夫なはずです。

１．スタイルシートにカレンダー用スタイルの追加（共通）

ここは、

background : #000000; /* 背景色をつける設定 */

のみを追加しました。ただこれだと、本日が真っ黒なので淡い黄色　#ffff99にしてみました。

これは好みの問題ですね。（笑）

よって

.today {

display: block;

text-align: center;

border: 1px solid #444444;

background : #ffff99; /* 背景色をつける設定 */

}

としました。

２．カレンダー関連タグの変更（拡張子が .php になっている場合/月送りカレンダーの場合）

「小粋空間」では

カレンダーの設定がされている各テンプレートの <MTCalendar>～</MTCalendar> の部分を下記のスクリプトに変更します。

とあります。具体的には、

２．２月送りカレンダーの場合

月送りカレンダーご利用の方は「アーカイブ・テンプレート」の「カレンダー」に設定されている該当部分を下記に変更してください。

であり、「アーカイブ・テンプレート」の「カレンダー」の下の方

<td><MTCalendarIfBlank><MTElse><span<MTCalendarIfToday> class="today"</MTCalendarIfToday>></MTElse></MTCalendarIfBlank><MTCalendarIfEntries>

<a href="<$MTEntryLink archive_type="Daily"$>" target="_top"><$MTCalendarDay$></a>

</MTEntries>

</MTCalendarIfEntries><MTCalendarIfNoEntries><$MTCalendarDay$></MTCalendarIfNoEntries><MTCalendarIfBlank>

をごっそり下記に変更です。

<?php $day = date("j"); $year = date("Y"); $month = date("m"); ?>

<?php $y="<$MTCalendarDate format='%Y'$>"; $m="<$MTCalendarDate format='%m'$>"; $d="<$MTCalendarDay$>"; if($year == $y && $month == $m && $day == $d) { $style = " class=\"today\""; } else { $style = ""; } ?>

<td align="center"<?php print "$style"; ?>><span class="calendar"><MTEntries lastn="1"><a href="<$MTEntryLink archive_type="Daily"$>" target="_top"><$MTCalendarDay$></a></MTEntries></span></td>

</MTCalendarIfEntries>

</MTCalendarIfNoEntries>

</MTCalendar>

必ず各変更後、「保存」して「再構築」してください。これで終了です。また、各テンプレートを変更後「保存」してしまうと、アンドゥ（Ctl+zなどで）が効かなくなるので、変更前のファイルもしくは変更箇所を保存しておきましょう。

８． Top ＞ Movable Type ＞カスタマイズ＞カレンダー＞月送りカレンダー・1日に表示されなくなる不具合を改善

ここも難しくありません。各テンプレート名が

１．メインページ

２．アーカイブペ－ジ

３．エントリー・アーカイブ

４．カテゴリ・アーカイブ

５．日付アーカイブ

に対して、変更していきます。

具体的には

</iframe>

</div>

こうなります。

９． Top ＞ Movable Type ＞カスタマイズ＞カレンダー＞カレンダーのリンクにツールチップを設定する

ここも難しくありません。

しいて言えば、どこと置き換えるのか解りづらいことかな。テンプレート名「カレンダー」の

　　　　・

<?php $day = date("j"); $year = date("Y"); $month = date("m"); ?>

<td align="center"<?php print "$style"; ?>><span class="calendar"><MTEntries lastn="1"><a href="<$MTEntryLink archive_type="Daily"$>" target="_top"><$MTCalendarDay$></a></MTEntries></span></td>

</MTCalendarIfEntries>

</MTCalendarIfNoEntries>

</MTCalendar>

赤の部分を、

<MTEntries><MTDateHeader><a href="<$MTEntryPermalink archive_type="Daily"$>" title="</MTDateHeader><$MTEntryTitle$><MTDateFooter>" target="_top"><$MTCalendarDay$></a><MTElse> / </MTElse></MTDateFooter></MTEntries>

と置き換えて！！　おしまい。

１０． Top ＞ Movable Type ＞カスタマイズ＞カレンダー＞休日表示付リアルタイムカレンダー for Movable Type

ここは、どこの設定を行うかだけ話します。それ以外は難しくありません。

１．休日表示用カレンダースクリプトのダウンロード

３．テンプレートの修正１（スクリプトのインクルード）

テンプレート名、カレンダーに追加します。

４．３月送りカレンダーの場合

ここも、テンプレート名、カレンダーに追加します。

「カレンダー用アーカイブテンプレートの最後に下記を追加」とあります、場所は

</table>

</div>

setCurrentDate();

setWeekendAndHoliday('<$MTArchiveDate format="%Y"$>','<$MTArchiveDate format="%m"$>');

</script>

</body>

</html>

ここに追加しました。

５．テンプレートの修正３（スクリプト追加）

外部ファイル「dayChecker.js」に追加します。くれぐれも、

２．スクリプトのアップロード

そして、「再構築」してください。終了です。

ガーデンカフェの雑記帳

●テンプレート変更箇所（その１）

トラックバックURL

コメントする

ガーデンカフェ の 雑記帳

●テンプレート変更箇所（その１）

トラックバックURL

コメントする

ガーデンカフェの雑記帳