Movable Type 3.17-ja and customized interface with application templates
このエントリで書かれている内容は、今となっては時代遅れで陳腐な廃れた内容です。真に受けず、十分にご注意ください。
みなさんご存知 Movable Type 3.17-ja がリリースされました。てっきりいつものように 23 時 59 分ギリギリでリリースされるものと思い込んで待ち構えていたのですが、意外な 20 時頃のリリースでした。21 時 50 分、3.17-ja にて再構築完了！
多くの修正点の中でも個人的に気になるのは、PostgreSQL を DB として Movable Type を利用する場合に誤ったスキーマによって PluginData を扱うプラグインが正常に動作しない問題の修正。スキーマが修正されたので新規インストールについては解消されました。既存のシステムについては次期リリースでアップグレードスクリプトが提供されるそうですが、かなり不自由しているのでリリースが待ち遠しいです。MT 3.2 の mt-upgrade31.cgi のことでしょうかね。
さて、米国の Six Apart Professional Network でアプリケーションテンプレートのカスタマイズに関するエントリが公開されています。まず Alex | weblog: Movable Type Liquid Template は導入が手軽で良いです。styles.css と images/topnav-bg.gif、images/topnav-logo.gif をそれぞれ公式のそれと置き換えるだけで、固定幅な Movable Type 管理アプリケーションのレイアウトが可変幅になり、左側のリストメニューは viewport 固定 ( position: fixed ) となります。Firefox など CSS の position プロパティで fixed に対応している UA での使い勝手が向上します。topnav-logo.gif は Brad Choate さん提供のものなどもあるので好みに応じて換えてみましょう。ファイル置換えの際はオリジナルのバックアップも忘れずに。自分でロゴや CSS を作り込んでも面白そうですねー。
で、次に Movable Type アプリケーションテンプレートのカスタマイズなんですが、導入してみるとこれがなかなか凄い。Movable Type のアプリケーションディレクトリに lib/ に対する extlib/ のような代替テンプレート用ディレクトリ ( exttmpl/ ) を作り、mt.cfg で AltTemplatePath を設定します。そこにカスタマイズした代替テンプレートを置くことで、Movable Type アプリケーションはそのテンプレートをオリジナルのテンプレートディレクトリ ( tmpl/ ) よりも優先的に読み込みます。オリジナルのテンプレートを汚すことなく安全に Movable Type アプリケーションをカスタマイズすることができる、という訳。凝ったカスタマイズのテンプレートは実にパワフル。
- danandsherree.com: Computers > Movable Type > Alternate Template Collection
$ mkdir -p exttmpl/cms
$ wget -P exttmpl/cms http://blog.drry.jp/2005/06/11/upload.tmpl [http://url.to/.tmpl ...]
$ ls exttmpl/cms
edit_entry.tmpl list_blog.tmpl preview_entry.tmpl upload.tmpl upload_complete.tmpl
$ vi mt.cfg
# ( ...sniped )
# TemplatePath ./tmpl
AltTemplatePath ./exttmpl
# ( sniped... )
そして AllKeywords プラグインを利用したフォークソノミーをさらに快適にする方法を発見。その名もタグサジェスト！エントリ編集の際、面倒なのが過去のエントリで付けた関連タグの存在とその有無を調べなければならないことです。「そのようなことは気にせず、思い浮かんだ語句でバシバシとタグ付けすれば自ずと道は開かれるのだ！」ってのも確かに一理あるのですが。このカスタマイズを行うと、エントリ編集でキーワード欄を入力する際に、過去に付けた既に存在するタグが入力候補として一覧表示され補完機能が付きます。AllKeywords プラグインの作者 ogawa さんはタグ付けの際に生じるヒューマンエラーについて危惧されています。このタグサジェストによってそういったエラーは実に低くなりそうです。
- danandsherree.com: Computers > Movable Type > A Tag-Suggest Feature (for use with Technorati, a subject index, or anything else)
私のフォークソノミーは AllKeywords プラグインを基幹として、空白文字を含む tag (e.g.: "Movable Type" ) によって実現しています。よって以下の keywords_list.php を作りました。keywords_list.php はキーワード ( タグ ) の全リストを自然順で並べ替えた JavaScript の配列を返す PHP スクリプトです。
<?php
// Put together a list of all keywords or tags.
$string = '<MTAllKeywords delimiter=","><MTAllKeyword encode_php="q">,</MTAllKeywords>';
// Remove duplicates and line endings, etc.
$keywords = preg_split( '/\s*[,|\n]\s*/m', $string );
natcasesort( $keywords );
// Build an array for the JavaScript function to use.
echo 'var customarray = new Array( ';
foreach ( $keywords as $value )
echo "'$value', ";
echo "'' );";
?>
ogawa さんが PHP を使わなくとも実現できることをコメントしてくださったので、修正しました。さらに Shinya さんから、AllKeywords 0.12 では glue オプションが利用できないことをコメントで報告いただきました。glue オプションが利用可能な開発版かそれ以降のバージョンを利用します。
var customarray = new Array(<MTAllKeywords delimiter="," glue=","> '<MTAllKeyword encode_js="1">'</MTAllKeywords> );
--- exttmpl/cms/edit_entry.tmpl~ 2005-06-12 02:59:00.000000000 +0900
+++ exttmpl/cms/edit_entry.tmpl 2005-06-12 03:00:00.000000000 +0900
@@ -674,7 +674,7 @@
<div class="field">
<label for="keywords"><!-- MT_TRANS phrase="Keywords" --><MT_TRANS phrase="Tags"></label> <a href="#" onclick="return openManual('entries', 'item_keywords')" class="help">?</a><br />
<script language="javascript" type="text/javascript" src="/actb.js"></script>
-<script language="javascript" type="text/javascript" src="/keywords_list.php"></script>
+<script language="JavaScript" type="text/javascript" src="/keywords_list.js"></script>
<input autocomplete="off" class="full-width" name="keywords" id="keywords" tabindex="6" onfocus="actb(this,event,customarray);" value="<TMPL_VAR NAME=KEYWORDS ESCAPE=HTML>" size="90" /><br />
</div>
</TMPL_IF>
actb.js は空白とセミコロンの区切りを想定した仕様になっているので、これにカンマ区切りで利用するための変更を施します。
--- actb.js 2005-05-09 03:27:38.000000000 +0900
+++ actb.js 2005-06-11 06:30:00.000000000 +0900
@@ -48,7 +48,7 @@
var actb_lim=15;
var actb_firstText=false;
var actb_mouse=true;
-var actb_delimiter=new Array(';',' ');
+var actb_delimiter=new Array(',');
var actb_bgColor='#f9f4e6';
var actb_textColor='#342a1f';
var actb_hColor='#ecc076';
この keywords_list.phpjs をインデックステンプレートとして構築し、danandsherree.com 提供の actb.js と exttmpl/cms/edit_entry.tmpl を設置します。edit_entry.tmpl に手を加えれば keywords_list.php と actb.js を任意の場所や名前に変更することもできます。タグサジェスト機能は実に快適！
過去に紹介した Greasemonkey によるファイルのアップロード先ディレクトリの日付補完は、exttmpl/cms/upload.tmpl をカスタマイズする方がよりスマートだと気付いたのでそれらを移植した upload.tmpl を公開します。オリジナルの upload.tmpl に以下のコードを埋め込んだだけです。不要になった Greasemonkey の user script ( set-mt-upload-dir.user.js ) はアンインストールしました。
<script type="text/javascript">
var today = new Date();
var d = today.getDate();
d = (d < 10) ? '0' + d: d;
var m = today.getMonth() + 1;
m = (m < 10) ? '0' + m: m;
var y = today.getFullYear() ? today.getFullYear(): today.getYear();
y = (y < 2000) ? 1900 + y: y;
var pathArchive = 'images/' + y + m + d + '/';
var pathSite = y + '/' + m + '/' + d + '/';
document.forms[0].extra_path_archive.value = pathArchive;
document.forms[0].extra_path_site.value = pathSite;
</script>
danandsherree.com の edit_entry.tmpl を以下のように修正して「キーワード」を「Tags」に変えてみました。表面上のちょっとしたことですけど、良いです。
--- exttmpl/cms/edit_entry.tmpl 2005-06-11 07:30:00.000000000 +0900
+++ exttmpl/cms/edit_entry.tmpl 2005-06-11 07:29:00.000000000 +0900
@@ -672,7 +672,7 @@
<TMPL_IF NAME=DISP_PREFS_SHOW_KEYWORDS>
<div class="field">
-<label for="keywords"><MT_TRANS phrase="Keywords"></label> <a href="#" onclick="return openManual('entries', 'item_keywords')" class="help">?</a><br />
+<label for="keywords"><!-- MT_TRANS phrase="Keywords" --><MT_TRANS phrase="Tags"></label> <a href="#" onclick="return openManual('entries', 'item_keywords')" class="help">?</a><br />
<script language="javascript" type="text/javascript" src="/actb.js"></script>
<script language="JavaScript" type="text/javascript" src="/keywords_list.js"></script>
<input autocomplete="off" class="full-width" name="keywords" id="keywords" tabindex="6" onfocus="actb(this,event,customarray);" value="<TMPL_VAR NAME=KEYWORDS ESCAPE=HTML>" size="90" /><br />
このエントリで書かれている内容は、今となっては時代遅れで陳腐な廃れた内容です。真に受けず、十分にご注意ください。
- タグ
- folksonomy
- JavaScript
- Movable Type
- obsolete
- PHP
- plugins
- release
- templates
- 公開日時
- 2005-06-11T06:41:45+09:00 @945
- 更新日時
- 2005-06-14T11:44:37+09:00 @155
- Permalink URI & TrackBack URL
- http://blog.drry.jp/2005/06/11/0641
TrackBack ( 1 )
- MTの管理画面をカスタマイズ from 亜細亜ノ蛾 - Weblog
- 2005-06-21T02:02:58+09:00 @945
- 「Alex | weblog: Movable Type Liquid Template」の記事を参考にMTの管理画面をカスタマイズすると、IEの場合はメインメ...
コメント ( 7 )
これは良いですね。自分でもやってみました。ちなみにMTAllKeywordsにはglueという隠しオプションがあるのでphpにしなくても以下のようにするだけで済みます。
var customarray = new Array(<MTAllKeywords glue="," delimiter=",">'<$MTAllKeyword$>'</MTAllKeywords>);
と思ったのですが、辞書式順に並べたいわけですね。今後のリリースではオプションで指定できるように考慮したいと思います。
ああ！そうでした！ glue!!! AllKeywords 導入時にどこかで glue オプションを使った覚えがあります。補足ありがとうございます。
自然順並び替え ( natcasesort() ) はオリジナルの keywords_list.php にあったので、理由があってのことかと深く考えずそのまま PHP にしてしまいました。並び替えないことによる問題の有無は不明です。PHP 要らずかもしれませんね。今後もう少し試行錯誤してみます。
自然順になっているのは、actb.jsが入力キーストロークの大文字・小文字を区別していないのと関係がありそうですね。
Blog, Blonde, Bloom, blogosphereという例を考えます。この例は文字コードの辞書順に並んでいます。「blo」まで入力したときsuggestされる候補はこの順に並ぶことになります。しかし、Blogとblogosphereは大文字･小文字を区別しなければ4文字目まで一致していますから、Blog, blogosphere, Blonde, Bloomの順でsuggestされた方がユーザーは直感的に把握しやすいわけです。
あれ、私の環境では glue オプションが効かないですね。以下のようにしたら問題なく動くようなので大した問題でもないですけど、一応報告しますー。
var customarray = new Array(<MTAllKeywords delimiter=",">'<MTAllKeyword encode_js="1">',</MTAllKeywords>'');
ogawa さん、なるほど確かに actb.js が渡されたキーワード配列の並び順をそのままに候補を表示することを確認しました。人間的な自然順アルゴリズムというのは重要なんですねぇ。Perl だと Sort::Naturally モジュールになりますか。
Shinya さん、AllKeywords は 0.12 をお使いでしょうか？ glue オプションは ogawa さんの Subversion リポジトリから開発版をチェックアウトすれば使えるようになるかと思います。SVN::Web も公開されているので WWW ブラウザからでもチェックアウトできます。 ( http://as-is.net/svnweb/index.cgi/mt/browse/all-keywords/trunk/ )
ドキュメントの方には反映していませんが、いまさっき0.13というバージョンで
http://as-is.net/blog/archives/misc/all-keywords.zip
を置き換えました。
glueオプションが使えます。また、MTAllKeywordsが既定で大文字・小文字を区別せずにソートします。つまり、自然順(みたいなの)をデフォルトにしました。
drry さんへ、 0.12 を使ってました。ナイトリーのようなバージョンがあったのですね。
ogawa さんへ、 0.13 を使用してみたところ、問題なく glue オプションが使えました。私はまだローカルでテンプレートを弄ってる段階なのでソートの方は未確認です。
お二方とも親切にありがとうございました。