Movable Type 備忘録

MovableTypeで天気予報を表示してみる

Apr172006
Author: bzbell
Categories: Customize
Tags: JavaScript, Sidebar, Weather

Next Page: 投稿者別に最近のエントリ一覧を表示する
Prev Page: MovableType用占いランキングを表示してみる

MovableType用占いランキングを表示してみるに引き続き、天気予報も表示させてみました。

前回に引き続き、今回参考にしたサイトはdark7.jp様です。

dark7.jpさんでは、天気予報を表示するMTWeatherも公開しています。インストールはカンタン

こちらのMTWeather の進化系→JavaScriptで導入簡単なお天気プラグインからスクリプトをダウンロードします。
デフォルトで表示させる地域を変更します。
Drk7jpWeather.js を任意の文字コードで保存可能なテキストエディタで開きます。以下のように修正してください。
```
11行目
var DEFAULT_ID    = '46';
var DEFAULT_XML   = '13';
var DEFAULT_AREA  = '東京地方';
                   ：
                   ：
    {'id':46
,'pref':'東京都' ,   'xml':'13',  'area':'東京地方'},
                   ：
                   ：
```
ファイル中から表示させたい地域を探して、その地域情報の青い字の値を DEFAULT_ID に変更します。赤い字の値を DEFAULT_XML に変更します。緑の字も同様に DEFAULT_AREA として変更します。

例えば、京都の南部 を表示させたい場合には以下のようになります。
```
var DEFAULT_ID    = '79';
var DEFAULT_XML   = '26';
var DEFAULT_AREA  = '南部';
                   ：
                   ：
    {'id':79
,'pref':'京都府' ,   'xml':'26',  'area':'南部'},
                   ：
                   ：
```
変更できたら保存します。
圧縮ファイル中の prototype.js、xml2json.js、Drk7jpWeather.js のJAVAスクリプトを各自の環境に合わせてアップロードします。アップロード先はどこでも構いません。
以下のコードを表示させたいテンプレートの <head>～</head> に追加します。
```
<script language="javascript" src="<$MTBlogURL$>prototype.js"></script>
<script language="javascript" src="<$MTBlogURL$>xml2json.js"></script>
<script language="javascript" src="<$MTBlogURL$>Drk7jpWeather.js"></script>
```
青い字の部分を各自の環境に合わせて修正します。上記コードでは index.html と同じ場所を指定しています。

そして、以下のコードを表示させたい場所に追加します。
```
<div id="jwfx_menu"></div>
<div id="jwfx"></div>
```