MTでAjax！！〜XMLHttpRequestでMovableTypeの各エントリーにメニューを読み込ませる〜
categories: MovableType tags: Ajax Blog MovableType
Road to me..では各エントリー、カテゴリー、マンスリーアーカイブにトップページと同じメニューを付けています。しかしながら過去のアーカイブは「すべて再構築」を実行するまでは「Recent Entries」などが古いままになっていました。（応急処置として毎晩「すべて再構築」を実行するスクリプトを実行していました...）
この状況を打開するために、今日はAjaxの勉強をかねてXMLHttpRequestを使って外部ファイル（menu.html）に書き出したメニューを各アーカイブで読み込むJavaScriptを書いてみました。
ajax_menu.js
（Safariでの文字化けにも対応済。ただしMacIEでは実行不可。）
| 入門 Ajax | |
 | 高橋 登史朗 ソフトバンククリエイティブ 2005-11-15 売り上げランキング : 65,811 Amazonで詳しく見るby G-Tools |
使い方は以下の通り。
- 新しいインデックステンプレートを作成＆保存
テンプレート名：MenuTemplate
出力ファイル名：menu.html => http://your.blog.domain/menu.htmlにメニューHTMLを書き出す - メインページ（index）テンプレートからメニュー部分のソースをMenuTemplateにコピー
- MenuTemplateを再構築
- 各アーカイブテンプレートのメニューを書き出したい場所に下記を埋込
<script src="<$MTBlogURL$>ajax_menu.js"></script>
<div id="menu"></div> - すべて再構築
ただしMacIEで実行不可能なので、メインページテンプレートではメニューは直に記述したままにしておいた方が無難でしょう。あと、MenuTemplate内に埋め込まれたJavaScriptは実行されないので注意が必要です。
参考URL
[ajax] Safari の responseText で UTF-8 コード文字化け回避
Atsushi's Homepage 〜 Ajax で作ってみる