AjaxComments for MT4プラグインの利用法

Mark Carey氏が作成した「AjaxComments for MT4」プラグインは、コメント投稿の処理をAjax化して、ブログ記事ページからページを遷移せずにコメントを投稿することができるようにするものです。
このプラグインのインストール方法を紹介します。

また、このプラグインを日本語環境で使う場合、Movable Typeの文字コードをUTF-8以外に設定していると、コメント投稿時に文字化けが起こります。
その点を解決する方法も解説します。

↓AjaxCommentsプラグインの動作例（ブログ記事のページに、Ajaxによってコメント確認部分が表示されています）

1.TemplateInstallerプラグインのインストール

AjaxCommentsプラグインでは、それ用のテンプレートをいくつか作成するようになっています。
そして、作成の処理を自動化するために、「TemplateInstaller」というプラグインを組み合わせるようになっています。
TemplateInstallerプラグインは、以下のページからダウンロードすることができます。

http://mt-hacks.com/templateinstaller.html

ダウンロードしたzipファイルを解凍すると、「plugins」というディレクトリができます。
このディレクトリを、Movable Typeのインストール先ディレクトリにアップロードします。

2.AjaxCommentsプラグインのインストール

次に、AjaxCommentsプラグインをインストールします。
AjaxCommentsプラグインは、以下のページからダウンロードすることができます。

http://mt-hacks.com/ajaxcomments.html

3.テンプレートのインストール

次に、Movable Typeにログインして、AjaxCmmentsプラグインで使うテンプレートをインストールします。

Blogごとのプラグインの設定を開き、AjaxCommentsプラグインの設定のところで、「Install Templates」のボタンをクリックします。
すると、AjaxCommentsに関連するテンプレートが差し替え／追加されます。

↓AjaxCommentsプラグインの設定

以下のテンプレートは、AjaxComments用に差し替えになります。

コメント（テンプレートモジュール）
コメント入力フォーム（テンプレートモジュール）
コメント完了（システム）
コメントプレビュー（システム）

これらのテンプレートをデフォルトからカスタマイズしていた場合は、AjaxComment用に差し替えられたテンプレートに、カスタマイズを再度施します。

4.JavaScriptの追加

次に、テンプレートにJavaScriptを追加します。

4-1.Movable Typeの標準テンプレートセットの場合

Movable Type 4.1の標準テンプレートセットの場合、「ブログ記事」のアーカイブテンプレートで以下の行を探します。

<MTIfCommentsAccepted><script type="text/javascript" src="<$MTLink template="javascript"$>"></script></MTIfCommentsAccepted>

この行を以下のように書き換えます。

<MTIfCommentsAccepted>
<$MTInclude module="YUI Javascript"$>
<script type="text/javascript" src="<$MTLink template="Ajax Comments Javascript"$>"></script>
<script type="text/javascript" src="<$MTLink template="javascript"$>"></script>
</MTIfCommentsAccepted>

4-2.小粋空間のテンプレートセットの場合

小粋空間のテンプレートセットでは、「ヘッダー」のテンプレートモジュールの中で以下の行を探します。

<MTIf name="feedback_template">

そして、この行の後に以下を追加します。

<$MTInclude module="YUI Javascript"$>
<script type="text/javascript" src="<$MTLink template="ajax_comments_javascript"$>"></script>

5.コメント確認ページをオンにする

次に、Blogの設定のページを開き、コメントの設定ページの最後にある「コメントの確認ページ」のチェックをオンにします。

6.再構築

ここまでの作業が終わったら、ブログ記事アーカイブテンプレートを再構築します。

7.UTF-8以外に対応させる

Movable Typeの文字コードをUTF-8以外に設定している場合、AjaxCommentsでコメントを投稿すると、文字化けが起こります。

この問題について、Ogawa::Memorandaの小川さんが、スマートな方法を考えてくださいましたので、そちらを参照してください。

なお、MTのソースコードを書き換えても良いという方は、Movable Typeのlib/MT/App/Comments.pmを書き換える方法があります。
このファイルの55行目付近に、以下のリストの赤色のコードを追加して保存し、元のComments.pmと差し替えます。

・
・
・
$app->{default_mode} = 'view';
my $q = $app->param;

# for ajax add start
if ($q->param('ajax') || $q->param('charset')) {
    require MT::I18N;
    my $post_charset = $q->param('charset') || 'utf-8';
    my $mt_charset = MT::ConfigMgr->instance->PublishCharset || 'utf-8';
    if ($post_charset ne $mt_charset) {
        for my $name ($q->param) {
            my $value = $q->param($name);
            $value = MT::I18N::encode_text($value, $post_charset, $mt_charset);
            $q->param($name, $value);
        }
    }
}
# for ajax add end

## We don't really have a __mode parameter, because we have to
## use named submit buttons for Preview and Post. So we hack it.
・
・
・

8.YahooUIライブラリに関する注意点

このプラグインでは、YahooUIライブラリのJavaScriptが使われています。
「YUI Javascript」のテンプレートモジュールに、YahooUIのサイトからJavaScriptを読み込むための記述があります。
自分のサイトにYahooUIのJavaScriptにインストールしておいて、それを使うように書き換えても良いでしょう。

お知らせ