小粋空間  -  a cheap joke and a play on words site

Movable Typeのポップアップコメントにカスタムフィールドを表示するカスタマイズです。ご質問を頂きましたので本エントリーで情報展開します。

１．ポップアップコメントについて

Movable Type（現時点のバージョンは5.0x）はデフォルトでポップアップコメント（コメントフォームを別ウィンドウで表示）をサポートしていませんが、「Movable Type 5でコメント投稿フォームをポップアップする」でカスタマイズを紹介しています。

このカスタマイズを行えばコメントをポップアップ表示できます。

本エントリーでは、このポップアップしたコメントフォームにコメントカスタムフィールドの内容を表示できるようにします。下の画面では「タイトル」「地域」というカスタムフィールドを表示しています。

カスタマイズを行う前にコメントカスタムフィールドを作成しておいてください。

２．form要素の修正

まず、mt-comments-popup.cgiにあるform要素に赤色で示した2行を追加します。

…前略…
<input type="hidden" name="blog_url" value="$blog_url" />
<input type="hidden" name="cgi_path" value="$cgi_path" />
<input type="hidden" name="blog_id" value="ブログID" />
<input type="hidden" name="customfield_beacon" value="1" id="customfield_beacon" />
<div id="comments-open-data">
…後略…

「ブログID」の部分はポップアップコメントにしたいブログのブログIDを設定します。

次に、追加したいブログでインデックステンプレートを新規作成し、以下の内容を設定します。テンプレートはプレビューで表示された内容を利用するために使うだけで、テンプレートを保存する必要はありません。

• テンプレート名：test
• 出力ファイル名：text.txt
• テンプレートの内容：以下

<mt:CommentCustomFields>
<mt:SetVarBlock name="custom_field_name"><$mt:CustomFieldName$></mt:SetVarBlock>
<mt:SetVarBlock name="field-content"><$mt:CustomFieldHTML$></mt:SetVarBlock>
<mt:SetVarBlock name="custom_field_id">profile_<$mt:CustomFieldName dirify="1"$></mt:SetVarBlock>
<$mt:Include module="フォームフィールド" id="$custom_field_id" class="" label="$custom_field_name"$>
</mt:CommentCustomFields>

設定後、プレビューを行います。プレビューに表示された内容がポップアップコメントに挿入する(X)HTMLマークアップになるので、この内容をマウスでコピーします。

コピーした内容をmt-comments-popup.cgiにあるform要素に貼り付けます。

…前略…
<div id="comments-open-text">
    <label for="comment-text">コメント</label>
    <textarea id="comment-text" name="text" rows="10" cols="50" onfocus="mtCommentFormOnFocus()"></textarea>
</div>
ここにコピーした内容を貼り付ける
<div id="comments-open-captcha"></div>
…後略…

３．スタイルの追加

mt-comments-popup.cgiにあるstyle要素に、以下の内容を追加します。

.field-top-label {
    margin-bottom: 0.75em;
}

これでポップアップコメントにカスタムフィールドが表示されれば完成です。

Movable Typeのコメント投稿フォームで、コメントカスタムフィールドの値をクッキーに保存する方法を紹介します。

１．概要

Movable Typeのコメント投稿フォームは、「ログイン情報を記憶」をチェックしておくことで、投稿時に入力した名前やメールアドレスなどをクッキーに保存し、次回のコメント投稿時に利用することができます。

ただし、クッキーに保存できるのはデフォルトで用意されているフィールドのみで、カスタムフィールドで作成したフィールドは保存できません。

例えば下の画像のように、「テキストフィールド」というコメントカスタムフィールドに入力した値は、次回のコメント投稿時には反映されません。

本エントリーでは、コメントカスタムフィールドに入力した値をクッキーに保存できるようにする方法を紹介します。

カスタマイズ後のコメント投稿フォーム

２．カスタマイズ

カスタマイズ対象は、コミュニティ機能を使っていない場合は、インデックステンプレートの「JavaScript」、コミュニティ機能を使っている場合はグローバルテンプレートの「GlobalJavaScript」になります。

以下に解説するサンプルは、カスタムフィールドのベースネームが「cf」で、カスタムフィールドがテキストフィールドの場合です。

２．１ mtSaveUser()の変更

まず、コメント投稿時に実行される関数mtSaveUser()に、コメント投稿フォームからカスタムフィールドの値を取得する処理（青色部分）を追加します。赤色部分の「cf」がカスタムフィールドのベースネームになります。

function mtSaveUser(f) {
    // We can't reliably store the user cookie during a preview.
    if (is_preview) return;
 
    var u = mtGetUser();
 
    if (f && (!u || u.is_anonymous)) {
        if ( !u ) {
            …中略…
        }
        if (f.customfield_cf != undefined) u.customfield_cf = f.customfield_cf.value;
        if (f.author != undefined) u.name = f.author.value;
        if (f.email != undefined) u.email = f.email.value;
        if (f.url != undefined) u.url = f.url.value;
    }
    …後略…

コメント投稿フォームから取得したデータは、「u」という変数に任意の変数名、ここでは「customfield_cf」という名前で保存します。

２．２ mtBakeUserCookie()の変更

投稿者情報をクッキーに保存する関数mtBakeUserCookie()に、カスタムフィールドの値を保存する処理を追加します。

function mtBakeUserCookie(u) {
    var str = "";
    if (u.customfield_cf) str += "customfield_cf:'" + mtEscapeJS(u.customfield_cf) + "';";
    if (u.name) str += "name:'" + mtEscapeJS(u.name) + "';";
    …後略…

u.customfield_cfをクッキーに保存用フォーマットに整形し、変数strに設定します。シングルクォーテーションやダブルクォーテーションの記述位置に気をつけてください。

２．３ mtUnbakeUserCookie()の変更

クッキーから投稿者情報を取得する関数mtUnbakeUserCookie()に、カスタムフィールドデータを取得する処理を記述します。

【変更前】

function mtUnbakeUserCookie(s) {
    if (!s) return;
 
    var u = {};
    var m;
    while (m = s.match(/^((name|url|email|is_authenticated|profile|userpic|…後略…
    …後略…

【変更後】

function mtUnbakeUserCookie(s) {
    if (!s) return;
 
    var u = {};
    var m;
    while (m = s.match(/^((customfield_cf|name|url|email|is_authenticated|profile|userpic|…後略…
    …後略…

２．２項で設定したクッキー名「customfield_cf」をそのまま設定します。この記述をしておけば、mtUnbakeUserCookie()の処理でクッキーの値が変数uに収集されるようになっています。

２．４ mtUserOnLoad()の変更

ページロード時に実行される関数mtUserOnLoad()に、クッキーから読み出したカスタムフィールドの値を、コメント投稿フォーム反映用の変数に設定する処理を追加します。

function mtUserOnLoad() {
    var u = mtGetUser();
    …中略…
        if (cf) {
            if (u && u.is_anonymous) {
                if (u.customfield_cf) cf.customfield_cf.value = u.customfield_cf;
                if (u.email) cf.email.value = u.email;
                if (u.name) cf.author.value = u.name;
                if (u.url) cf.url.value = u.url;
                …後略…

変数uに保存されているcustomfield_cfの値を、コメント投稿フォームに反映するときに利用する変数cf（comment formの略と思います）のcustomfield_cfに代入します。

３．複数のカスタムフィールドを保存する場合

複数のカスタムフィールドをクッキーに保存するには、２項の設定で、必要な分を同じように追加してください。２．１項であれば次のようになります。

function mtSaveUser(f) {
    // We can't reliably store the user cookie during a preview.
    if (is_preview) return;
 
    var u = mtGetUser();
 
    if (f && (!u || u.is_anonymous)) {
        if ( !u ) {
            …中略…
        }
        if (f.customfield_cf != undefined) u.customfield_cf = f.customfield_cf.value;
        if (f.customfield_cf_2 != undefined) u.customfield_cf_2 = f.customfield_cf_2.value;
        if (f.customfield_cf_3 != undefined) u.customfield_cf_3 = f.customfield_cf_3.value;
        if (f.author != undefined) u.name = f.author.value;
        if (f.email != undefined) u.email = f.email.value;
        if (f.url != undefined) u.url = f.url.value;
    }
    …後略…

チェックボックス・ラジオボタン・セレクトボックスはデータの取得や設定はサンプル異なるかもしれません。通常のJavaScriptのお作法に従ってください。

Movable TypeでreCaptchaを利用する方法です。ここではMovable Type 4.x向けの内容で書いていますが、Movable Type 5でもほぼ同じです。

１．基本

Movable TypeでデフォルトのCAPTCHA機能を利用するためにはImageMagickなどの画像ライブラリが必要ですが、サーバ環境によって画像ライブラリが利用できない場合、本エントリーで紹介するreCaptchaで代替することができます。

Movable Type既定のCAPTCHA

reCaptchaによるCAPTCHA

reCaptchaとはCAPTCHA画像を生成し、入力した内容が正しいかどうかを判定してくれるサービスです。サービス的にはかなり枯れたもので、2009年にGoogleに買収されました。

reCaptcha

以下、利用方法です。

２．reCaptchaの登録

reCaptchaのトップページで「GET reCAPTCHA」をクリック。

サインアップしていない場合は「Sign up Now!」をクリック（Googleアカウントでログインしていればひとつ先の画面に移動します）。

Googleアカウントの画面が表示された場合はログインまたはサインアップしてください。

reCaptchaを利用するドメイン（末尾のスラッシュは不要）を入力し、必要に応じて「Enable this key on all domains (global key)」をチェックして、「Create Key」をクリック。

「Public Key:」と「Private Key:」が表示されます。この画面の情報は次の作業で使うのでこのままにしておいてください。

３．プラグインのインストール

Movable TypeにreCaptchaプラグインをインストールします。MT4.1まではインストールアーカイブのextrasディレクトリに含まれていましたが、現在はGithubからダウンロードできます。

mt-plugin-recaptchaのページにアクセスして、右側にあるダウンロードをクリック。

「Download.zip」または「Download.tar.gz」をクリックしてプラグインアーカイブをダウンロードします。

プラグインアーカイブを展開し、中にあるreCaptchaフォルダをpluginsディレクトリにアップロードします。「システムメニュー」→「プラグイン」で「reCaptcha～」が表示されればインストール完了です。

４．プラグインの設定

reCaptchaを設定したいブログのブログ管理画面（システム管理画面ではありません）の「ツール」→「プラグイン」をクリックし、プラグイン一覧に表示されている「reCaptcha～」をクリックし、さらに「設定」タブをクリックすると、「Public Key」と「Private Key」の設定画面が開くので、２項で取得したそれぞれのキーを設定し、「変更を保存」をクリック。

５．コメントの設定

同じブログ管理画面の「設定」→「コメント」で「CAPTCHAプロバイダ」から「reCaptcha」を選択し、「変更を保存」をクリック。

同じブログ管理画面の「設定」→「登録/認証」で「認証なしコメント」をチェックし、「変更を保存」をクリック。

６．テンプレートの設定

テンプレートセットで「既定のブログ」を選択している例で示します。

同じブログ管理画面の「デザイン」→「テンプレート」をクリックし、テンプレート一覧に表示されている「コメント」テンプレートモジュールをクリックし、以下の青色部分を追加し、赤色部分を削除します。修正後、「変更を保存」をクリック。

…前略…
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtCommentFormOnFocus()"></textarea>
</div>
<mt:if tag="captchaFields">
<div id="comments-open-captcha">
<mt:captchaFields />
</div>
</mt:if>
<div id="comments-open-captcha"></div>
<div id="comments-open-footer">
…後略…

これで全体を再構築すれば、次のように表示されます。

７．reCaptchaの利用方法

文字は2種類表示されるので、表示された順番に、半角スペースを挟んで入力します。また、reCAPTCHAの文字が判別しにくい場合、入力フィールド右側にあるリロードボタン（下）をクリックすれば次候補が表示されます。

リロードボタンの下のスピーカーボタンをクリックすれば、音声で聞き取ることもできます（英語です）。

Movable Typeでカテゴリ別+ブログ記事別に新着コメントを表示するカスタマイズを紹介します。

ここでは「お知らせ」「イベント」という2つのカテゴリがあり、それぞれ最新の10件をブログ記事別に出力する例を示します（サンプル画像は投稿コメントが10件に満たないので少なくなってます）。

このカスタマイズは「「最近のコメント」をネイティブタグのみで適正に表示する」の応用です。

１．サブテンプレート

カテゴリ別に新着コメントを表示するには、次のサブテンプレートをコピー＆ペーストしてください。赤色部分が出力したいカテゴリになりますので適宜変更してください。

<mt:SetVar name="count1" value="0" />
<mt:SetVar name="count2" value="0" />
<mt:Comments>
  <mt:CommentEntry>
    <mt:SetVarBlock name="entry_title"><a href="<mt:EntryPermalink />"><mt:EntryTitle /></a></mt:SetVarBlock>
    <mt:SetVarBlock name="entry_comment">
      <li><a href="<mt:EntryPermalink />#c<mt:CommentID />"><mt:CommentAuthor default="Anonymous"></a> <mt:CommentDate format="%m/%d"></li>
    </mt:SetVarBlock>
    <mt:If tag="EntryCategory" eq="お知らせ">
      <mt:If name="count1" lt="10">
        <mt:SetVar name="comment_list1{$entry_title}" value="$entry_comment" prepend="1" />
        <mt:SetVar name="count1" op="++" />
      </mt:If>
      <mt:SetVar name="flag1" value="0" />
      <mt:loop name="title_list1">
        <mt:if name="__value__" eq="$entry_title">
          <mt:setVar name="flag1" value="1" />
        </mt:if>
      </mt:loop>
      <mt:unless name="flag1">
        <mt:setVar name="push(title_list1)" value="$entry_title" />
      </mt:unless>
    </mt:If>
    <mt:If tag="EntryCategory" eq="イベント">
      <mt:If name="count2" lt="10">
        <mt:SetVar name="comment_list2{$entry_title}" value="$entry_comment" prepend="1" />
        <mt:SetVar name="count2" op="++" />
      </mt:If>
      <mt:SetVar name="flag2" value="0" />
      <mt:loop name="title_list2">
        <mt:if name="__value__" eq="$entry_title">
          <mt:setVar name="flag2" value="1" />
        </mt:if>
      </mt:loop>
      <mt:unless name="flag2">
        <mt:setVar name="push(title_list2)" value="$entry_title" />
      </mt:unless>
    </mt:If>
  </mt:CommentEntry>
</mt:Comments>
  
<h2>お知らせ</h2>
<mt:loop name="title_list1">
    <li>
    <mt:getVar name="__value__" />
      <ul>
    <mt:getVar name="comment_list1{$__value__}" />
      </ul>
    </li>
</mt:loop>
  
<h2>イベント</h2>
<mt:loop name="title_list2">
    <li>
    <mt:getVar name="__value__" />
      <ul>
    <mt:getVar name="comment_list2{$__value__}" />
      </ul>
    </li>
</mt:loop>

２．解説

まず、カテゴリ別にコメント数をカウントするためのカウンタとして、変数count1と変数count2を初期化します。カウンタは出力させたいカテゴリ分用意します。

<$mt:SetVar name="count1" value="0"$>
<$mt:SetVar name="count2" value="0"$>

MTCommentsタグを使って最新のコメントから処理します。その中でMTCommentEntryタグを使い、コメントが投稿されたブログ記事のコンテキストに移動します。その中でブログ記事タイトルを変数entry_title、コメント情報を変数entry_commentに設定します。

<mt:Comments>
  <mt:CommentEntry>
    <mt:SetVarBlock name="entry_title"><a href="<mt:EntryPermalink />"><mt:EntryTitle /></a></mt:SetVarBlock>
    <mt:SetVarBlock name="entry_comment">
      <li><a href="<mt:EntryPermalink />#c<mt:CommentID />"><mt:CommentAuthor default="Anonymous"></a> <mt:CommentDate format="%m/%d"></li>
    </mt:SetVarBlock>

次にブログ記事のメインカテゴリをMTIfタグで判定し、該当のカテゴリ（ここでは「お知らせ」）であれば、さらにカウンタの値が10以下であることを判定し、10以下であれば先程の2つの変数をハッシュ変数comment_list1に設定し、カウンタをインクリメントします。「10」の部分を変更すれば出力するコメント数を変更できます。

注：このカスタマイズではMTCommentsタグにlastnモディファイアを与えていないので、ブログに大量のコメントがある場合は「lastn=100」などを追加して、処理が重くならないようにしてください。

    <mt:If tag="EntryCategory" eq="お知らせ">
      <mt:If name="count1" lt="10">
        <mt:SetVar name="comment_list1{$entry_title}" value="$entry_comment" prepend="1" />
        <mt:SetVar name="count1" op="++" />
      </mt:If>

さらに、MTLoopタグで配列変数title_list1を処理し、現在処理中のブログ記事タイトルが含まれていなければ、配列変数title_list1に追加します。この配列変数title_list1は新着コメントがついたブログ記事の順番を記憶するために利用しています。

      <mt:SetVar name="flag1" value="0" />
      <mt:loop name="title_list1">
        <mt:if name="__value__" eq="$entry_title">
          <mt:setVar name="flag1" value="1" />
        </mt:if>
      </mt:loop>
      <mt:unless name="flag1">
        <mt:setVar name="push(title_list1)" value="$entry_title" />
      </mt:unless>

上記の処理は「イベント」カテゴリについても同様の処理を行います。

最後に、MTLoopタグで変数title_list1を処理し、その中でブログ記事タイトル順に変数comment_list1の内容を出力します。「イベント」カテゴリについても同様の処理を行います。

<h2>お知らせ</h2>
<mt:loop name="title_list1">
    <li>
    <mt:getVar name="__value__" />
      <ul>
    <mt:getVar name="comment_list1{$__value__}" />
      </ul>
    </li>
</mt:loop>

３．カテゴリを増やしたい場合

表示するカテゴリを増やしたい場合は、次の青色の内容をMTCommenEntryタグの終了タグの直前に追加してください。赤色の「x」にはすべて同じ半角数字（または半角英文字）を設定してください。

    <mt:If tag="EntryCategory" eq="カテゴリ名">
      <mt:If name="countx" lt="10">
        <mt:SetVar name="comment_listx{$entry_title}" value="$entry_comment" prepend="1" />
        <mt:SetVar name="countx" op="++" />
      </mt:If>
      <mt:SetVar name="flagx" value="0" />
      <mt:loop name="title_listx">
        <mt:if name="__value__" eq="$entry_title">
          <mt:setVar name="flagx" value="1" />
        </mt:if>
      </mt:loop>
      <mt:unless name="flagx">
        <mt:setVar name="push(title_listx)" value="$entry_title" />
      </mt:unless>
    </mt:If>
  </mt:CommentEntry>
</mt:Comments>

また、出力する部分として次の内容を追加してください。

<h2>カテゴリ名</h2>
<mt:loop name="title_listx">
    <li>
    <mt:getVar name="__value__" />
      <ul>
    <mt:getVar name="comment_listx{$__value__}" />
      </ul>
    </li>
</mt:loop>

Movable Type 5でコメント投稿フォームをポップアップするカスタマイズを紹介します。これはMTQにあった質問に対する回答の情報展開です（最近このパターンが多い・・・）。

ちなみに、過去のバージョン（MT3.x）では次のような設定を行うことで簡単にポップアップを行えてましたが、その後、セキュリティ強化によりGETメソッドでコメントスクリプトが起動しないなど、簡単にポップアップできなくなりました。

ここでは一旦別のスクリプト（mt-popup-comments）を呼び出し、そこから通常のコメントスクリプトを起動する方法を紹介します。

試していませんが、多分MT4でも動作すると思います。

１．機能

新たに追加したポップアップコメント用のリンクをクリックすると、

次のようにコメント投稿フォームがポップアップで表示されます。

サインインしたところです。

認証コメントのみを受け付ける場合は次のような表示にすることもできます。

各認証サービスを利用することもできます。

２．スクリプトのダウンロード

以下のリンクからポップアップコメント用のスクリプトをダウンロードしてください。

mt-popup-comments_0_01.zip

ダウンロードしたスクリプトを展開し、mt-popup-comments.cgi というファイル名でmt.cgiと同じディレクトリにアップロードしてください。また、アップロード後はmt.cgiと同じパーミッションを与えてください。

３．テンプレートの修正

ここでは「クラシックブログ」テーマをサンプルに、変更方法を説明します。ブログ記事テンプレートのhead要素の終了タグの直前に以下の内容を設定します。

<script type="text/javascript">
/* <![CDATA[ */
function OpenComments(c) {
    window.open(c,'comments','width=480,height=580,scrollbars=yes,resizable=yes,status=yes');
}
/* ]]> */
</script>

また、ポップアップ用コメントのリンク部分（青色）を次のように追加します。

<mt:IfCommentsActive>
    <span class="separator">|</span>
<a href="<$mt:EntryPermalink$>#comments"><$mt:EntryCommentCount singular="コメント(1)" plural="コメント(#)" none="コメント(0)"$></a>
| <a href="javascript:void(0)" onclick="OpenComments('<$mt:CGIPath$>mt-popup-comments.cgi?entry_id=<$mt:EntryID$>&amp;blog_id=<$MTBlogID$>&amp;blog_url=<$MTBlogURL$>&amp;cgi_path=<$MTCGIPath$>')">コメントする</a>
</mt:IfCommentsActive>

あと、デフォルトで表示されている、以下のコメントフォーム（「コメント」テンプレートモジュールにあります）はばっさり削除してください。

<mt:IfCommentsAccepted>
<div class="comments-open" id="comments-open">
    <h2 class="comments-open-header">コメントする</h2>
    <div class="comments-open-content">
 
    <mt:Ignore>
    <!-- Display greeting for users if blog allows users to register locally -->
    </mt:Ignore>
        <div id="comment-greeting"></div>
 
        <form method="post" action="<$mt:CGIPath$><$mt:CommentScript$>" name="comments_form" id="comments-form" onsubmit="return mtCommentOnSubmit(this)">
            <input type="hidden" name="static" value="1" />
            <input type="hidden" name="entry_id" value="<$mt:EntryID$>" />
            <input type="hidden" name="__lang" value="<$mt:BlogLanguage$>" />
            <input type="hidden" name="parent_id" value="<$mt:CommentParentID escape="html"$>" id="comment-parent-id" />
            <input type="hidden" name="armor" value="1" />
            <input type="hidden" name="preview" value="" />
            <input type="hidden" name="sid" value="" />
            <div id="comments-open-data">
                <div id="comment-form-name">
                    <label for="comment-author">名前</label>
                    <input id="comment-author" name="author" size="30" value="" onfocus="mtCommentFormOnFocus()" />
                </div>
                <div id="comment-form-email">
                    <label for="comment-email">電子メール</label>
                    <input id="comment-email" name="email" size="30" value="" onfocus="mtCommentFormOnFocus()" />
                </div>
                <div id="comment-form-url">
                    <label for="comment-url">URL</label>
                    <input id="comment-url" name="url" size="30" value="" onfocus="mtCommentFormOnFocus()" />
                </div>
                <div id="comment-form-remember-me">
                    <input type="checkbox" id="comment-bake-cookie" name="bakecookie" onclick="mtRememberMeOnClick(this)" value="1" accesskey="r" />
                    <label for="comment-bake-cookie">ログイン情報を記憶</label>
                </div>
            </div>
            <div id="comment-form-reply" style="display:none">
                <input type="checkbox" id="comment-reply" name="comment_reply" value="" onclick="mtSetCommentParentID()" />
                <label for="comment-reply" id="comment-reply-label"></label>
            </div>
            <div id="comments-open-text">
                <label for="comment-text">コメント
                <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
                <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtCommentFormOnFocus()"></textarea>
            </div>
            <div id="comments-open-captcha"></div>
            <div id="comments-open-footer">
                <input type="submit" accesskey="v" name="preview_button" id="comment-preview" value="プレビュー" onclick="this.form.preview.value='1';" />
                <input type="submit" accesskey="s" name="post" id="comment-submit" value="投稿" />
            </div>
        </form>
 
 
    </div>
</div>
<script type="text/javascript">
<!--
mtAttachEvent("load", mtEntryOnLoad);
mtAttachEvent("unload", mtEntryOnUnload);
//-->
</script>
</mt:IfCommentsAccepted>

４．注意事項

コメントプレビュー画面、コメント完了画面は通常の画面がポップアップ画面に表示されます。

また、スクリプト内からサイトパスにあるmt.jsを呼び出していますが、正常に呼び出せていない場合、コメント投稿が正常に動作しない可能性があります。

どうしてもコメント投稿が正常に行えない場合は、mt-popup-comments.cgiにある、次の1行を削除してください。

<input type="hidden" name="armor" value="1" />

この方法は「JavaScript を無効にしてコメント投稿を可能にする」によるものです。

Movable TypeのコメントでFacebookアカウントでの認証を有効にする方法を紹介します。投稿後は次のようにFacebookのアイコンが表示されます。

Facebookのアカウントは予め作成しておいてください。

１．Facebookアカウントの認証設定

ブログ管理画面の「設定」→「登録/認証」をクリックして、「Facebook Commentersプラグイン設定」をクリック。

Facebook Commentersプラグイン名をクリックして、さらに「設定」をクリック。下の画面が表示されるので、「Facebookアプリ作成」をクリック。

「許可のリクエスト」画面が表示されるので、右下の「許可する」をクリック。

Facebookデベロッパーのページに移動するので、右側にある「新規アプリケーションを作成」をクリック。

アプリケーション名を設定して、規約から「同意する」を選択した状態で「Create Application」をクリック。

なお、上の例ではアプリケーション名に「Facebook」と入れたため、エラーとなりました。アプリケーション名には「face」という文字を入れてはいけない規定になっています。私の場合、「Movable Type Comment」と入れ直しました。

「Create Application」をクリックしたあと、セキュリティチェック用のコードを入力して「送信」をクリック。

アプリケーション編集画面に移動するので、左メニューの「詳細設定」をクリック。

「Deauthorize Callback」に、利用中のMovable Type のアプリケーションディレクトリのURL（mt.cgiがあるURL）か、スタティックディレクトリのURL（mt-staticまでのURL）を設定します。私の場合はアプリケーションディレクトリのURLを設定しました。それ以外の設定項目はデフォルトのままで大丈夫だと思います。

もうひとつ、左メニューの「Web Site」をクリックして、「サイトURL」「Site Domain」を設定します。この項目を設定しないでコメント認証を実行するとエラーとなったためです。ここ（または他のメニュー）に表示されている「アプリケーションID」と「シークレットキー」を後の手順で使用します。

プラグイン設定画面に戻って、「Facebookアプリケーションキー」に「アプリケーションID」を、「Facebookアプリケーションシークレット」に「シークレットキー」を設定して、「変更を保存」をクリック。

ブログ管理画面の「設定」→「登録/認証」をクリックして、「Facebook」をチェックして「変更を保存」をクリックすれば完了です。

２．コメント投稿時のサインイン

コメント投稿欄のサインインをクリックして、次の画面で「Facebook」を選択すると次の画面に切り替わるので、「Connect with Facebook」のアイコンをクリック。

認証画面がポップアップされるので、「Allow」をクリック。これでサインインできます。

Movable TypeのMTCommentAuthorLinkタグで出力されるYahoo! JAPAN OpenID を省略表示するカスタマイズです。ご質問を頂きましたので本エントリーで紹介致します。

１．Yahoo! JAPAN OpenID表示について

Yahoo! JAPAN OpenIDでMovable Typeにコメント投稿すると、コメント欄に次のようにYahoo! JAPAN OpenIDが表示されます。Yahoo! JAPAN OpenIDでは、IDに紐づいたユーザー名を公開しない仕様になっているので、OpenIDをそのままユーザー名として扱うことになり、非常に長いです。

コメント欄

以下、Yahoo! JAPAN OpenIDを省略表示するカスタマイズをいくつか紹介します。なお、「Yahoo! JAPAN OpenID を省略表示する」ではMTCommentAuthorタグのカスタマイズについて紹介しています。

２．36文字のパラメータだけを表示

MTCommentAuthorLinkタグに、次のregex_replaceモディファイアを追加します。

<mt:CommentAuthorLink regex_replace="/https:\/\/me\.yahoo\.co\.jp\/a\/(\S{36})<\/a>$/","$1" />

変更後のコメント欄

「クラシックブログ」テーマの場合、「コメント詳細」テンプレートモジュールを以下のように修正します（青色部分）。

<div id="comment-<$mt:CommentID$>" class="comment<mt:IfCommentParent>  comment-reply</mt:IfCommentParent><mt:IfCommenterIsEntryAuthor>  entry-author-comment</mt:IfCommenterIsEntryAuthor>">
    <div class="inner">
        <div class="comment-header">
            <div class="asset-meta">
                <span class="byline">
                    <$mt:CommentAuthorIdentity$>
<mt:IfCommentParent>
                    <span class="vcard author">$mt:CommentAuthorLink regex_replace="/https:\/\/me\.yahoo\.co\.jp\/a\/(\S{36})<\/a>$/","$1"$></span>から<a href="<mt:CommentParent><$mt:CommentLink$></mt:CommentParent>"><mt:CommentParent>$mt:CommentAuthorLink regex_replace="/https:\/\/me\.yahoo\.co\.jp\/a\/(\S{36})<\/a>$/","$1"$></mt:CommentParent></a>への返信
<mt:Else>
                    <span class="vcard author"><$mt:CommentAuthorLink regex_replace="/https:\/\/me\.yahoo\.co\.jp\/a\/(\S{36})<\/a>$/","$1"$></span>
</mt:IfCommentParent>
                    | <a href="<$mt:CommentLink$>"><abbr class="published" title="<$mt:CommentDate format_name="iso8601"$>"><$mt:CommentDate$></abbr></a>
<mt:IfCommentsAccepted>
                    | <$mt:CommentReplyToLink$>
</mt:IfCommentsAccepted>
                </span>
            </div>
        </div>
        <div class="comment-content">
            <$mt:CommentBody$>
        </div>
    </div>
</div>

３．「yahoo」と任意の文字数のパラメータを表示

「yahoo:」という文字列と、先頭10文字のパラメータを表示する場合、MTCommentAuthorLinkタグに、次のregex_replaceモディファイアを追加します。

<mt:CommentAuthorLink regex_replace="/https:\/\/me\.yahoo\.co\.jp\/a\/(\S{10})\S{26}<\/a>$/","yahoo:$1" />

変更後のコメント欄

regex_replaceモディファイアに含まれる「{10}」や「{26}」の部分を、合計36になるように変更すれば、任意の文字数を取り出せます。

４．「https://me.yahoo.co.jp/a/」と任意の文字数のパラメータを表示

URLの「https://me.yahoo.co.jp/a/」と、先頭10文字のパラメータを表示する場合、MTCommentAuthorLinkタグに、次のregex_replaceモディファイアを追加します。

<mt:CommentAuthorLink regex_replace="/(https:\/\/me\.yahoo\.co\.jp\/a\/\S{10})\S{26}<\/a>$/","$1" />

変更後のコメント欄

Movable Typeのブログ記事のコメント欄にHTMLタグの挿入ボタンを表示するカスタマイズです。

このカスタマイズは、MT3の時代にエントリーした「コメントにHTMLタグ挿入ボタンをつける（改）」のMT4/MT5版です。ご質問を頂きましたので本エントリーにて紹介致します。

以下、「クラシックブログ」テーマをサンプルに、カスタマイズ方法を説明します。

１．HTMLタグ挿入ボタンのダウンロード

以下のファイルをダウンロードして展開します。

HTMLタグ挿入ボタン

次に、ブログのサイトパス（index.html があるディレクトリ）直下に images ディレクトリを作り、展開した中にある以下の画像ファイルを images 配下にアップロードしてください。

• html-bold.gif
• html-italic.gif
• html-underline.gif
• html-link.gif
• html-quote.gif

２．JavaScriptファイルの作成

以下のリンクを右クリックして、commentButton.jsというファイル名で保存してください。

commentButton.js

保存後、ブログのサイトパス直下にアップロードしてください。

３．テンプレートの修正（JavaScriptファイルのインクルード追加）

ブログ記事アーカイブに下記の青色で示した1行を追加します。

…前略…
<$mt:Include module="HTMLヘッダー"$>
<script type="text/javascript" src="<mt:BlogURL />commentButton.js" ></script>
…後略…

４．テンプレートの修正（HTMLタグ挿入ボタンの設定）

「デザイン」→「テンプレート」をクリックし、「テンプレートモジュール」一覧にある「コメント」をクリックして、青色で示した内容を追加します。

…前略…
<div id="comments-open-text">
    <label for="comment-text">コメント
    <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <div class="field-buttons">
        <a title="太字" href="#" onclick="return formatStr(document.comments_form.text, 'strong')"><img class="button" src="<mt:BlogURL />images/html-bold.gif" alt="太字" width="22" height="16" /></a>
        <a title="イタリック" href="#" onclick="return formatStr(document.comments_form.text, 'em')"><img class="button" src="<mt:BlogURL />images/html-italic.gif" alt="イタリック" width="22" height="16" /></a>
        <a title="アンダーライン" href="#" onclick="return formatStr(document.comments_form.text, 'u')"><img class="button" src="<mt:BlogURL />images/html-underline.gif" alt="アンダーライン" width="22" height="16" /></a>
        <a title="ハイパーリンク" href="#" onclick="return insertLink(document.comments_form.text)"><img class="button" src="<mt:BlogURL />images/html-link.gif" alt="ハイパーリンク" width="22" height="16" /></a>
        <a title="引用" href="#" onclick="return formatStr(document.comments_form.text, 'blockquote')"><img class="button" src="<mt:BlogURL />images/html-quote.gif" alt="引用" width="22" height="16" /></a>
    </div>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtCommentFormOnFocus()"></textarea>
</div>
…後略…

５．編集ボタン表示スタイルの追加

スタイルシートに下記を追加してください。

.field-buttons {
    width: 415px;
    height: 20px;
    margin-top: -17px;
    text-align: right;
}
.field-buttons img {
    border: 0;
    margin-left: 3px;
}

６．コメント欄でのHTMLタグの使用を有効にする

最後に、管理画面の「設定」→「コミュニケーション」にある「HTMLを許可」をチェックし、「HTMLタグを制限」から「カスタム設定」を選択し、テキストフィールドに下記の内容を設定します。この設定を行っておかないと、HTMLタグ挿入ボタンを使って挿入したHTMLタグが、投稿コメントに反映されません。

a href,strong,br /,p,em,u,ul,li,blockquote

これで全体を再構築して、HTMLタグ挿入ボタンが表示されれば完成です。

当ブログ（Movable Type）のコメント投稿にtwitterのOAuth認証を導入しました。

投稿コメントにはTwitterのロゴやユーザー名が反映されます。リンクをクリックすれば、Twitterのユーザーページにジャンプします。

当ブログのコメント欄では次のように表示されます。

１．考え方

OAuth認証は、サービスプロバイダが提供しているAPIを利用することが前提と思われますが、OpenIDのようなユーザー認証としても使えるのではないかと思い、プラグインを開発してみました。

処理イメージは次の通りです。図の右上はよくあるOAuthの処理イメージです。2でリクエストトークン取得、6でアクセストークンを取得します。このあとAPIを利用は行わず、認証されたユーザーとみなして、7でサインインしたブログ記事ページにリダイレクトさせています。

２．認証方法

冒頭の繰り返しになりますが、クラシックブログテーマを用いた認証手順を紹介します。まず、「サインイン」のリンクをクリック。

「twitter」を選択して、ロゴをクリックします。

アカウントへの接続要求画面にリダイレクトするので、「許可する」をクリックします。

利用しているブラウザでTwitterにログインしていない状態であれば、ユーザー名・パスワードを入力する画面が表示されます。

これでサインインできました。

以上です。OAuthでこういう使い方はおかしいのでは？ということであればご指摘ください。

当ブログのサイドバーなどに表示している「最近のコメント」は、「「最近のコメント」をネイティブタグのみで適正に表示する」で紹介している方法で、

• 新着コメントがあるエントリーを降順に表示
• エントリー内のコメントを昇順に表示

としているのですが、Movable Type 5にバージョンアップしてから上記の規則にしたがった表示にならなくなりました。

１．問題

下の画像は、バージョンアップ後の「最新コメント500」のページのコメント表示です。一番下のコメント（9月26日投稿）よりも、それ以前に投稿されたコメントがあるエントリーが上に表示されています。

２．原因

ソースコードを確認したところ、Movable Type 5でのMTCommentsタグの動作が変更されていました。Movable Type 4では、MTCommentsタグにsort_orderモディファイアを設定していない場合、sort_orderモディファイアは「descend」がデフォルト値となりますが、Movable Type 5では「ascend」がデフォルト値となるようです。

例えば、以下のサブテンプレートは、Movable Type 4ではコメントが降順に出力されますが、Movable Type 5では昇順に出力されます。

<mt:Comments lastn="10">
・・・
</mt:Comments>

Movable Type 4でこのようなサブテンプレートを利用している場合、Movable Type 5にバージョンアップした後、異なる出力になる可能性があります。

冒頭の「最近のコメント500」のサブテンプレートにはsort_orderモディファイアを設定していなかったため、適正に表示されていませんでした。

３．対処方法

コメントを降順に出力する必要がある場合、次のように、MTCommentsタグに「sort_order="descend"」を付与してください。

<mt:Comments lastn="10" sort_order="descend">
・・・
</mt:Comments>

テンプレート修正後の表示は次の通りです。

Movable Typeで、ブログ記事とコメントをひとつのフィードにまとめて出力するカスタマイズを紹介します。

１．利用シーン

このフィードは、掲示板やFAQなどのような、コメント投稿の比重が高いサイトでの利用を想定しています。

例えばコミュニティ掲示板で、トピックに対するコメントをフィードで配信している場合、コメントしか購読できないと、元のトピックの内容が分かりません。元のトピックを読むには、表示されているコメントの元ページから辿るか、トピックを配信するフィードを別に購読する必要があります。次のキャプチャは、Firefox 3でフィードを表示したものです。

変更前

トピックとコメントをひとつのフィードにまとめて時系列に表示することで、掲示板全体の流れを購読することができます。

変更後

もちろん、通常のブログでも利用できます。

２．フィード用テンプレートの作成

フィード用のインデックステンプレートを作成します。

テンプレート名：トピックとコメント ※名前は何でも構いません
ファイル名：comments.xml
テンプレートの内容：以下

<$mt:HTTPContentType type="application/atom+xml"$><?xml version="1.0" encoding="<$mt:PublishCharset$>"?>
<feed xmlns="http://www.w3.org/2005/Atom">
    <title><$mt:BlogName remove_html="1" encode_xml="1"$></title>
    <link rel="alternate" type="text/html" href="<$mt:BlogURL encode_xml="1"$>" />
    <link rel="self" type="application/atom+xml" href="<$mt:Link template="feed_recent"$>" />
    <id>tag:<$mt:BlogHost exclude_port="1" encode_xml="1"$>,<$mt:TemplateCreatedOn format="%Y-%m-%d"$>:<$mt:BlogRelativeURL encode_xml="1"$>/<$mt:BlogID$></id>
    <updated><mt:Entries lastn="1"><$mt:EntryModifiedDate utc="1" format="%Y-%m-%dT%H:%M:%SZ"$></mt:Entries></updated>
    <mt:If tag="BlogDescription"><subtitle><$mt:BlogDescription remove_html="1" encode_xml="1"$></subtitle></mt:If>
    <generator uri="http://www.sixapart.com/movabletype/"><$mt:ProductName version="1"$></generator>
<mt:SetVar name="number" value="5" />
<mt:Entries lastn="$number">
<mt:EntryDate format="%Y%m%d%H%M%S" setvar="date" />
<mt:SetVarBlock name="feed_data{$date}">
<entry>
    <title><$mt:EntryTitle remove_html="1" encode_xml="1"$></title>
    <link rel="alternate" type="text/html" href="<$mt:EntryPermalink encode_xml="1"$>" />
    <id><$mt:EntryAtomID$></id>
    <published><$mt:EntryDate utc="1" format="%Y-%m-%dT%H:%M:%SZ"$></published>
    <updated><$mt:EntryModifiedDate utc="1" format="%Y-%m-%dT%H:%M:%SZ"$></updated>
    <summary><$mt:EntryExcerpt remove_html="1" encode_xml="1"$></summary>
    <author>
        <name><$mt:EntryAuthorDisplayName encode_xml="1"$></name>
        <uri><$mt:CGIPath encode_xml="1"$><$mt:CommunityScript encode_xml="1"$>?__mode=view&amp;blog_id=<$mt:BlogID$>&amp;id=<$mt:EntryAuthorID$></uri>
    </author>
    <mt:EntryCategories>
        <category term="<$mt:CategoryLabel encode_xml="1"$>" scheme="http://www.sixapart.com/ns/types#category" />
    </mt:EntryCategories>
    <mt:EntryIfTagged><mt:EntryTags><category term="<$mt:TagName normalize="1" encode_xml="1"$>" label="<$mt:TagName encode_xml="1"$>" scheme="http://www.sixapart.com/ns/types#tag" />
    </mt:EntryTags></mt:EntryIfTagged>
    <content type="html" xml:lang="<$mt:BlogLanguage ietf="1"$>" xml:base="<$mt:BlogURL encode_xml="1"$>">
        <$mt:EntryBody encode_xml="1"$>
        <$mt:EntryMore encode_xml="1"$>
    </content>
</entry>
</mt:SetVarBlock>
</mt:Entries>
<mt:Comments lastn="$number">
        <mt:CommentDate format="%Y%m%d%H%M%S" setvar="date" />
<mt:SetVarBlock name="feed_data{$date}">
<entry>
<mt:CommentEntry>
    <title>「<$mt:EntryTitle remove_html="1" encode_xml="1"$>」へのコメント</title>
    <link rel="alternate" type="text/html" href="<$mt:EntryPermalink encode_xml="1"$>" />
    <id><$mt:EntryAtomID$><$mt:CommentID$></id>
    <published><$mt:CommentDate utc="1" format="%Y-%m-%dT%H:%M:%SZ"$></published>
    <updated><$mt:CommentDate utc="1" format="%Y-%m-%dT%H:%M:%SZ"$></updated>
    <summary><$mt:CommentBody trim_to="60" remove_html="1" encode_xml="1"$>...</summary>
    <author>
        <name><$mt:CommenterUsername encode_xml="1"$></name>
        <uri><$mt:CGIPath encode_xml="1"$><$mt:CommunityScript encode_xml="1"$>?__mode=view&amp;blog_id=<$mt:BlogID$>&amp;id=<$mt:CommenterID$></uri>
    </author>
    <mt:EntryCategories>
        <category term="<$mt:CategoryLabel encode_xml="1"$>" scheme="http://www.sixapart.com/ns/types#category" />
    </mt:EntryCategories>
    <mt:EntryIfTagged><mt:EntryTags><category term="<$mt:TagName normalize="1" encode_xml="1"$>" label="<$mt:TagName encode_xml="1"$>" scheme="http://www.sixapart.com/ns/types#tag" />
    </mt:EntryTags></mt:EntryIfTagged>
    <content type="html" xml:lang="<$mt:BlogLanguage ietf="1"$>" xml:base="<$mt:BlogURL encode_xml="1"$>">
        <$mt:CommentBody encode_xml="1"$>
    </content>
</mt:CommentEntry>
</entry>
</mt:SetVarBlock>
</mt:Comments>
<mt:loop name="feed_data" sort_by="key reverse">
  <mt:if name="__counter__" le="$number">
<mt:GetVar name="__value__" />
  </mt:if>
</mt:loop>
</feed>

３．テンプレートの解説

作成したインデックステンプレートでは、まず、最新のブログ記事について、指定件数分、ハッシュ変数に設定します。同じように、最新のコメントについて、指定件数分、先程と同じハッシュ変数に設定します。ハッシュのキーにはブログ記事投稿時間、またはコメント投稿時間を利用します。設定後、ハッシュのキーを降順にソートして出力します。

フィード出力数は、次のMTSetVarタグで設定します。

<mt:SetVar name="number" value="15" />

また、フィード出力数とMTEntriesタグ、MTComentsタグのlastnモディファイアの値は変数numberを使って、すべて同数にしています。

<mt:Entries lastn="$number">
…中略…
</mt:Entries>
<mt:Comments lastn="$number">
…中略…
</mt:Comments>

例えばフィード出力数が「15」であれば、MTEntriesタグ、MTComentsタグのlastnモディファイアの値も「15」になります。こうしておけば、フィードの出力内容がブログ記事のみ、またはコメントのみになった場合でも不足なく表示されます。

収集したデータはMTLoopタグで出力します。

<mt:loop name="feed_data" sort_by="key reverse">
  <mt:if name="__counter__" le="$number">
<mt:GetVar name="__value__" />
  </mt:if>
</mt:loop>

変数numberを「15」にしておけば、最大15回繰り返します。

４．フィード用リンクの作成

次のような、フィード用リンクのウィジェットテンプレートを作成します。

<ul>
  <li><img src="<$mt:StaticWebPath$>images/status_icons/feed.gif" alt="購読する" width="9" height="9" /> <a href="<$mt:BlogURL$>comments.xml" title="購読する">すべての掲示板とコメント</a></li>
</ul>

Movable Type 4、Movable Type 5で、コメント一覧からウェブページのコメントを除外して表示するカスタマイズを紹介します。

変更前

変更後

１．基本

MTCommentsタグは、MTEntriesタグ内部で使った場合はブログ記事へのコメント、MTPagesタグ内部で使った場合はウェブページのコメントを出力しますが、単独（=MTEntriesタグやMTPagesタグで括らない）で利用した場合は、ブログ記事／ウェブページの両方のコメントを出力する仕様になっています。

MTCommentsタグには、ブログ記事／ウェブページのどちらへのコメントかを判定するモディファイアは用意されていません。

投稿コメントが、ブログ記事／ウェブページのどちらへのコメントかを判定するには、次のようにMTCommentsタグ、MTCommentEntryタグ、MTIfタグを組み合わせます。

<mt:Comments>
  <mt:CommentEntry>
    <mt:if tag="EntryClass" eq="entry">
      [ここに出力内容を記述]
    </mt:if>
  </mt:CommentEntry>
</mt:Comments>

MTIfタグにはtagモディファイアを与え、MTEntryClassタグを判定します。MTEntryClassタグの内容が「entry」であればブログ記事への投稿、「page」であればウェブページへの投稿を示します。

２．ブログ記事のコメントのみを出力する

MTCommentsタグを単独で利用して、ブログ記事のコメントのみを出力するサブテンプレートを紹介します。

冒頭の画像のように、デフォルトの「最近のコメント」ウィジェットでブログ記事のコメントのみを出力するには、次のように変更します。青色が追加部分、赤色が変更部分です。

<mt:If tag="BlogCommentCount">
  <mt:SetVar name="comment_counter" value="0" />
  <mt:Comments lastn="0" sort_order="descend">
    <mt:CommentsHeader>
<div class="widget-recent-comments widget">
  <h3 class="widget-header">最近のコメント</h3>
  <div class="widget-content">
    <ul>
    </mt:CommentsHeader>
    <mt:CommentEntry>
      <mt:if tag="EntryClass" eq="entry">
        <mt:if name="comment_counter" lt="10">
      <li><strong><$mt:CommentAuthor$>:</strong> <$mt:CommentBody remove_html="1" words="10"$> <a href="<$mt:CommentLink$>" title="<mt:CommentEntry><$mt:EntryTitle$></mt:CommentEntry>へのコメント">続きを読む</a></li>
        <mt:SetVar name="comment_counter" op="++" />
        </mt:if>
      </mt:if>
    </mt:CommentEntry>
    <mt:CommentsFooter>
    </ul>
  </div>
</div>
    </mt:CommentsFooter>
  </mt:Comments>
</mt:If>

MTIfタグのeqモディファイアの値「entry」を「page」に変更すれば、ウェブページへのコメント一覧を表示できます。

「「最近のコメント」をネイティブタグのみで適正に表示する」で紹介しているサブテンプレートでブログ記事のみを出力する場合、次のように変更します。青色が追加部分、赤色が変更部分です。

MTCommentEntryの終了タグは位置を変更しています。これは、ウェブページの処理を行った場合に不要な処理が実行されないようにするための対処です。

<mt:SetVar name="comment_counter" value="0" />
<mt:Comments lastn="0" sort_order="descend">
  <mt:CommentEntry>
    <mt:if tag="EntryClass" eq="entry">
      <mt:if name="comment_counter" lt="10">
        <mt:SetVarBlock name="entry_title"><a href="<mt:EntryPermalink />"><mt:EntryTitle /></a></mt:SetVarBlock>
        <mt:SetVarBlock name="entry_comment">
    <li><a href="<mt:EntryPermalink />#c<mt:CommentID />"><mt:CommentAuthor default="Anonymous"></a> <mt:CommentDate format="%m/%d"></li>
        </mt:SetVarBlock>
        <mt:SetVar name="comment_list{$entry_title}" value="$entry_comment" prepend="1" />
        <mt:SetVar name="comment_counter" op="++" />
      </mt:if>
      <mt:SetVar name="flag" value="0" />
      <mt:loop name="title_list">
        <mt:if name="__value__" eq="$entry_title">
          <mt:SetVar name="flag" value="1" />
        </mt:if>
      </mt:loop>
      <mt:unless name="flag">
        <mt:SetVar name="push(title_list)" value="$entry_title" />
      </mt:unless>
    </mt:if>
  </mt:CommentEntry>
</mt:Comments>
 
<dt class="sidetitle">
Recent Comments
</dt>
<dd class="side">
  <ul>
<mt:loop name="title_list">
    <li>
    <mt:getVar name="__value__" />
      <ul>
    <mt:getVar name="comment_list{$__value__}" />
      </ul>
    </li>
</mt:loop>
  </ul>
</dd>

Movable Typeの投稿コメントに、例えば「この画像です」みたいな感じで、別サイトにある画像のimg要素を挿入されても、デフォルトの設定ではコメントに反映されません。

コメント

投稿されたコメント

本エントリーでは、次のように、コメントに設定したimg要素を反映する方法を紹介します。

投稿されたコメント

１．img 要素を許容する

img 要素を許容するには、管理画面のナビゲーションから「設定」→「コミュニケーション」をクリックし、移動したページにある「HTMLを許可」がチェックされていることを確認し、さらに「HTMLタグを制限」の項目から「カスタム設定」を選択します。

そして「カスタム設定」のテキストフィールドに「img src」を設定し、「変更を保存」をクリックします。

「標準の設定」にある内容をコピーすれば、他のHTML要素も許容されるので、必要な要素をカンマ区切りで追加します。下はa要素、br要素、p要素を設定した例です。

属性が必要な要素は、要素名の後に属性名を設定します。

２．img 要素を(X)HTML validにする

「img src」という記述だけではalt属性が許容されないため、コメント投稿者がalt属性を記述しても除去されてしまい、ページが(X)HTML validになりません。

(X)HTML validにするには、「カスタム設定」の設定内容を「img src alt」にします。

３．他の属性も追加する

width属性、height属性を追加しておけば、コメント投稿者が画像サイズを指定することもできます。title属性も追加しておくとよいでしょう。

Movable Type（MT）のコメントに関する機能のひとつに、コメント一覧の「アクション...」に表示される、次の4つの項目があります。

• コメント投稿者を承認
• コメント投稿者の承認を解除
• コメント投稿者を禁止
• コメント投稿者の禁止を解除

本エントリーではこの4つの項目の機能について解説します。なお、このエントリーの内容については、「Movable Type 4.2 パーフェクトガイド」の「7.4 コメント認証とTypeKeyの登録」で、図入りで解説しています。

１．「コメント投稿者」について

まず、「コメント投稿者」という用語の定義です。

「コメント投稿者」とは、任意の認証方式を利用して投稿したコメントの投稿者を指し、認証なしで投稿したコメントの投稿者はここには含まれません。

２．「承認」と「禁止」について

「承認」とは、任意の認証方式を利用して投稿したコメントのユーザーに対し、次回以降のコメント投稿を自動公開することを指します。「禁止」はその逆で、あるユーザーに対し、任意の認証方式を利用してのコメント投稿を禁止することを指します。

３．「承認」と「禁止」を有効にするためのウェブサイト・ブログの設定

この機能は、ナビゲーションの「設定」→「コミュニケーション」→「コメントポリシー」→「即時公開する条件」で、「ブログで承認されたコメント投稿者のみ」を選択している場合のみ有効になります（多分）。

この設定にしておくことで、管理者が投稿コメントのユーザーに対し、「承認」または「禁止」の設定を行うことで、コメントの自動公開または投稿禁止の設定を制御することができます。

４．「コメント投稿者を承認」の動作

以下、TypePad認証を利用したコメント投稿の例で示します。

下の図は、コメント投稿直後のコメント一覧です。このコメントは非公開で、コメント投稿者は承認されていない状態です。承認されていない場合、ユーザー名の右側に表示されている人型のアイコンには、何もついていません。

このコメントをチェックして「公開」をクリックすれば、コメント自体は公開されます（注意アイコンがチェックマークのアイコンに変化します）が、このユーザーは次のコメント投稿でも保留されてしまいます。

そこで、コメントを選択した状態で「コメント投稿者を承認」を選択します。

人のアイコンにチェックマークがつきました。これで、このコメント投稿者のコメントは、次回のコメント投稿時に、自動的に公開されます。

なお、コメント保留の状態で承認だけを行っても、該当コメントは公開されないので注意してください。

５．「コメント投稿者を承認を解除」の動作

４項と逆の動作で、コメント投稿者の承認を解除します。これで、コメント投稿者のコメントを公開するには管理者による公開が必要になります。

６．「コメント投稿者を禁止」の動作

コメント投稿者が、その認証方式を使用してコメントを投稿できないようにします。

禁止すると、人のアイコンに赤いマークがつきます。

禁止された認証方式でサインインすると、次のようなメッセージが表示されます。

７．「コメント投稿者を禁止」の動作

６項と逆の動作で、コメント投稿者の禁止を解除します。これで、コメント投稿者は該当の認証方式でコメントを投稿できるようになります。

８．Movable Type認証のユーザーについて

認証方式にはMovable Typeユーザーも含まれますが、他の認証方式と若干異なり、コメント登録者として設定した時点で承認状態となります。また、禁止への遷移は可能です。

ただし、Movable Type 4.2xまでは若干動作が異なります（このエントリーはMovable Type 5.0x を元に確認しています）。

９．状態遷移について

上記の説明では、承認→承認の解除→禁止→禁止の解除という流れを示しましたが、承認→禁止、あるいは禁止→承認という、一足飛びの状態遷移も可能です。

「Movable Type 5 のコメントのページ分割機能（その1：概要）」で紹介した、Movable Type 5（MT5.0）における、コメントのページ分割のカスタマイズ方法です。

ここでは未設定のブログテーマに新たに設定する手順を説明したいと思います。

１．theme.yaml の修正

システムテンプレートに「コメント一覧」があることが前提となるため、利用中のテーマに「コメント一覧」システムテンプレートがない場合、利用中のテーマの theme.yaml を任意のエディタで開いて、青色部分を追加します。

…前略…
system:
    comment_listing:
        label: Comment Listing
    comment_preview:
        description_label: Displays preview of comment.
        label: Comment Preview
…後略…

また、利用中のテーマの templates ディレクトリ配下に以下の内容を comment_listing.mtml というファイル名で保存してください。

{
    "direction": "<mt:Var name="commentDirection">",
    "comments": "<mt:Comments sort_order="$commentDirection"><$mt:Include module="<__trans phrase="Comment Detail">" replace="\","\\" replace='"','\"' strip_linefeeds="1"$></mt:Comments>"
}

設定が完了したらテンプレートの初期化を行なってください。

２．ブログ記事テンプレート・ウェブページテンプレートの修正

head 要素部分に以下の内容を追加してください。

<$mt:Var name="comments_per_page" value="50"$>
<mt:If tag="EntryCommentCount" gt="$comments_per_page">
<script type="text/javascript">
     MT.entryID = <$mt:EntryID$>;
     MT.commentsPerPage = <$mt:Var name="comments_per_page"$>;
     MT.entryCommentCount = <$mt:EntryCommentCount$>;
     MT.commentIds = [<mt:Comments sort_order="ascend" glue=","><mt:CommentID></mt:Comments>];
</script>
</mt:If>

1行目の Var タグの value モディファイアの値「50」が1ページあたりの表示コメント数になるので、好きな値に変更してください。

３．インデックステンプレート「JavaScript」の変更

MT4 以前のJavaScript（mt.js） を利用している場合、MT5 のクラシックブログなど、デフォルトのテンプレートの内容に差し替えてください。

４．コメントテンプレートモジュールの修正

コメントテンプレートモジュールを修正します（赤色部分を青色部分の内容に差し替え）。例は当サイトの配布テンプレートです。

変更前

<mt:ifCommentsActive>
<div id="comments">
 
   <mt:if name="comment_preview_template">
   <mt:include module="コメント入力フォーム" />
   </mt:if>
 
   <mt:comments>
 
   <mt:commentsHeader><h3 class="comments-header">コメント<mt:entryCommentCount singular="[1]" plural="[#]" none="[0]" /></h3></mt:commentsHeader>
      <mt:include module="コメント詳細" />
   <mt:commentsFooter></mt:commentsFooter>
   </mt:comments>
 
   <mt:unless name="comment_preview_template">
   <mt:include module="コメント入力フォーム" />
   </mt:unless>
 
</div>
</mt:ifCommentsActive>

変更後

<mt:ifCommentsActive>
<div id="comments">
 
   <mt:if name="comment_preview_template">
   <mt:include module="コメント入力フォーム" />
   </mt:if>
 
<mt:Comments lastn="$comments_per_page">
  <mt:CommentsHeader>
<h2 class="comments-header"><$mt:EntryCommentCount singular="コメント(1)" plural="コメント(#)" none="コメント(0)"$></h2>
<mt:If tag="EntryCommentCount" gt="$comments_per_page">
<ul id="top-comment-nav">
  <li id="top-prev-comments">
    <a href="javascript://" id="top-prev-comments-link" title="古いコメント">&lt;&lt;&nbsp;古いコメント</a>
  </li>
  <li id="top-num-comments"><span id="top-current-comments"></span></li>
  <li id="top-next-comments">
    <a href="javascript://" id="top-next-comments-link" title="新しいコメント">新しいコメント&nbsp;&gt;&gt;</a>
  </li>
</ul>
</mt:If>
<div id="comments-content" class="comments-content" style="clear: left;">
  </mt:CommentsHeader>
  <$mt:Include module="コメント詳細"$>
  <mt:CommentsFooter>
</div>
  </mt:CommentsFooter>
</mt:Comments>
<mt:If tag="EntryCommentCount" gt="$comments_per_page">
<mt:Ignore>ページネーションスクリプトによって変更されています。</mt:Ignore>
<ul id="comment-nav">
  <li id="prev-comments">
    <a href="javascript://" id="prev-comments-link" title="古いコメント">&lt;&lt;&nbsp;古いコメント</a>
  </li>
  <li id="num-comments"><span id="current-comments"></span></li>
  <li id="next-comments">
    <a href="javascript://" id="next-comments-link" title="新しいコメント">新しいコメント&nbsp;&gt;&gt;</a>
  </li>
</ul>
</mt:If>
 
   <mt:unless name="comment_preview_template">
   <mt:include module="コメント入力フォーム" />
   </mt:unless>
 
</div>
</mt:ifCommentsActive>

５．スタイルシートの修正

スタイルシートに以下の内容を追加します。これはページナビゲーション部分のデザインの調整なので、内容は適宜修正してください。

#top-comment-nav, #comment-nav {
  list-style-image:none;
  list-style-position:outside;
  list-style-type:none;
  margin:0 0 1em;
  padding:0;
  text-align:center;
  width:100%;
}
#top-comment-nav li, #comment-nav li {
  display:inline;
  padding:0;
}
#top-prev-comments, #prev-comments {
  margin:0 1em 0 0;
  text-align:left;
}
#top-num-comments, #num-comments {
  text-align:center;
}
#top-next-comments, #next-comments {
  margin:0 0 0 1em;
  text-align:right;
}

Movable Type 5 のコメント分割表示機能を紹介します。

機能自体は Movable Type 4.3で盛り込まれているので目新しいものではありませんが、「Movable Type 4.3 α版レポート」で簡単な紹介しか行っていなかったので、改めてエントリーしたいと思います。

１．概要

ブログ記事やウェブページへのコメント投稿数が一定数を超えると次のようにページ分割されます。

ページ送りをすると Ajax を使って表示されます。

この機能はテンプレートの設定で利用することができ、「クラシックブログ」等でも使えます。なお、デフォルトのページ分割数は 50 になっていますが、任意の件数に変更することができます。

２．分割ページ数を変更する

ブログ記事テンプレート・ウェブページテンプレートにある、以下の「50」の部分を変更します。

<$mt:Var name="comments_per_page" value="50"$>

とりあえず以上です。

時間の都合上、テーマへの適用方法については別エントリーで紹介します。

Movable Type のコメントでは Captcha を利用できます。本エントリーでは Captcha の表示のカスタマイズをいくつか紹介します。

１．基礎知識

Captcha の表示をカスタマイズするには、lib/MT/Util/Captcha.pm を編集します。

また、デフォルトでは、Captcha で表示される文字は以下のようです。数字の0 と 1、アルファベットの l と o は含まれていません（z が2つあるのが謎ですが...）。

23456789abcdefghjkmnzpqrstuvwxyz

２．表示文字を変更する

次の行を変更します。

sub READABLECHARS { '23456789abcdefghjkmnzpqrstuvwxyz' };

以下の部分も変更しないと反映されないようです。

...前略...
sub _generate_code {
...中略...
    foreach my $i (0..($len-1)) {
      my $byte = ord(pack('H2', substr($genval, $i*2, 2)));
      my $x = ($byte & 31);
 
      $code .= substr(READABLECHARS(), $byte & 31, 1);
    }
...後略...

試しに「31」の部分を「1」にすると、次のようになりました。

３．表示文字数を変更する

次のLENGTH を変更します。

sub LENGTH { 6 };

値を「8」にすると次のようになります。

単純に値を変更するだけではきれいに表示されないようですが色々試してみるとよいでしょう。

配布中の CommentCustomField プラグインをバージョンアップしました。

１．追加機能

追加した機能は次の通りです。

• コメント投稿フィールドに、ラジオボタン/チェックボックス/プルダウンメニューの項目選択用テンプレートタグの提供
• コメントプレビュー画面に、ラジオボタン/チェックボックス/プルダウンメニューのユーザ選択状態を表示するテンプレートタグの提供
• コメント表示フィールドへの投稿データ表示用テンプレートタグの提供
• ブログ管理画面に各フォームデータの初期値を設定可能
• 設定した初期値に選択状態（checked/selected）の設定が可能
• コメント編集画面で各入力値の編集が可能

この機能追加によって、コメント投稿者がラジオボタン/チェックボックス/プルダウンメニューから項目を選択したり、選択した項目をコメント一覧に表示できるようになります。

ラジオボタンの完成例

チェックボックスの完成例

プルダウンメニューの完成例

投稿コメントの表示例

また、ブログ管理画面では、各項目のデータ設定が可能です。

データを選択状態（checked/selected）にしたい場合は、各項目の直後にアスタリスク（*）を入力しておきます。

上記の選択状態を反映させたフォームの初期表示状態は次のようになります。

また、コメント編集画面で、入力されたデータの編集が可能です。

また、画像はアイテムとしての管理対象になり、本プラグインで追加した画像情報表示のためのブロックタグ MTCommentCustomFieldAsset で MTAsset 関連タグを組み合わせれば画像情報を自由に表示することができます。

２．ダウンロード

ダウンロードは下記のリンクからどうぞ。

CommentCustomField プラグイン

Movable Type のコメントにカスタムフィールドを追加する CommentCustomField プラグインと HighSlide JS を組み合わせて、アップロードした画像をズームアップするカスタマイズを紹介します。

以下のサンプルページで画像をクリックして動作を確認してください。

ここでは CommentCustomField プラグインの解説にしたがって、ブログ記事ページにアップロード画像を表示するカスタマイズを行なっていることを前提に説明を進めます。

１．HighSlide JS の設定

HighSlide JS の設定方法は、「Highslide JS でサムネイル画像を拡大表示する 」を参照してください。本エントリーでの解説は省略します。

２．テンプレートの修正

ブログ管理画面の「デザイン」→「テンプレート」をクリックし、「既定のブログ」の場合は「コメント」テンプレートモジュールをクリック、当ブログの配布テンプレートの場合は「コメント詳細」テンプレートモジュールをクリックし、赤色部分を青色の内容に変更します。

変更前

...前略...
<mt:Comments>
...中略...
    <div class="comment-content">
        <$mt:CommentBody$>
        <mt:if tag="CommentCustomFieldAsset">
            <p>
            <mt:CommentCustomFieldAsset>
                <mt:AssetThumbnailLink width="200" />
            </mt:CommentCustomFieldAsset>
            </p>
        </mt:if>
...中略...
    </div>
</mt:Comments>
...後略...

変更後

...前略...
<mt:Comments>
...中略...
    <div class="comment-content">
        <$mt:CommentBody$>
        <mt:if tag="CommentCustomFieldAsset">
            <p>
            <mt:CommentCustomFieldAsset>
                <a href="<mt:AssetURL />" class="highslide" onclick="return hs.expand(this)"><img src="<mt:AssetThumbnailURL width="100" />" /></a>
            </mt:CommentCustomFieldAsset>
            </p>
        </mt:if>
...中略...
    </div>
</mt:Comments>
...後略...

ズーム前のサイズを変更する場合は、width="100" の部分を書き換えてください。

ブログ記事ページ・ウェブページに、その記事に投稿されたコメント一覧をサイドバーに表示するカスタマイズです。

そもそもコメント一覧はブログ記事本文下に表示されるようになっていますが、記事本文が長文の場合、スクロールせずに最近投稿されたコメントを見たい場合に便利です。また、コメント投稿者名をクリックすれば、該当のコメントまで移動します。

デフォルトテンプレートの設定例

公開テンプレートの設定例

以下、設定方法です。

１．設定方法

ブログ管理画面の「デザイン」→「ウィジェット」をクリックし、次の画面で「ウィジェットテンプレートを作成」をクリック。

以下の内容を設定。

• ウィジェットの名前：ブログ記事のコメント
• ウィジェットの内容：以下のいずれかをペースト

デフォルトテンプレート

<mt:if name="entry_archive">
  <mt:if tag="EntryCommentCount">
    <mt:Comments lastn="10" sort_order="descend">
      <mt:CommentsHeader>
<div class="widget-recent-comments widget">
  <h3 class="widget-header">最近のコメント</h3>
  <div class="widget-content">
    <ul>
      </mt:CommentsHeader>
      <li><a href="<$mt:CommentLink$>" title="<mt:CommentEntry><$mt:EntryTitle$></mt:CommentEntry>へのコメント"><$mt:CommentAuthor$></a> <mt:commentDate format="%m/%d"$></li>
      <mt:CommentsFooter>
    </ul>
  </div>
</div>
      </mt:CommentsFooter>
    </mt:Comments>
  </mt:If>
</mt:If>

公開テンプレートの場合

<mt:if name="entry_archive">
  <mt:if tag="EntryCommentCount">
    <mt:Comments lastn="10" sort_order="descend">
      <mt:CommentsHeader>
<dt class="sidetitle">
Entry Comments
</dt>
<dd class="side">
  <ul>
      </mt:CommentsHeader>
    <li>
      <a href="<mt:entryLink$>#c<mt:commentID$>" title="c<mt:commentID$>"><mt:commentAuthor default="Anonymous"></a> <mt:commentDate format="%m/%d"$>
    </li>
      <mt:CommentsFooter>
  </ul>
</dd>
      </mt:CommentsFooter>
    </mt:Comments>
  </mt:if>
</mt:if>

設定後、「保存」をクリック。

ブログ管理画面の「デザイン」→「ウィジェット」をクリックし、コメント一覧を表示させたい（任意の）ウィジェットセットの名前をクリック。ここでは例として「3カラムのサイドバー(サブ)」をクリックします。

「利用可能」にある「ブログ記事のコメント」を「インストール済み」にドラッグします。

設定後、「変更を保存」をクリックして全体を再構築すれば完了です。

配布中の CommentCustomField プラグインをバージョンアップしました。

１．追加機能

追加した機能は次の通りです。

• 画像のアップロード機能を追加
• 画像情報を表示するテンプレートタグの追加

この機能追加によって、次のように、コメント投稿者がアップロードした画像をコメント一覧に表示できるようになります。

ブログ管理画面では、画像のアップロード先やアップロード可能なファイルサイズの設定も可能です。

また、画像はアイテムとしての管理対象になり、本プラグインで追加した画像情報表示のためのブロックタグ MTCommentCustomFieldAsset で MTAsset 関連タグを組み合わせれば画像情報を自由に表示することができます。

２．ダウンロード

ダウンロードは下記のリンクからどうぞ。

CommentCustomField プラグイン

３．追加機能に伴う注意事項

配布元のページでも解説を追加していますが、画像に対応させるために、コメントフォームの form 要素に enctype 属性を追加してください。

変更前

<form method="post" action="<$mt:CGIPath$><$mt:CommentScript$>" name="comments_form" id="comments-form" onsubmit="return mtCommentOnSubmit(this)">

変更後

<form method="post" enctype="multipart/form-data" action="<$mt:CGIPath$><$mt:CommentScript$>" name="comments_form" id="comments-form" onsubmit="return mtCommentOnSubmit(this)">

コメント投稿フォームには、次のサブテンプレートを追加します。input 要素の name 属性と id 属性は変更しないでください。

<div class="field-inner">
    <label for="comment-custom-image">画像</label>
    <input type="file" name="comment-custom-image" id="comment-custom-image" class="fi" />
</div>

また、コメントプレビュー画面には、前の画面で設定した画像のアップロード情報は引き継げません。

Movable Type のコメント投稿フォームに、テキストフィールド・テキストエリアのフィールド追加や、画像のアップロードを可能にするプラグインを公開します。

下の画像は、コメントに画像のカスタムフィールドを追加し、アップロードされた画像をブログ記事のコメントエリアに表示した例です。

１．機能

コメントに以下のフィールドの追加や追加したフィールドの表示がそれぞれ1つずつ可能です。

• テキストフィールド
• テキストエリア
• 画像のアップロード
• ラジオボタン
• チェックボックス
• セレクトボックス

画像の一番下にある「テキストフィールド」が、CommentCustomField プラグインで追加したフィールドです。コメントプレビュー画面にも対応します。

次のように、テキストエリアを表示することもできます（テキストエリアのみの表示も可能）。

画像のアップロードは次のようになります。

ラジオボタンは次のようになります。

チェックボックスは次のようになります。

セレクトボックスは次のようになります。

コメント編集画面は次のように表示します。画面はテキストフィールドのみですが、テキストエリアを表示することもできます。

本プラグインでは次の拡張テンプレートタグを提供します。

MTCommentCustomFieldText

追加したテキストフィールドの内容を出力するファンクションタグ

MTCommentCustomFieldTextarea

追加したテキストエリアの内容を出力するファンクションタグ

MTCommentCustomFieldAsset

アップロードした画像の情報を出力するブロックタグ。タグブロック内ではMTAsset関連のタグを利用できます

MTPreviewCommentCustomFieldText

コメントプレビュー画面で投稿前のテキストフィールドの内容を出力するファンクションタグ

MTPreviewCommentCustomFieldTextarea

コメントプレビュー画面で投稿前のテキストエリアの内容を出力するファンクションタグ

MTCommentCustomFieldRadioInputValue

ブログ管理画面で入力したラジオボタンの値をXHTMLで出力するファンクションタグ

MTCommentCustomFieldCheckboxInputValue

ブログ管理画面で入力したチェックボックスの値をXHTMLで出力するファンクションタグ

MTCommentCustomFieldSelectInputValue

ブログ管理画面で入力したセレクトボックスの値をXHTMLで出力するファンクションタグ

MTPreviewCommentCustomFieldRadioInputValue

ブログ管理画面で入力したラジオボタンの値とユーザの選択状態をコメントプレビュー画面でXHTMLで出力するファンクションタグ

MTPreviewCommentCustomFieldCheckboxInputValue

ブログ管理画面で入力したチェックボックスの値とユーザの選択状態をコメントプレビュー画面でXHTMLで出力するファンクションタグ

MTPreviewCommentCustomFieldSelectInputValue

ブログ管理画面で入力したセレクトボックスの値とユーザの選択状態をコメントプレビュー画面でXHTMLで出力するファンクションタグ

MTCommentCustomFieldRadio

コメント投稿フォームで選択したラジオボタンの値を出力するファンクションタグ

MTCommentCustomFieldCheckbox

コメント投稿フォームで選択したチェックボックスの値を出力するファンクションタグ

MTCommentCustomFieldSelect

コメント投稿フォームで選択したセレクトボックスの値を出力するファンクションタグ

次期バージョンの Movable Type 5 では、コメントのカスタムフィールドの機能追加があると思われますので、このプラグインは Movable Type 4 で使うことを想定しています。Movable Type 5 ではコメントのカスタムフィールドが機能追加されましたが、画像のアップロードは行えないため、画像のアップロードを行いたい場合は本プラグインをご利用ください。また、MTOSでコメントのカスタムフィールドを使いたい場合も本プラグインをご利用ください。

２．価格

本プラグインの価格は次の通りです。

• 個人ライセンス（無償）：無償
• 上記以外のライセンス：10000円/1サーバ

なお、個人ライセンスの方も、プラグインのご利用および質問に対する回答等について、ご支援・ご賛同くださる方からの寄付をお待ち申し上げます。

個人ライセンス以外でご利用の場合、プラグインの動作確認後、下記から指定の金額をお支払いください。お支払い後に不具合が発覚しても払い戻しは致しかねますのでご注意ください。なお、銀行振り込みをご希望の場合は、大変ご面倒ですが、お問い合わせからご連絡ください。折り返し振り込み口座をご連絡致します。

３．プラグインのダウンロード

下記のリンクからプラグインアーカイブをダウンロードし、任意のフォルダに保存してください。

変更履歴

2009.08.14 初版
2009.08.17 v0.02 画像のアップロード機能を追加
2009.09.10 v0.03 画像のアップロード機能の不具合を修正
2009.10.02 v0.04 ラジオボタン・チェックボックス・プルダウンメニュー対応
2010.10.01 v0.10 MT5対応（プラグイン設定画面修正）、プラグイン定義ファイル変更（Perl→YAML）

CommentCustomField_0_10.zip（MT5用）

CommentCustomField_0_04.zip（MT4用）

４．インストール

プラグインアーカイブを解凍し、中にある CommentCustomField フォルダを plugins ディレクトリにアップロードしてください。

アップロードした後に管理画面にアクセスすると、次のようなアップグレード画面になりますので、「アップグレード開始」をクリックします。

サインインします。この後、アップグレードが開始します。

アップグレードが正常に完了すると次の画面になるので、「Movable Typeに戻る」をクリックし、管理画面に移動します。

ブログ管理画面より「システム」→「プラグイン」でプラグイン一覧を表示し、次のように表示されればOKです。

５．プラグインの設定

ブログ管理画面（システム管理画面ではありません）の「ツール」→「プラグイン」でプラグイン一覧画面を表示し、「CommentCustomField」→「設定」をクリックして、プラグインの設定を行ないます。

管理画面の表示

コメント編集画面にテキストフィールドを表示する

チェックすればコメント編集画面にテキストフィールドを表示します

コメント編集画面にテキストエリアを表示する

チェックすればコメント編集画面にテキストエリアを表示します

コメント編集画面にラジオボタン（入力値）を表示する

チェックすればコメント編集画面にラジオボタン（入力値）を表示します

コメント編集画面にチェックボックス（入力値）を表示する

チェックすればコメント編集画面にチェックボックス（入力値）を表示します

コメント編集画面にセレクトボックス（入力値）を表示する

チェックすればコメント編集画面にセレクトボックス（入力値）を表示します

アップロード画像

画像のアップロード先

画像のアップロード先のパスを指定します。指定したパスはサイトパス配下にディレクトリが作成され、その配下に画像がアップロードされます。パスを設定しない場合はサイトパス直下に画像をアップロードします。また、記述したパス末尾にスラッシュはあってもなくても大丈夫です。

画像の最大サイズ

アップロード可能な画像の最大サイズをKB単位で設定します。デフォルトは300KBです。このサイズを超えた画像はアップロードされません（コメントは投稿されます）。

アップロードファイル名にタイムスタンプを付与

アップロードした画像ファイル名に「_comment+タイムスタンプ（年月日時分秒）」を付与します。このプラグインでは同名の画像の上書きチェックを行なわないので、先にアップロードした画像ファイルを後から投稿した同名の画像ファイルで上書きしたくない場合はチェックをいれてください。

アップロードした画像ファイルはアイテムとして管理されます。アイテムに関連つけたコメントを削除してもアイテムは削除されません。

初期値の設定

ラジオボタンの初期値（半角カンマで区切って設定）

ラジオボタンに表示する初期値を設定します。選択状態にしたい値は、値の直後にアスタリスクを記述してください。

チェックボックスの初期値（半角カンマで区切って設定）

チェックボックスに表示する初期値を設定します。選択状態にしたい値は、値の直後にアスタリスクを記述してください。

セレクトボックスの初期値（半角カンマで区切って設定）

セレクトボックスに表示する初期値を設定します。選択状態にしたい値は、値の直後にアスタリスクを記述してください。

６．テンプレートの修正（コメント投稿に必要な設定）

「既定のブログ」テンプレートセットを例に修正内容を解説します。

６．１ コメント（テンプレートモジュール）

ブログ管理画面の「デザイン」→「テンプレート」→「コメント」テンプレートモジュールをクリックし、以下の青色のサブテンプレートを追加します。この作業はコメント投稿フォームに、追加したいカスタムフィールドのPOSTデータを設定するためのものです。

テキストフィールドは次のようになります。追加する部分の input 要素の name 属性と id 属性は変更しないでください。

...前略...
<div id="comments-open-text">
    <label for="comment-text">コメント
    <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtCommentFormOnFocus()"></textarea>
</div>
<div id="comment-form-custom-text">
    <label for="comment-custom-text">テキストフィールド</label>
    <input id="comment-custom-text" name="comment-custom-text" size="30" value="" onfocus="mtCommentFormOnFocus()" />
</div>
<div id="comments-open-captcha"></div>
...後略...

テキストエリアは次のようになります。追加する部分の textarea 要素の name 属性と id 属性は変更しないでください。

...前略...
<div id="comments-open-text">
    <label for="comment-text">コメント
    <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtCommentFormOnFocus()"></textarea>
</div>
<div id="comment-form-custom-textarea">
    <label for="comment-custom-textarea">テキストエリア</label>
    <textarea id="comment-custom-textarea" name="comment-custom-textarea" rows="5" cols="50" onfocus="mtCommentFormOnFocus()"></textarea>
</div>
<div id="comments-open-captcha"></div>
...後略...

テキストフィールドとテキストエリアを両方表示させたい場合は、それぞれの青色部分を並べて記述してください。

画像の場合は次のようになります。form 要素にも enctype 属性の設定が必要です。追加する部分の input 要素の name 属性と id 属性は変更しないでください。

...前略...
<form method="post" enctype="multipart/form-data" action="<$mt:CGIPath$><$mt:CommentScript$>" name="comments_form" id="comments-form" onsubmit="return mtCommentOnSubmit(this)">
...中略...
<div id="comments-open-text">
    <label for="comment-text">コメント
    <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtCommentFormOnFocus()"></textarea>
</div>
<div class="field-inner">
    <label for="comment-custom-image">画像</label>
    <input type="file" name="comment-custom-image" id="comment-custom-image" class="fi" />
</div>
<div id="comments-open-captcha"></div>
...後略...

ラジオボタンの場合は次のようになります。

...前略...
<div id="comments-open-text">
    <label for="comment-text">コメント
    <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtCommentFormOnFocus()"></textarea>
</div>
<div id="comment-form-custom-radio" class="field-inner">
<div>この記事は役に立ちましたか？</div>
<mt:CommentCustomFieldRadioInputValue />
</div>
<div id="comments-open-captcha"></div>
...後略...

チェックボックスの場合は次のようになります。

...前略...
<div id="comments-open-text">
    <label for="comment-text">コメント
    <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtCommentFormOnFocus()"></textarea>
</div>
<div id="comment-form-custom-checkbox" class="field-inner">
<div>趣味は何ですか？（複数回答可）</div>
<mt:CommentCustomFieldCheckboxInputValue />
</div>
<div id="comments-open-captcha"></div>
...後略...

セレクトボックスの場合は次のようになります。

...前略...
<div id="comments-open-text">
    <label for="comment-text">コメント
    <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtCommentFormOnFocus()"></textarea>
</div>
<div id="comment-form-custom-select" class="field-inner">
出身地：<mt:CommentCustomFieldSelectInputValue />
</div>
<div id="comments-open-captcha"></div>
...後略...

追加するサブテンプレートの挿入位置は既存のテキストエリアの直後でなくても構いませんが、サインイン時に表示される位置になるよう、気をつけてください。

６．２ コメントプレビュー（システムテンプレート）

ブログ管理画面の「デザイン」→「テンプレート」→「コメントプレビュー」システムテンプレートクリックし、以下の青色のサブテンプレートを追加します。この作業はコメントプレビュー画面にPOSTデータを引き継ぐためのものです。

テキストフィールドは次のようになります。

...前略...
<div id="comments-open-text">
    <label for="comment-text">コメント <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtShowCaptcha()"><$mt:CommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$></textarea>
</div>
<div id="comment-form-custom-text">
    <label for="comment-custom-text">テキストフィールド</label>
    <input id="comment-custom-text" name="comment-custom-text" size="30" value="<$mt:PreviewCommentCustomFieldText encode_html="1"$>" onfocus="mtShowCaptcha()" />
</div>
<div id="comments-open-captcha"></div>
...後略...

テキストエリアは次のようになります。

...前略...
<div id="comments-open-text">
    <label for="comment-text">コメント <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtShowCaptcha()"><$mt:CommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$></textarea>
</div>
<div id="comment-form-custom-textarea">
    <label for="comment-custom-textarea">テキストエリア</label>
    <textarea id="comment-custom-textarea" name="comment-custom-textarea" rows="5" cols="50" onfocus="mtShowCaptcha()"><$mt:PreviewCommentCustomFieldTextarea encode_html="1"$></textarea>
</div>
<div id="comments-open-captcha"></div>
...後略...

テキストフィールドとテキストエリアを両方表示させたい場合は、それぞれの青色部分を並べて記述してください。

画像データはプレビュー画面に引き継ぐことはできません。

ラジオボタンの場合は次のようになります。

...前略...
<div id="comments-open-text">
    <label for="comment-text">コメント <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtShowCaptcha()"><$mt:CommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$></textarea>
</div>
<div id="comment-form-custom-radio" class="field-inner">
<div>この記事は役に立ちましたか？</div>
<mt:PreviewCommentCustomFieldRadioInputValue />
</div>
<div id="comments-open-captcha"></div>
...後略...

チェックボックスの場合は次のようになります。

...前略...
<div id="comments-open-text">
    <label for="comment-text">コメント <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtShowCaptcha()"><$mt:CommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$></textarea>
</div>
<div id="comment-form-custom-checkbox" class="field-inner">
<div>趣味は何ですか？（複数回答可）</div>
<mt:PreviewCommentCustomFieldCheckboxInputValue />
</div>
<div id="comments-open-captcha"></div>
...後略...

セレクトボックスの場合は次のようになります。

...前略...
<div id="comments-open-text">
    <label for="comment-text">コメント <mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="mtShowCaptcha()"><$mt:CommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$></textarea>
</div>
<div id="comment-form-custom-select" class="field-inner">
出身地：<mt:PreviewCommentCustomFieldSelectInputValue />
</div>
<div id="comments-open-captcha"></div>
...後略...

追加するサブテンプレートの挿入位置は既存のテキストエリアの直後でなくても構いませんが、サインイン時に表示される位置になるよう、気をつけてください。

６．３ スタイルシート（インデックステンプレート）

ブログ管理画面の「デザイン」→「テンプレート」→「スタイルシート」インデックステンプレートクリックし、以下の内容を追加します。

#comment-form-custom-text,
#comment-form-custom-textarea {
    margin-bottom: 0.75em;
}
#comment-custom-text,
#comment-custom-textarea {
    width: 80%;
}

参考までに、デフォルトテンプレートの場合、次のような設定を行なえばきれいに表示されます。

.comments-open .input_radio_label,
.comments-open .input_checkbox_label {
    display: inline;
}
.comments-open .input_radio_value,
.comments-open .input_checkbox_value {
    margin-left: 3px;
}
.comments-open .input_radio,
.comments-open .input_checkbox {
    vertical-align: middle;
}
#comment-form-custom-radio,
#comment-form-custom-checkbox,
#comment-form-custom-select {
    margin: 10px 0;
}

７．テンプレートの修正（追加したカスタムフィールド表示に必要な設定）

「既定のブログ」テンプレートセットを例に、修正内容を解説します。

ブログ管理画面の「デザイン」→「テンプレート」→「コメント」テンプレートモジュールをクリックし、以下の青色のサブテンプレートを追加します。この作業はブログ記事ページやウェブページのコメント一覧に、追加したカスタムフィールドのデータを表示するためのものです。

テキストフィールドは次のようになります。

...前略...
<mt:Comments>
...中略...
    <div class="comment-content">
        <$mt:CommentBody$>
        <mt:if tag="CommentCustomFieldText">
            <$mt:CommentCustomFieldText$>
        </mt:if>
...中略...
    </div>
</mt:Comments>
...後略...

テキストエリアは次のようになります。

...前略...
<mt:Comments>
...中略...
    <div class="comment-content">
        <$mt:CommentBody$>
        <mt:if tag="CommentCustomFieldTextarea">
            <$mt:CommentCustomFieldTextarea$>
        </mt:if>
...中略...
    </div>
</mt:Comments>
...後略...

画像は次のようになります。画像の表示バリエーションは色々ありますが、ここでは横幅200pxのサムネイル画像で表示する例です。

...前略...
<mt:Comments>
...中略...
    <div class="comment-content">
        <$mt:CommentBody$>
        <mt:if tag="CommentCustomFieldAsset">
            <p>
            <mt:CommentCustomFieldAsset>
                <mt:AssetThumbnailLink width="200" />
            </mt:CommentCustomFieldAsset>
            </p>
        </mt:if>
...中略...
    </div>
</mt:Comments>
...後略...

ラジオボタンは次のようになります。

...前略...
<mt:Comments>
...中略...
    <div class="comment-content">
        <$mt:CommentBody$>
<mt:if tag="CommentCustomFieldRadio">
    この記事は役にたった:<mt:CommentCustomFieldRadio />
</mt:if>
...中略...
    </div>
</mt:Comments>
...後略...

チェックボックスは次のようになります。

...前略...
<mt:Comments>
...中略...
    <div class="comment-content">
        <$mt:CommentBody$>
<mt:if tag="CommentCustomFieldCheckbox">
    趣味:<mt:CommentCustomFieldCheckbox />
</mt:if>
...中略...
    </div>
</mt:Comments>
...後略...

セレクトボックスは次のようになります。

...前略...
<mt:Comments>
...中略...
    <div class="comment-content">
        <$mt:CommentBody$>
<mt:if tag="CommentCustomFieldSelect">
    出身地:<mt:CommentCustomFieldSelect />
</mt:if>
...中略...
    </div>
</mt:Comments>
...後略...

Movable Type 4（4.1～）で、コメント出力数に応じてコメント番号を制御するカスタマイズです。

１．概要

例えば、あるブログ記事に投稿された20件のコメントのうち、最新の10件のコメントだけを表示し、さらにコメント番号を付与する場合、次のように MTCommentOrderNumber タグを使ってコメント番号を表示すると、本来のコメント番号は11～20 ですが、この場合もコメント番号は 1～10 で表示されてしまいます。

<mt:Comments sort_order="ascend" lastn="10">
  このコメントは<mt:CommentOrderNumber />番目のコメントです。
  <mt:CommentBody />
</mt:Comments>

本エントリーのカスタマイズを行なうことで、lastn モディファイアや limit モディファイアで絞り込んでも、適正なコメント番号を表示することができます。

なお通常、ブログ記事のコメントはすべて表示する設定になっているのですが、このカスタマイズを何のために使うかという理由を、以下に箇条書きにしておきます。

• 当ブログでの使用を想定
• コメントプレビュー画面でこのカスタマイズを使用
• これまで、コメントプレビュー画面でもすべてのコメントを表示していたが、1000件近くのコメントがあるブログ記事では負荷がかかるので、全コメント表示はやめたい
• ただしコメントの返信を行なう都合上、コメントプレビュー画面でも、リプライする直近のコメント数件は表示し、コメント番号も確認できるようにしたい

デフォルトテンプレートではコメントプレビュー画面に投稿済みコメントは表示されないので、以下、公開テンプレートを例にカスタマイズを紹介します。

２．コメントを昇順に表示する場合のカスタマイズ

制御タグを駆使して、MTComments タグに lastn モディファイアを使っている場合でも、適正なコメント番号を表示するようにします。

例えば、コメントが5件あり、コメントプレビューで3件だけ表示したい場合、次のようになります。

ブログ記事ページの表示

コメントプレビュー画面の表示

上記の表示を行なうためのサブテンプレートは以下です（最新10件のコメントを表示する設定にしています）。

まず、「コメント」テンプレートモジュールに青色部分を追加します。赤色部分がコメントプレビューテンプレートで表示したい件数になるので、この値を変更すれば表示するコメント数を変更できます。

<mt:ifCommentsActive>
<div id="comments">
 
   <mt:if name="comment_preview_template">
   <mt:include module="コメント入力フォーム" />
   </mt:if>
 
<mt:entryCommentCount setvar="entry_comment_count" />
<mt:if name="comment_preview_template">
  <mt:setVar name="lastn" value="10" />
  <mt:getVar name="lastn" op="--" setvar="counter" />
<mt:else>
  <mt:setVar name="lastn" value="$entry_comment_count" />
</mt:if>
   <mt:comments sort_order="ascend" lastn="$lastn">
 
   <mt:commentsHeader><h3 class="comments-header">コメント<mt:entryCommentCount singular="[1]" plural="[#]" none="[0]" /></h3></mt:commentsHeader>
      <mt:include module="コメント詳細" />
   <mt:commentsFooter></mt:commentsFooter>
   </mt:comments>
 
   <mt:unless name="comment_preview_template">
   <mt:include module="コメント入力フォーム" />
   </mt:unless>
 
</div>
</mt:ifCommentsActive>

次に、「コメント詳細」テンプレートモジュールに青色部分を追加します。このカスタマイズでは「Posted」の前にコメント番号を表示するようにしています。表示位置を変更したい場合は、青色のサブテンプレートを任意の位置に移動してください。

<div class="comment"<mt:ifArchiveTypeEnabled archive_type="Individual"> id="c<mt:commentID />"</mt:ifArchiveTypeEnabled>>
 
   <div class="comment-content">
   <mt:ifCommentParent>
   <p><a href="<mt:commentParent>#comment-<mt:commentID /></mt:commentParent>"><mt:commentParent>No.<mt:commentID />の<mt:commentAuthor /></mt:commentParent></a>さんのコメントへの返信</p>
   </mt:ifCommentParent>
   <mt:commentBody /></div>
 
   <p class="comment-footer">
<mt:if name="comment_preview_template">
  <mt:if name="entry_comment_count" ge="$lastn">
    [ <mt:getVar name="entry_comment_count" op="-" value="$counter" /> ]
  <mt:else>
    <mt:if name="__counter__">
    [ <mt:getVar name="__counter__" /> ]
    </mt:if>
  </mt:if>
  <mt:setVar name="counter" op="--" />
<mt:else>
    [ <mt:getVar name="__counter__" /> ]
</mt:if>
      Posted by <mt:commentAuthorLink default_name="Anonymous" show_email="0" /> <mt:if tag="CommentAuthorIdentity"><mt:commentAuthorIdentity /></mt:if> at <mt:commentDate /><mt:ifCommentsAccepted> | <mt:commentReplyToLink /></mt:ifCommentsAccepted>
   </p>
</div>

カスタマイズは以上です。なお、上記は2つのテンプレートモジュールに設定が分断してしまっていて分かりにくいので、ひとつにまとめてポイントだけに絞り込んだサブテンプレートを以下に示し、解説します。

<mt:entryCommentCount setvar="entry_comment_count" />
<mt:if name="comment_preview_template">
  <mt:setVar name="lastn" value="10" />
  <mt:getVar name="lastn" op="--" setvar="counter" />
<mt:else>
  <mt:setVar name="lastn" value="$entry_comment_count" />
</mt:if>
<mt:comments sort_order="ascend" lastn="$lastn">
  <mt:commentBody />
  <mt:if name="comment_preview_template">
    <mt:if name="entry_comment_count" ge="$lastn">
   [ <mt:getVar name="entry_comment_count" op="-" value="$counter" /> ]
    <mt:else>
      <mt:if name="__counter__">
   [ <mt:getVar name="__counter__" /> ]
      </mt:if>
    </mt:if>
    <mt:setVar name="counter" op="--" />
  <mt:else>
   [ <mt:getVar name="__counter__" /> ]
  </mt:if>
</mt:comments>

サブテンプレートの概要ですが、コメントプレビューテンプレートの場合、変数 lastn に表示したい件数を設定します。また、カウンタ値として、「変数 lastn -1」の値を変数 counter に保持しておきます。それ以外のテンプレート（ブログ記事テンプレート）では、単純に MTEntryCommentCount の値を設定します。

MTComments タグに lastn モディファイアを設定し、値に変数 lastn を利用します。これでブログ記事の場合とコメントプレビューの場合で表示する件数を制御します。

後半に追加したサブテンプレートでコメント番号を出力します。コメントプレビューテンプレートの場合、ブログ記事へのコメント数と変数 lastn の値を比較し、ブログ記事へのコメント数と等しいか、または多い場合は、コメント番号に「ブログ記事へのコメント数 - カウンタ値」を適用します。カウンタ値は繰り返すたびにデクリメントするので、表示するコメント番号は繰り返すたびに大きくなります。

ブログ記事へのコメント数と変数 lastn の値を比較し、ブログ記事へのコメント数が小さい場合は、特殊変数 __counter__ を使用し、コメント番号を1から順番に表示ます。ブログ記事テンプレートの場合も同様です。

なお、コメントプレビュー画面のプレビューコメントにコメント番号を表示しないよう、「<mt:if name="__counter__">」で括っています。

３．降順に表示する場合のカスタマイズ

降順に表示する場合、先頭に表示するコメントのコメント番号は、MTEntryCommentCount タグの値となるので、次のようなサブテンプレートになります。

まず、「コメント」テンプレートモジュールに青色部分を追加します。赤色部分がコメントプレビューテンプレートで表示したい件数になるので、この値を変更すれば表示するコメント数を変更できます。

<mt:ifCommentsActive>
<div id="comments">
 
   <mt:if name="comment_preview_template">
   <mt:include module="コメント入力フォーム" />
   </mt:if>
 
   <mt:entryCommentCount setvar="entry_comment_count" />
   <mt:comments sort_order="descend">
 
   <mt:commentsHeader><h3 class="comments-header">コメント<mt:entryCommentCount singular="[1]" plural="[#]" none="[0]" /></h3></mt:commentsHeader>
      <mt:include module="コメント詳細" />
   <mt:commentsFooter></mt:commentsFooter>
   </mt:comments>
 
   <mt:unless name="comment_preview_template">
   <mt:include module="コメント入力フォーム" />
   </mt:unless>
 
</div>
</mt:ifCommentsActive>

次に、「コメント詳細」テンプレートモジュールに青色部分を追加します。このカスタマイズでは「Posted」の前にコメント番号を表示するようにしています。表示位置を変更したい場合は、青色のサブテンプレートを任意の位置に移動してください。

<div class="comment"<mt:ifArchiveTypeEnabled archive_type="Individual"> id="c<mt:commentID />"</mt:ifArchiveTypeEnabled>>
 
   <div class="comment-content">
   <mt:ifCommentParent>
   <p><a href="<mt:commentParent>#comment-<mt:commentID /></mt:commentParent>"><mt:commentParent>No.<mt:commentID />の<mt:commentAuthor /></mt:commentParent></a>さんのコメントへの返信</p>
   </mt:ifCommentParent>
   <mt:commentBody /></div>
 
   <p class="comment-footer">
[ <mt:getVar name="entry_comment_count" /> ]
<mt:setVar name="entry_comment_count" op="--" />
      Posted by <mt:commentAuthorLink default_name="Anonymous" show_email="0" /> <mt:if tag="CommentAuthorIdentity"><mt:commentAuthorIdentity /></mt:if> at <mt:commentDate /><mt:ifCommentsAccepted> | <mt:commentReplyToLink /></mt:ifCommentsAccepted>
   </p>
</div>

降順に表示する場合のカスタマイズは、「コメント番号を降順で表示する」の２項と全く同じです。降順に出力する場合は、最初に表示するコメントのコメント番号は MTEntryCommentCount タグの値と等しくなります。

以上です。
これらのサブテンプレートは、コメントプレビューの判定等を外し、少し書き換えることで、ブログ記事テンプレートでの利用も可能です。

Movable Type 4（4.1～）で、ブログ記事に表示されるコメントのコメント番号を降順で表示するカスタマイズです。

１．MTCommentOrderNumber タグについて

コメント番号を表示するには、MTCommentOrderNumber タグを利用します。このタグは、コメント一覧に表示するコメントに対し、1から順番に番号（以下「コメント番号」）を付与するためのファンクションタグです。

デフォルトテンプレート（MT4.2 コメントテンプレートモジュール）での使用例は次の通りです。青色の MTCommentOrderNumber タグを追加します（そもそも特殊変数 __counter__ を利用するという手もありますが）。あと、説明の都合上、MTComments タグに sort_order="ascend" を付与して昇順に表示します。

...前略...
<mt:Comments sort_order="ascend">
  <mt:CommentsHeader>
<h2 class="comments-header"><$mt:EntryCommentCount singular="コメント(1)" plural="コメント(#)" none="コメント(0)"$></h2>
<div class="comments-content">
  </mt:CommentsHeader>
  <div id="comment-<$mt:CommentID$>" class="comment<mt:IfCommentParent> comment-reply</mt:IfCommentParent><mt:IfCommenterIsEntryAuthor> entry-author-comment</mt:IfCommenterIsEntryAuthor>">
    <div class="inner">
      <div class="comment-header">
        <div class="asset-meta">
          <span class="byline">
            <$mt:CommentAuthorIdentity$>
<mt:IfCommentParent>
              <span class="vcard author"><$mt:CommentAuthorLink$></span>から<a href="<mt:CommentParent><$mt:CommentLink$></mt:CommentParent>"><mt:CommentParent><$mt:CommentAuthor$></mt:CommentParent></a>への返信
<mt:Else>
              <span class="vcard author"><$mt:CommentAuthorLink$></span>
</mt:IfCommentParent>
              | <a href="<$mt:CommentLink$>"><abbr class="published" title="<$mt:CommentDate format_name="iso8601"$>"><$mt:CommentDate$></abbr></a>
<mt:IfCommentsAccepted>
              | <$mt:CommentReplyToLink$>
</mt:IfCommentsAccepted>
[ <mt:CommentOrderNumber /> ]
          </span>
        </div>
      </div>
      <div class="comment-content">
        <$mt:CommentBody$>
      </div>
    </div>
  </div>
  <mt:CommentsFooter>
</div>
  </mt:CommentsFooter>
</mt:Comments>
...後略...

上記の完成例（「返信」の右側に表示されているのがコメント番号）

ただし、MTComments タグに sort_order="descend" を与えて、コメントを降順に表示しても、次のようにコメント番号は降順に表示されません。

MTCommentOrderNumber タグは、MTComments タグの表示条件や処理中のコメントに連動するわけではなく、単純なインクリメントしか行なわないためです。

２．コメント番号を降順に表示するカスタマイズ

コメント番号を降順に表示するには、元の「コメント」テンプレートモジュールに、次の青色部分を追加します。MTEntryCommentCount タグでブログ記事のコメント数を取得し、MTComments タグの繰り返し処理の中で、その値を表示＆デクリメントします。MTCommentOrderNumber タグは用いません。

...前略...
<mt:entryCommentCount setvar="entry_comment_count" />
<mt:Comments sort_order="descend">
  <mt:CommentsHeader>
<h2 class="comments-header"><$mt:EntryCommentCount singular="コメント(1)" plural="コメント(#)" none="コメント(0)"$></h2>
<div class="comments-content">
  </mt:CommentsHeader>
  <div id="comment-<$mt:CommentID$>" class="comment<mt:IfCommentParent> comment-reply</mt:IfCommentParent><mt:IfCommenterIsEntryAuthor> entry-author-comment</mt:IfCommenterIsEntryAuthor>">
    <div class="inner">
      <div class="comment-header">
        <div class="asset-meta">
          <span class="byline">
            <$mt:CommentAuthorIdentity$>
<mt:IfCommentParent>
              <span class="vcard author"><$mt:CommentAuthorLink$></span>から<a href="<mt:CommentParent><$mt:CommentLink$></mt:CommentParent>"><mt:CommentParent><$mt:CommentAuthor$></mt:CommentParent></a>への返信
<mt:Else>
              <span class="vcard author"><$mt:CommentAuthorLink$></span>
</mt:IfCommentParent>
              | <a href="<$mt:CommentLink$>"><abbr class="published" title="<$mt:CommentDate format_name="iso8601"$>"><$mt:CommentDate$></abbr></a>
<mt:IfCommentsAccepted>
              | <$mt:CommentReplyToLink$>
</mt:IfCommentsAccepted>
[ <mt:getVar name="entry_comment_count" /> ]
<mt:setVar name="entry_comment_count" op="--" />
          </span>
        </div>
      </div>
      <div class="comment-content">
        <$mt:CommentBody$>
      </div>
    </div>
  </div>
  <mt:CommentsFooter>
</div>
  </mt:CommentsFooter>
</mt:Comments>
...後略...

上記の完成例

Movable Type 4.x では、スパムコメントを回避策として、短い期間にコメントを連続投稿すると、「コメントを投稿できませんでした。エラー: 短い期間にコメントを大量に送りすぎです。しばらくたってからやり直してください。」というエラーを表示する仕様になっています（下）。

ただ、連続して投稿している訳ではないのに、稀にこのエラーがいつまでも解消しないケースがあるようです。

不具合が解消するかどうかは分かりませんが、このエラーを出力している処理をトレースしてみました。

この処理を行なっているのは、lib/MT/App/Comments.pm にある _builtin_throttle という関数です。この関数はコア機能にビルトインされたコールバックです（下）。

sub init {
...中略...
    MT->add_callback( 'CommentThrottleFilter', 1, undef,
        \&MT::App::Comments::_builtin_throttle );
    $app;
}

処理は下記に書かれている順番に実行します。文中の「0を返却」は、コメントスパム処理を行なうことを指し、「1を返却」は、コメントスパム処理を行なわないことを指します。

• 環境変数 ThrottleSeconds 0 が設定されていれば1を返却して処理終了
• ThrottleSeconds 0 が設定されていない場合、ThrottleSeconds（デフォルト20秒）で指定した時間内に、同一ブログIDに同一IPからの再投稿がある場合は0を返却して処理終了。それ以外の場合は次の処理を続行。
• 環境変数 ShowIPInformation が設定されていないか、0（デフォルト値）が設定されていれば1を返却して処理終了（特定のIPアドレスからのコメントを制限したい場合、ShowIPInformationに1を設定すれば、この後に処理を行なうため）
• ThrottleSeconds の10倍の時間の間に8回以上のコメント投稿があった場合、IP禁止リストに登録し、0を返却して処理終了。それ以外の場合は1を返却して処理終了

上記のことから、mt-config.cgi に環境変数 ThrottleSeconds 0 を設定しておけば、常に重複コメントが可能です（が、ネットで調べると、なぜかこれで解消しないケースもあるみたいで、再インストールで解消させているようです）。

また、あるブログ記事に、現在より未来の時間のコメントが投稿されていると、必ずこのエラーとなります（他のブログ記事のコメント投稿には影響なし）。例えば、自宅サーバの時間を（故意に）未来に変更してコメント投稿し、そのあと時間を元に戻してコメント投稿すると、この事象に遭遇します。

ShowIPInformation はより厳しいスパムチェックを行いたい場合に、mt-config.cgi に設定しておくと良いでしょう。ThrottleSeconds の値が20秒である場合、その10倍である200秒の間に8回投稿されると、IP禁止リストに登録されます。

IP禁止リストについては、「Movable Type の管理画面に「IP禁止リスト」を表示する」も参考にしてください。

まとまりのないエントリーですが、情報まで。

Movable Type 4.25 のコメント欄の(X)HTML要素に onclick 属性や onleypress 属性を適用させる方法です。質問を頂きましたので本エントリーで回答します。

１．基本動作

コメント欄に次のような(X)HTMLを記述すると、

<a href="foo.html" onclick="foo()">foolink</a>

onclick 属性はサニタイズされて、

<a href="foo.html">foolink</a>

となります。これはコメントに書き込まれた onclick 属性によるXSS（クロスサイトスクリプティング）対策です。onclick のみだけでなく、JavaScript イベント属性（on～）は許容されていません。

なお、Movable Type 4.25 では、ブログ管理画面の「設定」→「コメント」で、「HTMLタグを制限」の項目に、JavaScript イベント属性を設定しても（下）、コメント投稿時に設定したJavaScript イベント属性はすべて除去されます。

２．JavaScript イベント属性を有効にする

lib/MT/Sanitize.pm の下記の赤色で示した1行をコメントアウトするか、削除すれば、JavaScript イベント属性の追加ができるようになります（１項で示した「HTMLタグを制限」に、JavaScript イベント属性を設定してください）。

...前略...
if ($ok_tags->{$name} ||
    (exists $tag_attr->{$name} && $tag_attr->{$name} eq '/')) {
    if ($inside) {
        my @attrs;
        while ($inside =~ m/([:\w]+)\s*=\s*(['"])(.*?)\2/gs) {
            my ($attr, $q, $val) = (lc($1), $2, $3);
            # javascript event attributes explicitly not allowed
            next if $attr =~ m/^on/;
            if ($ok_tags->{'*'}{$attr} ||
               (ref $ok_tags->{$name} && ($ok_tags->{$name}{'*'} || $ok_tags->{$name}{$attr}) && !exists($ok_tags->{$name}{'!' . $attr}))) {
...後略...

なお、コメント投稿において JavaScript イベント属性を有効にすると、XSSによる脆弱性が伴いますので、変更に際してはご自身の責任で行なってください。

この XSS 対処の仕様は4.25 から追加されています。

Movable Type 4 で「最近のコメント」を、ネイティブタグだけを使ってブログ記事別に並び替えるカスタマイズです。

１．概要

これまで、「最近のコメント」をブログ記事別に正しく（=古いコメントを含まずに）表示するには、MTCollate などのプラグインの利用が必要でしたが、Movable Type 4 では、ネイティブタグのみで同様の機能が実現できるようになりました。

実現方法は色々あると思いますが、ここではハッシュ変数と配列変数を組み合わせて利用する方法を紹介します。

なお、ここで紹介するサブテンプレートは、「Movable Type 4.2 パーフェクトガイド」の 6.13 に掲載しているものとほぼ同じものです。

Movable Type 4.2 パーフェクトガイド 荒木 勇次郎 毎日コミュニケーションズ 2008-07-31 売り上げランキング : 60270 Amazonで詳しく見る by G-Tools

２．「最近のコメント」用サブテンプレート

当サイトの配布テンプレートのデザインにあわせた「最近のコメント」用サブテンプレートは次の通りです。

下記のサブテンプレートをウィジェットまたは、テンプレートモジュールなどに貼り付けて再構築すれば「最近のコメント」が表示できます。

<mt:comments sort_order="descend" lastn="10">
  <mt:commentEntry>
    <mt:setVarBlock name="entry_title"><a href="<mt:entryPermalink />"><mt:entryTitle /></a></mt:setVarBlock>
    <mt:setVarBlock name="entry_comment">
      <li><a href="<mt:entryPermalink />#c<mt:commentID />"><mt:commentAuthor default="Anonymous"></a> <mt:commentDate format="%m/%d"></li>
    </mt:setVarBlock>
    <mt:setVar name="comment_list{$entry_title}" value="$entry_comment" prepend="1" />
  </mt:commentEntry>
  <mt:setVar name="flag" value="0" />
  <mt:loop name="title_list">
    <mt:if name="__value__" eq="$entry_title">
      <mt:setVar name="flag" value="1" />
    </mt:if>
  </mt:loop>
  <mt:unless name="flag">
    <mt:setVar name="push(title_list)" value="$entry_title" />
  </mt:unless>
</mt:comments>
 
<dt class="sidetitle">
Recent Comments
</dt>
<dd class="side">
  <ul>
<mt:loop name="title_list">
    <li>
    <mt:getVar name="__value__" />
      <ul>
    <mt:getVar name="comment_list{$__value__}" />
      </ul>
    </li>
</mt:loop>
  </ul>
</dd>

1行目の「10」を変更すれば、表示するコメント数を変更できます。また、dt 要素・dd 要素やclass 属性値を変更すれば他のテンプレートのデザインにあわせることができます。

３．サブテンプレートの解説

下の図は、冒頭の「最近のコメント」に対応させた、処理で用いている各変数の対応を示しています。以下の解説と照らし合わせて、理解の補助にしてください（画像をクリックすればドラッグすることができます。もう一度クリックすると元の位置に戻ります）。

サブテンプレートでは、まず、Commentsタグと CommentEntry タグを組み合わせて、ブログ記事タイトルとパーマリンクを変数 entry_titleに、コメント情報（コメント投稿者、コメント投稿日、コメントへのフラグメントつきのパーマリンク）を変数 entry_comment に保持します。

<mt:setVarBlock name="entry_title"><a href="<mt:entryPermalink />"><mt:entryTitle /></a></mt:setVarBlock>
<mt:setVarBlock name="entry_comment">
  <li><a href="<mt:entryPermalink />#c<mt:commentID />"><mt:commentAuthor default="Anonymous"></a> <mt:commentDate format="%m/%d"></li>
</mt:setVarBlock>

この2つの変数の値を、ハッシュ変数 comment_list に設定します。ハッシュのキーには変数 entry_title、ハッシュの値には変数 entry_comment を設定します。

値を設定するときには prepend モディファイアを利用し、2回目以降のハッシュ変数への設定で、同じキー（=ブログ記事タイトル）の値は上書きせず、先に設定した値の先頭に追加していきます。この繰り返しで、ハッシュのキーにブログ記事タイトルの一覧、ハッシュの値に、ブログ記事に属するコメントの一覧ができあがります（図のカッコ内は設定順序を示しています）。

<mt:setVar name="comment_list{$entry_title}" value="$entry_comment" prepend="1" />

ただし、このハッシュは、ブログ記事タイトルの表示順序を保持していないので、配列変数 title_list に対し、ブログ記事タイトルを出現順に設定していきます。

また、一度出現したブログ記事タイトルは重複して書きこまないよう、MTLoop タグで、配列変数を読み出し、同じブログ記事タイトルがある場合は変数 flag に1を設定します。変数 flag の値が0のときだけ、配列変数 title_list に設定します。

<mt:setVar name="flag" value="0" />
<mt:loop name="title_list">
  <mt:if name="__value__" eq="$entry_title">
    <mt:setVar name="flag" value="1" />
  </mt:if>
</mt:loop>
<mt:unless name="flag">
  <mt:setVar name="push(title_list)" value="$entry_title" />
</mt:unless>

最後に MTLoop タグで配列変数 title_list を読み出し、特殊変数 __value__ で、ブログ記事タイトルを出力し、ハッシュ変数 comment_list のキーに、特殊変数 __value__ を用いて、コメントの一覧を出力します。

<mt:loop name="title_list">
    <li>
    <mt:getVar name="__value__" />
      <ul>
    <mt:getVar name="comment_list{$__value__}" />
      </ul>
    </li>
</mt:loop>

４．コメントを降順に出力する

コメントの順序を昇順から降順に入れ替えるには prepend モディファイアを append モディファイアにします。

<mt:setVar name="comment_list{$entry_title}" value="$comment" prepend="1" />

<mt:setVar name="comment_list{$entry_title}" value="$comment" append="1" />

５．ブログ記事タイトルをを昇順に出力する

ブログ記事の表示順序を降順から昇順に入れ替えるには、push 関数を unshift 関数にします。

<mt:setVar name="push(title_list)" value="$entry_title" />

<mt:setVar name="unshift(title_list)" value="$entry_title" />

上記の方法は、ブログ内に同じブログ記事タイトルがないことが前提です。もし、同じブログ記事タイトルが存在するならば、ブログ記事IDを組み合わせると良いでしょう。

2010.09.28
MT5で正常に動作するよう、MTCommentsタグに「sort_order="descend"」を追加しました。

コメント投稿者の表示には MTCommentAuthorLink タグを使用していますが、コメント投稿者名に「&」などの実体参照が必要な文字が含まれている場合、そのページが valid でなくなります。

グローバルモディファイアとして、escape モディファイアや encode_html モディファイアが用意されていますが、MTCommentAuthorLink タグにこのモディファイアを適用すると、タグで出力されるリンク（のアングルブラケット）まで実体参照されてしまいます。

１．通常のコメント投稿者表示で MTCommentAuthorLink タグを使用

下は通常のコメント投稿者表示で MTCommentAuthorLink タグを使用した場合の、サブテンプレートとその出力（ソースコード）です。

Posted by <mt:commentAuthorLink default_name="Anonymous" show_email="0" />

出力

Posted by <a title="http://www.koikikukan.com/" href="http://www.koikikukan.com/" rel="nofollow">yujiro</a>

２．MTCommentAuthorLink タグに escape モディファイアを適用した失敗例

下は、MTCommentAuthorLink タグに escape モディファイアを適用したときの、サブテンプレートとその出力（ソースコード）です。出力で、本来アングルブラケットになるべき (X)HTML 要素のタグが実体参照されてしまっています。

Posted by <mt:commentAuthorLink default_name="Anonymous" show_email="0" escape="html" />

出力

Posted by <a title="http://www.koikikukan.com/" href="http://www.koikikukan.com/">yujiro</a>

ここでは、他のテンプレートタグを組み合わせて、コメント投稿者を実体参照するカスタマイズを紹介します。

３．配布テンプレートの修正例

ブログ管理画面より「デザイン」→「テンプレート」で「コメント詳細」テンプレートモジュール編集画面を開き、赤色の MTCommentAuthorLink タグの部分を、青色の内容に変更してください。

変更前

<div class="comment"<mt:ifArchiveTypeEnabled archive_type="Individual"> id="c<mt:commentID />"</mt:ifArchiveTypeEnabled>>
 
   <div class="comment-content">
   <mt:ifCommentParent>
   <p><a href="<mt:commentParent>#comment-<mt:commentID /></mt:commentParent>"><mt:commentParent>No.<mt:commentID />の<mt:commentAuthor /></mt:commentParent></a>さんのコメントへの返信</p>
   </mt:ifCommentParent>
   <mt:commentBody /></div>
 
   <p class="comment-footer">
      Posted by <mt:commentAuthorLink default_name="Anonymous" show_email="0" /> <mt:if tag="CommentAuthorIdentity"><mt:commentAuthorIdentity /></mt:if> at <mt:commentDate /><mt:ifCommentsAccepted> | <mt:commentReplyToLink /></mt:ifCommentsAccepted>
   </p>
</div>

変更後

<div class="comment"<mt:ifArchiveTypeEnabled archive_type="Individual"> id="c<mt:commentID />"</mt:ifArchiveTypeEnabled>>
 
   <div class="comment-content">
   <mt:ifCommentParent>
   <p><a href="<mt:commentParent>#comment-<mt:commentID /></mt:commentParent>"><mt:commentParent>No.<mt:commentID />の<mt:commentAuthor escape="html" /></mt:commentParent></a>さんのコメントへの返信</p>
   </mt:ifCommentParent>
   <mt:commentBody /></div>
 
   <p class="comment-footer">
      Posted by <mt:if tag="commentURL"><a href="<mt:commentURL />"></mt:if><mt:commentAuthor default="Anonymous" escape="html" /><mt:if tag="commentURL"></a></mt:if> <mt:if tag="CommentAuthorIdentity"><mt:commentAuthorIdentity /></mt:if> at <mt:commentDate /><mt:ifCommentsAccepted> | <mt:commentReplyToLink /></mt:ifCommentsAccepted>
   </p>
</div>

４．デフォルトテンプレート（抜粋）の修正例

ブログ管理画面より「デザイン」→「テンプレート」で「コメント」テンプレートモジュール編集画面を開き、赤色の MTCommentAuthorLink タグの部分を、青色の内容に変更してください。

変更前

...前略...
<div class="asset-meta">
  <span class="byline">
<$mt:CommentAuthorIdentity$>
<mt:IfCommentParent>
    <span class="vcard author"><$mt:CommentAuthorLink$></span>から<a href="<mt:CommentParent><$mt:CommentLink$></mt:CommentParent>"><mt:CommentParent><$mt:CommentAuthor$></mt:CommentParent></a>への返信
<mt:Else>
    <span class="vcard author"><$mt:CommentAuthorLink$></span>
</mt:IfCommentParent>
    | <a href="<$mt:CommentLink$>"><abbr class="published" title="<$mt:CommentDate format_name="iso8601"$>"><$mt:CommentDate$></abbr></a>
<mt:IfCommentsAccepted>
    | <$mt:CommentReplyToLink$>
</mt:IfCommentsAccepted>
  </span>
</div>
...後略...

変更後

...前略...
<div class="asset-meta">
  <span class="byline">
<$mt:CommentAuthorIdentity$>
<mt:IfCommentParent>
    <span class="vcard author"><mt:if tag="commentURL"><a href="<mt:commentURL />"></mt:if><mt:commentAuthor default="Anonymous" escape="html" /><mt:if tag="commentURL"></a></mt:if></span>から<a href="<mt:CommentParent><$mt:CommentLink$></mt:CommentParent>"><mt:CommentParent><$mt:CommentAuthor$></mt:CommentParent></a>への返信
<mt:Else>
    <span class="vcard author"><mt:if tag="commentURL"><a href="<mt:commentURL />"></mt:if><mt:commentAuthor default="Anonymous" escape="html" /><mt:if tag="commentURL"></a></mt:if></span>
</mt:IfCommentParent>
    | <a href="<$mt:CommentLink$>"><abbr class="published" title="<$mt:CommentDate format_name="iso8601"$>"><$mt:CommentDate$></abbr></a>
<mt:IfCommentsAccepted>
    | <$mt:CommentReplyToLink$>
</mt:IfCommentsAccepted>
  </span>
</div>
...後略...

「スパムコメントを Movable Type の Junk フォルダに溜めたくない。MT BanASCII も動作しません」という質問を頂いたので、プラグインの勉強をかねて「asciiTBPingfilter」を流用した asciiCommentfilter プラグインを作成しました。

１．プラグインの概要

Mobavle Type では 3.2 以降、Junk Filter を利用して、スパムとみなされたコメントは Junk フォルダに入るようになっています。また誤ってフィルタリングしたコメントを探索・公開できるよう、指定した一定期間、保存できる仕組みになっています。

このプラグインはASCII文字のみのコメントが投稿された場合、Junk フォルダにも入れず、次のようなコメントエラーにします。

プラグインの主な機能は次の通りです。

• テキストエリアにASCII文字のみのコメントが投稿された場合、コメント投稿エラーにします（デフォルト：オン）。スパムとして Movable Type のデータベースに保存しません。
• 設定はブログ単位に可能です。
• 動作を確認するためのログ出力が可能です（デフォルト：オフ）。

２．動作条件

Perl 5.8 以上であることが必要です（Encode.pm を利用するため）。誤って 5.6.x の環境で利用しても処理異常にならないようにしています。

３．ダウンロード・インストール

下記リンクより asciiTBPingfilter.zip または asciiTBPingfilter.lzh をダウンロードし、アーカイブを解凍してください。

• asciiCommentfilter プラグイン（MT 4.x ／MT 5.x 版）
• asciiCommentfilter プラグイン（MT 3.3x 版）

解凍すると中に asciiCommentfilter フォルダがありますので、フォルダごと Movable Type の plugins ディレクトリにアップロードしてください。

MT4 ／MT5版の場合、ブログ別管理画面の「システムメニュー」→「プラグイン」で、ASCII Comment Filter Plugin 0.02 が表示されていればOKです。インストール直後から動作が有効になります。

プラグインを無効にしたい場合は、ブログ管理画面の「ツール」→「プラグイン」→「ASCII Trackback Ping Filter Plugin」の右側にある「設定」をクリックして、「ASCII 文字のみのコメントをフィルタリング（スパムとしても保存しない）」のチェックボックスをチェックを外し、「変更を保存」をクリックしてください。

４．ログを出力する

３項のプラグイン設定画面の「フィルタリングされたコメントをログに出力する」のチェックボックスをチェックし、「変更を保存」をクリックしてください。

コメントのフィルタリング状況を、システムログまたはブログ別のログに出力します。

５．注意事項

サインインして投稿したコメントもフィルタリングの対象になります。

Movable Type 4.2 以降では SpamLookup 以外にもスパムコメント対策が行われているので、コメントフォームから直接投稿しないスパムは、このプラグイン以前に弾かれる可能性があります。

Movable Type のブログ記事ページやウェブページでの認証コメントでは、コメントフォームにサインインした後、ブログ記事ページのトップに戻ってしまいます。

例として、Movable Type のあるブログ記事にサインインします。

サインイン後は、サインインしたページの先頭に戻ってしまいます。

ファイルサイズが小さいページであれば、少しスクロールすればコメントフォームを表示できますが、大量のコメントの下にコメントフォームがある場合など、再びコメントフォームに移動するのは結構面倒です。

本エントリーでは、サインイン後に表示されるブログ記事ページ（またはウェブページ）でコメントフォームの位置までスクロールして表示するカスタマイズを紹介します。

このカスタマイズを行えば、サインイン後に、次のようにコメントフォームの位置までスクロールした状態で表示します。

このブログでも少し前からこのカスタマイズを適用していますので、動作を知りたい方はとりあえずコメントフォームにサインインしてみてください。

１．Movable Type 4.2 デフォルトテンプレート「既定のブログ」の場合

「コメント」テンプレートモジュールの h2 要素に id 属性「_login」を追加します。

変更前

...前略...
<mt:IfCommentsAccepted>
<div class="comments-open" id="comments-open">
    <h2 class="comments-open-header">コメントする</h2>
    <div class="comments-open-content">
...後略...

変更後

...前略...
<mt:IfCommentsAccepted>
<div class="comments-open" id="comments-open">
    <h2 id="_login" class="comments-open-header">コメントする</h2>
    <div class="comments-open-content">
...後略...

２．当ブログの Movable Type 4.2 配布テンプレートの場合

「コメント入力フォーム」テンプレートモジュールの h2 要素に id 属性「_login」を追加します。

変更前

<mt:entryIfCommentsOpen> 
<div class="comments-open" id="comments-open">
   <h2 class="comments-open-header">コメントする</h2>
   <div class="comments-open-content">
..後略...

変更後

<mt:entryIfCommentsOpen> 
<div class="comments-open" id="comments-open">
   <h2 id="_login" class="comments-open-header">コメントする</h2>
   <div class="comments-open-content">
..後略...

３．スクロール表示できる仕組み

大体お分かりだと思いますが、サインイン後にリダイレクトされた URL の末尾に「#_login」が付与されます。これをフラグメントとして利用している訳です。

なお、ブログ管理者がブログ管理画面などにログインしているブラウザと同じブラウザで、ブログ記事のコメントフォームにサインインしても、このカスタマイズのようなスクロールは行われません。

４．マークアップの妥当性について

XHTML では id 属性値が "_" で開始しても問題ありません。ただし、HTML4.01 では違反ですので気をつけてください。

ハイパーリンクを提供する - 名付けたフラグメントにリンクする

５．name 属性によるフラグメントについて

４項では id 属性を用いたフラグメント方法を紹介しましたが、name 属性を用いたフラグメント、例えば、

<a name="_login"></a>

という方法については、

• XHTML では id 属性によるフラグメントに変更（name 属性自体が XHTML 1.1 で廃止）
• Movable Type デフォルトテンプレート・配布テンプレートはXHTML

という理由で紹介をしておりません。ただし、HTML4.01 でマークアップをしている場合は name 属性によるフラグメントを行ってください。

なお、XHTML 1.0 で、id 属性によるフラグメントをサポートしていないブラウザに対応させたい場合は、１項または２項の変更で id 属性と name 属性を併記してください。

<h2 id="_login" name="_login" class="comments-open-header">コメントする</h2>

最近の主なブラウザ（IE/Firefox/Opera/Safari/Google Chrome）では id 属性によるフラグメントが可能です。

• ハイパーリンクを提供する - 文書の特定の場所へのリンク
• XHTMLの書き方と留意点

2008.10.24
５項を追加しました。

Movable Type 4.1 と 4.2 のコメント入力フォームの差分を掲載します。

Movable Type 4.2 では、インデックステンプレートの JavaScript（mt.js）の実装がほぼすべて新しくなり、それに伴い、コメント入力フォームのマークアップもかなり変更されています。

4.1 から 4.2 にアップグレードした場合、JavaScript（mt.js）やコメント入力フォームはそのままでも問題ないと思いますが、4.2 のコメント関連機能を活用するには、インデックステンプレートの JavaScript（mt.js）を初期化、つまり 4.2 の JavaScript（mt.js）を利用し、コメント入力フォームのテンプレートについては、以下に示す変更を行うと良いでしょう。

１．コメントプレビュー用データ

表示されているページがコメントプレビューであることを示すための情報を設定します。
コメントプレビューテンプレートに下記の青色のスクリプトを、mt.js が読み込まれる前に実行されるよう、挿入してください。

4.1

...前略...
<MTSetVarBlock name="html_head">
<script type="text/javascript" src="<$MTLink template="javascript"$>"></script>
</MTSetVarBlock>
...後略...

4.2

...前略...
<MTSetVarBlock name="html_head">
<script type="text/javascript">
/* <![CDATA[ */
var user = <mt:userSessionState />;
var is_preview = true;
/* ]]> */
</script>
<script type="text/javascript" src="<$MTLink template="javascript"$>"></script>
</MTSetVarBlock>
...後略...

この設定がもれていると、サインインしていないコメントでプレビューした場合、CAPTCHA フィールドがデフォルトで表示されないといった不具合が発生します。

２．メッセージ表示用エリアのマークアップ

「サインインできます」などのメッセージを表示するエリアのサブテンプレートは、4.1 で使われていた MTIfRegistrationAllowed タグがなくなり、(X)HTML の div 要素に変わりました。div 要素の id 属性値は comment-greeting としてください。

4.1

<MTIfRegistrationAllowed>
        <div id="comment-form-external-auth">
            <script type="text/javascript">
            <!--
            <MTIf name="comment_preview_template">is_preview = true;</MTIf>
            writeCommenterGreeting(commenter_name, <$MTEntryID$>, <$MTEntryBlogID$>, commenter_id, commenter_url);
            //-->
            </script>
        </div>
</MTIfRegistrationAllowed>

4.2

<div id="comment-greeting"></div>

３．form要素

onsubmit 属性値が変わりました。この変更を行わないと、コメント投稿時に「不正なエラーです」というエラーになります。

4.1

<form method="post" action="<$MTCGIPath$><$MTCommentScript$>" name="comments_form" id="comments-form" onsubmit="if (this.bakecookie.checked) rememberMe(this)">

4.2

<form method="post" action="<$mt:CGIPath$><$mt:CommentScript$>" name="comments_form" id="comments-form" onsubmit="return mtCommentOnSubmit(this)">

４．hidden属性のinput要素

4つの input 要素が追加されています。parent_id は親コメントへの返信コメントのときの親コメントIDです。armor（よろい）はスパムコメント対策用のデータです。

4.1

<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$MTEntryID$>" />
<input type="hidden" name="__lang" value="<$MTBlogLanguage$>" />

4.2

<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$mt:EntryID$>" />
<input type="hidden" name="__lang" value="<$mt:BlogLanguage$>" />
<input type="hidden" name="parent_id" value="<$mt:CommentParentID$>" id="comment-parent-id" />
<input type="hidden" name="armor" value="1" />
<input type="hidden" name="preview" value="" />
<input type="hidden" name="sid" value="" />

4.2（コメントプレビュー）

<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$mt:EntryID$>" />
<input type="hidden" name="__lang" value="<$mt:BlogLanguage$>" />
<mt:IfCommentParent>
    <input type="hidden" name="parent_id" value="<$mt:CommentParentID$>" id="comment-parent-id">
</mt:IfCommentParent>
<input type="hidden" name="armor" value="1" />
<input type="hidden" name="preview" value="" />

５．input要素（名前・メール・URL）

名前・メール・URLの input 要素に、CAPTCHAを表示するための onfocus 属性が追加されています。onfocus 属性値はブログ記事／ウェブページまたはコメントプレビュー画面で起動する関数が異なります。ブログ記事／ウェブページでは入力フィールドをクリックするとCAPTCHAを表示し、コメントプレビューではデフォルトで表示します。

4.1

<input id="comment-author" name="author" size="30" value="<MTIf name="comment_preview_template"><$MTCommentAuthor encode_html="1"$></MTIf>" />
...中略...
<input id="comment-email" name="email" size="30" value="<MTIf name="comment_preview_template"><$MTCommentEmail encode_html="1"$></MTIf>" />
...中略...
<input id="comment-url" name="url" size="30" value="<MTIf name="comment_preview_template"><$MTCommentURL encode_html="1"$></MTIf>" />

4.2

<input id="comment-author" name="author" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentAuthor encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />
...中略...
<input id="comment-email" name="email" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentEmail encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />
...中略...
<input id="comment-url" name="url" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentURL encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />

６．input要素（情報を保存）

onclick 属性値が変わりました。またコメントプレビューでは非表示になるため、全体をMTUnlessタグで括ります。

4.1

<div id="comment-form-remember-me">
    <label for="comment-bake-cookie"><input type="checkbox" id="comment-bake-cookie" name="bakecookie" onclick="if (!this.checked) forgetMe(document.comments_form)" value="1" />
        <__trans phrase="Remember personal info?"></label>
</div>

4.2（コメントプレビューでは表示させない制御を追加）

<mt:Unless name="comment_preview_template">
    <div id="comment-form-remember-me">
        <input type="checkbox" id="comment-bake-cookie" name="bakecookie" onclick="mtRememberMeOnClick(this)" value="1" accesskey="r" />
        <label for="comment-bake-cookie"><__trans phrase="Remember personal info?"></label>
    </div>
</mt:Unless>

７．返信表示用チェックボックス

コメント返信機能が標準装備されたので、返信用のチェックボックスが追加になりました。

4.1

なし

4.2

<div id="comments-open-data">
...中略...
</div>
<div id="comment-form-reply" style="display:none">
    <input type="checkbox" id="comment-reply" name="comment_reply" value="" onclick="mtSetCommentParentID()" />
    <label for="comment-reply" id="comment-reply-label"></label>
</div>

８．textarea要素

CAPTCHA表示用の onfocus 属性が追加されています。onfocus 属性値はブログ記事／ウェブページまたはコメントプレビュー画面によって内容が異なります。

4.1

<textarea id="comment-text" name="text" rows="15" cols="50"><MTIf name="comment_preview_template"><$MTCommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$></MTIf></textarea>

4.2

<textarea id="comment-text" name="text" rows="15" cols="50" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>"><mt:If name="comment_preview_template"><$mt:CommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$></mt:If></textarea>

９．CAPTCHA用フィールド

4.1 で使われていた テンプレートタグがなくなり、div 要素だけになりました。

4.1

<MTIfNonEmpty tag="MTCaptchaFields">
<MTIfCommentsAccepted><MTIfRegistrationAllowed><MTElse><$MTCaptchaFields$></MTIfRegistrationAllowed></MTIfCommentsAccepted>
<div id="comments-open-captcha">
</div>
</MTIfNonEmpty>

4.2

<div id="comments-open-captcha"></div>

１０．確認用フォームボタン

name 属性値が変更になり、onclick 属性が追加されました。

4.1

<input type="submit" accesskey="v" name="preview" id="comment-preview" value="<__trans phrase="Preview">" />

4.2

<input type="submit" accesskey="v" name="preview_button" id="comment-preview" value="<__trans phrase="Preview">" onclick="this.form.preview.value='1';" />

１１．投稿後、フォームボタンをdisableにするJavaScript（二重送信の防止）

コメントフォームの最後に script 要素が追加されました。

4.1

なし

4.2

<div class="comments-open" id="comments-open">
...中略...
</div>
<script type="text/javascript">
<!--
mtAttachEvent("load", mtEntryOnLoad);
mtAttachEvent("unload", mtEntryOnUnload);
//-->
</script>

１２．4.1のテンプレート構成で4.2にバージョンアップする場合のコメント入力フォームサンプル

4.2 の「既定のブログ」テンプレートセットでは、「コメント入力フォーム」テンプレートモジュールがなくなり、ブログ記事・ウェブページ用のコメント入力フォーム（「コメント」テンプレートモジュール）とコメントプレビューのコメント入力フォーム（コメントプレビューテンプレートに直接記述）が独立してしまったので、4.1 の「既定のブログ」テンプレートセットの構成に対応できるよう、

• ブログ記事
• ウェブページ
• コメントプレビュー

のテンプレートで使える「コメント入力フォーム」テンプレートモジュールを作ってみましたので、よければお使いください。
また、不具合がありましたらご連絡ください。

<mt:IfCommentsAccepted>
<div class="comments-open" id="comments-open">
    <h2 class="comments-open-header"><__trans phrase="Leave a comment"></h2>
    <div class="comments-open-content">
        <div id="comment-greeting"></div>
        <form method="post" action="<$mt:CGIPath$><$mt:CommentScript$>" name="comments_form" id="comments-form" onsubmit="return mtCommentOnSubmit(this)">
            <input type="hidden" name="static" value="1" />
            <input type="hidden" name="entry_id" value="<$mt:EntryID$>" />
            <input type="hidden" name="__lang" value="<$mt:BlogLanguage$>" />
            <mt:IfCommentParent>
                <input type="hidden" name="parent_id" value="<$mt:CommentParentID$>" id="comment-parent-id">
            </mt:IfCommentParent>
            <input type="hidden" name="armor" value="1" />
            <input type="hidden" name="preview" value="" />
            <div id="comments-open-data">
                <div id="comment-form-name">
                    <label for="comment-author"><__trans phrase="Name"></label>
                    <input id="comment-author" name="author" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentAuthor encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />
                </div>
                <div id="comment-form-email">
                    <label for="comment-email"><__trans phrase="Email Address"></label>
                    <input id="comment-email" name="email" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentEmail encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />
                </div>
                <div id="comment-form-url">
                    <label for="comment-url"><__trans phrase="URL"></label>
                    <input id="comment-url" name="url" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentURL encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />
                </div>
                <mt:Unless name="comment_preview_template">
                    <div id="comment-form-remember-me">
                        <input type="checkbox" id="comment-bake-cookie" name="bakecookie" onclick="mtRememberMeOnClick(this)" value="1" accesskey="r" />
                        <label for="comment-bake-cookie"><__trans phrase="Remember personal info?"></label>
                    </div>
                </mt:Unless>
            </div>
            <div id="comment-form-reply" style="display:none">
                <input type="checkbox" id="comment-reply" name="comment_reply" value="" onclick="mtSetCommentParentID()" />
                <label for="comment-reply" id="comment-reply-label"></label>
            </div>
            <div id="comments-open-text">
                <label for="comment-text"><__trans phrase="Comments">
                <mt:IfAllowCommentHTML><__trans phrase="(You may use HTML tags for style)"></mt:IfAllowCommentHTML></label>
                <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>"><mt:If name="comment_preview_template"><$mt:CommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$></mt:If></textarea>
            </div>
            <div id="comments-open-captcha"></div>
            <div id="comments-open-footer">
                <input type="submit" accesskey="v" name="preview_button" id="comment-preview" value="<__trans phrase="Preview">" onclick="this.form.preview.value='1';" />
                <input type="submit" accesskey="s" name="post" id="comment-submit" value="<__trans phrase="Submit">" />
            </div>
        </form>
    </div>
</div>
<script type="text/javascript">
<!--
mtAttachEvent("load", mtEntryOnLoad);
mtAttachEvent("unload", mtEntryOnUnload);
//-->
</script>
</mt:IfCommentsAccepted>

Movable Type 4.2 で JavaScript を無効にした状態でコメント投稿ができるようにするためのカスタマイズです。ご質問を頂いたので本エントリーにて情報展開致します。

単純にブラウザの JavaScript を無効にしてコメントを投稿すると、次のように「不正な要求です」というエラーになります。

JavaScript オフの状態でコメント投稿ができるようにするには、コメントフォームにある下記の1行を削除します。

<input type="hidden" name="armor" value="1" />

補足ですが、コメントを受け付けられる状態にしている場合、JavaScript を無効にすると、コメントフォームが無条件に表示されます。サインインやCAPTCHAも表示されません。登録/認証の設定で、「認証なしコメント」のチェックを外していても投稿可能です。

昨日公開した「「最近のコメント」のページを作る」は、ウェブページを保存しないと内容が更新されないという重大な誤りがありました。この場をお借りしてお詫び申し上げます。
はてブでのご指摘ありがとうございました。 ＞ aklaswadさん

前のエントリーは失敗例としてそのままにしておき、このエントリーで修正したものを紹介します。

Movable Type 4 で「最近のコメント」のページを作る方法です。

サイト内でひとつの独立したページを作成するため、ここではウェブページアーカイブを利用する方法を紹介します。サンプルはデフォルトテンプレートを使っていますが、他のテンプレートでも同様です。

このカスタマイズは、バージョン 4.2 向けです。4.0 ～4.1 で使用する場合は、手順の中のmteval モディファイアを、EvalTemplateプラグインに変更してください。多分動作すると思います。

このテクニックを利用すれば、「最近のブログ記事」や「カテゴリー一覧」など、好きなリストのページを作成することができます。

１．ウェブページアーカイブの修正

ウェブページアーカイブの本文フィールドでテンプレートタグを使えるようにするための修正を行います。

[設定]-[テンプレート]-[アーカイブテンプレート一覧]にある「ウェブページ」をクリックします。

テンプレート編集画面にある、MTPageBodyタグにmtevalモディファイアを追加して、[保存]をクリックします。

修正後のMTPageBodyタグは次のようになります。

<$mt:PageBody mteval="1"$>

２．「最近のコメント」インデックステンプレートの作成

「最近のコメント」のリスト部分を出力するインデックステンプレートを作成します。

[デザイン]-[テンプレート]でテンプレート一覧画面を表示し、インデックステンプレートを作成をクリックします。

テンプレートの内容に次のサブテンプレートを設定します。

<mt:IfNonZero tag="blogCommentCount">
<mt:Entries recently_commented_on="10">
  <mt:EntriesHeader>
<ul>
  </mt:EntriesHeader>
  <li><a href="<mt:EntryPermalink valid_html="1" />"><mt:EntryTitle encode_html="1"></a>
    <ul>
    <mt:Comments lastn="10">
      <li>
        <a href="<mt:EntryLink archive_type="Individual" />#c<mt:CommentID />" title="comment-<mt:CommentID />">
          <mt:CommentAuthor default="Anonymous">
        </a> <mt:CommentDate format="%m/%d" />
      </li>
    </mt:Comments>
    </ul>
  </li>
  <mt:EntriesFooter>
</ul>
  </mt:EntriesFooter>
</mt:Entries>
</mt:IfNonZero>

上記のテンプレートは自由にカスタマイズして構いません。

出力ファイル名に「recent_comments」、テンプレートの種類に「カスタムインデックステンプレート」を選択します。公開欄はとりあえずスタティックにしておいてください。

このテンプレートは、次項のウェブページを作成する前に、必ず再構築を行ってください。

３．「最近のコメント」ウェブページの作成

「最近のコメント」用のウェブページを作成します。

[新規作成]-[ウェブページの作成]でウェブページ作成画面を開きます。

タイトルは「最近のコメント一覧」として（何でもいいです）、本文フィールドのフォーマットを「なし」に変更します。

フォーマット変更後、次の内容を本文フィールドに設定します。

<mt:include file="recent_comments">

MTLink タグに file モディファイアを設定することで、外部ファイルの内容をページに反映させることができます。

ウェブページの出力先フォルダの設定は任意です。ここでは設定しないので、ブログディレクトリ直下に出力します。ファイル名は何でも構いませんが、「comments.html」にしておきます。また、このウェブページへのコメント・
トラックバックは受信しない設定にします。

保存すれば冒頭の画面のように表示されます。コメント投稿者は実在の人物ですが、気にしないでください。

４．「最近のコメント」ウェブページへのリンクの作成

このページへのリンクを表示するには、サイドバーなどに、このページのURLを、a 要素のhref属性に直接埋め込むか、MTLinkタグを使って次の内容を埋め込んでください。

<a href="<mt:Link entry_id="ウェブページのID番号" />">最近のコメント</a>

ウェブページのID番号 は、該当のウェブページ編集画面を表示したときのURLに含まれる、下記の赤色部分です。

http://user-domain/mt/mt.cgi?__mode=view&_type=page&id=3&blog_id=1

entry_id モディファイアはもともとブログ記事のID番号を指定するためのモディファイアですが、ウェブページのID番号はブログ記事とウェブページでユニーク（=ブログ記事と重複しない）なので、このような指定が可能、という訳です。

５．インデックステンプレートのみで「最近のコメント」のページを作る場合

１～４項の手順ではウェブページを使った方法を示しましたが、ウェブページを使わない場合は、インデックステンプレートのみで「最近のコメント」のページを作ります。

具体的には、「最近のコメント」という新しいインデックステンプレートを作成し、「メインページ」インデックステンプレートと、「ブログ記事の概要」テンプレートモジュールの(X)HTMLマークアップ部分と、３項の内容を組み合わせたものを設定します（以下）。

黒色部分が「メインページ」インデックステンプレート、青色部分が「ブログ記事の概要」テンプレートモジュール、赤色が３項の「最近のコメント」のサブテンプレートです。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" id="sixapart-standard">
<head>
  <$mt:Include module="HTMLヘッダー"$>
  <link rel="EditURI" type="application/rsd+xml" title="RSD" href="<$mt:Link template="rsd"$>" />
  <title><$mt:BlogName encode_html="1"$></title>
</head>
<body id="<$mt:BlogTemplateSetID$>" class="mt-main-index <$mt:Var name="page_layout"$>">
  <div id="container">
    <div id="container-inner">
      <$mt:Include module="バナーヘッダー"$>
      <div id="content">
        <div id="content-inner">
          <div id="alpha">
            <div id="alpha-inner">
<div class="entry-asset asset hentry">
  <div class="asset-header">
    <h2 class="asset-name entry-title">最近のコメント</h2>
  </div>
  <div class="asset-content entry-content">
    <div class="asset-body">
<mt:IfNonZero tag="blogCommentCount">
<mt:Entries recently_commented_on="10">
<mt:EntriesHeader>
  <ul>
</mt:EntriesHeader>
  <li><a href="<mt:EntryPermalink valid_html="1" />"><mt:EntryTitle encode_html="1"></a>
    <ul>
    <mt:Comments lastn="10">
      <li>
        <a href="<mt:EntryLink archive_type="Individual" />#c<mt:CommentID />" title="comment-<mt:CommentID />">
          <mt:CommentAuthor default="Anonymous">
        </a> <mt:CommentDate format="%m/%d" />
      </li>
    </mt:Comments>
    </ul>
  </li>
<mt:EntriesFooter>
  </ul>
</mt:EntriesFooter>
</mt:Entries>
</mt:IfNonZero>
    </div>
  </div>
  <div class="asset-footer"></div>
</div>
            </div>
          </div>
          <$mt:Include module="サイドバー"$>
        </div>
      </div>
      <$mt:Include module="バナーフッター"$>
    </div>
  </div>
</body>
</html>

このインデックステンプレートから出力したページへのリンクを表示するには、サイドバーなどに、このページのURLを、a 要素のhref属性に直接埋め込むか、MTLinkタグを使って次の内容を埋め込んでください。

<a href="<mt:Link template="最近のコメント" />">最近のコメント</a>

Movable Type 4 で「最近のコメント」のページを作る方法です。

お詫び：このカスタマイズにはウェブページを更新しないと、最新の情報が取得できないという致命的な誤りがあるため、本エントリーのカスタマイズは行わず「「最近のコメント」のページを作る（改）」を参照してください。なお、本カスタマイズで使用しているプラグインには何ら問題はありません。

サイト内でひとつの独立したページを作成するため、ここではウェブページアーカイブを利用する方法を紹介します。サンプルはデフォルトテンプレートを使っていますが、他のテンプレートでも同様です。

このカスタマイズは、バージョン 4.2 向けです。4.0 ～4.1 で使用する場合は、手順の中のmteval モディファイアを、EvalTemplateプラグインに変更してください。多分動作すると思います。

このテクニックを利用すれば、「最近のブログ記事」や「カテゴリー一覧」など、好きなリストのページを作成することができます。

１．IndexContext プラグインのインストール

「メインページと同じ情報をアーカイブページで表示する indexcontext プラグイン」の１項の設定を行ってください。

このプラグインを使用しないと、ウェブページ（の本文フィールド）でMTCommentsタグを使用した場合、ウェブページのコンテキストに依存してしまい、期待する内容（=ブログ全体を対象としてコメント）が出力されません。

２．ウェブページアーカイブの修正

ウェブページアーカイブの本文フィールドでテンプレートタグを使えるようにするための修正を行います。

[設定]-[テンプレート]-[アーカイブテンプレート一覧]にある「ウェブページ」をクリックします。

テンプレート編集画面にある、MTPageBodyタグにmtevalモディファイアを追加して、[保存]をクリックします。

修正後のMTPageBodyタグは次のようになります。

<$mt:PageBody mteval="1"$>

３．「最近のコメント」ウェブページの作成

「最近のコメント」用のウェブページを作成します。

[新規作成]-[ウェブページの作成]でウェブページ作成画面を開きます。

タイトルは「最近のコメント一覧」として（何でもいいです）、本文フィールドのフォーマットを「なし」に変更します。

フォーマット変更後、次の内容を本文フィールドに設定します。

<mt:IndexContext>
<mt:IfNonZero tag="blogCommentCount">
<mt:Entries recently_commented_on="10">
  <mt:EntriesHeader>
<ul>
  </mt:EntriesHeader>
  <li><a href="<mt:EntryPermalink valid_html="1" />"><mt:EntryTitle encode_html="1"></a>
    <ul>
    <mt:Comments lastn="10">
      <li>
        <a href="<mt:EntryLink archive_type="Individual" />#c<mt:CommentID />" title="comment-<mt:CommentID />">
          <mt:CommentAuthor default="Anonymous">
        </a> <mt:CommentDate format="%m/%d" />
      </li>
    </mt:Comments>
    </ul>
  </li>
  <mt:EntriesFooter>
</ul>
  </mt:EntriesFooter>
</mt:Entries>
</mt:IfNonZero>
</mt:IndexContext>

上記のテンプレートは自由にカスタマイズして構いませんが、一番外側のIndexContextタグは外さないでください。

このページの出力先フォルダの設定は任意です。ここでは設定しないので、ブログディレクトリ直下に出力します。ファイル名は何でも構いませんが、「comments.html」にしておきます。また、このウェブページへのコメント・
トラックバックは受信しない設定にします。

保存すれば冒頭の画面のように表示されます。コメント投稿者は実在の人物ですが、気にしないでください。

４．「最近のコメント」ウェブページへのリンクの作成

このページへのリンクを表示するには、サイドバーなどに、このページのURLを、a 要素のhref属性に直接埋め込むか、MTLinkタグを使って次の内容を埋め込んでください。

<a href="<mt:Link entry_id="ウェブページのID番号" />">最近のコメント</a>

ウェブページのID番号 は、該当のウェブページ編集画面を表示したときのURLに含まれる、下記の赤色部分です。

http://user-domain/mt/mt.cgi?__mode=view&_type=page&id=3&blog_id=1

entry_id モディファイアはもともとブログ記事のID番号を指定するためのモディファイアですが、ウェブページのID番号はブログ記事とウェブページでユニーク（=ブログ記事と重複しない）なので、このような指定が可能、という訳です。

Movable Type 4.2における、コメント投稿フォームの変更点を紹介します。

１．コメントフォームとメッセージの表示方法

コメントポリシーや認証の設定によって、表示状態や表示メッセージが切り替わるコメントフォームですが、4.2では次のように変更されています。

１．１ 「認証なしコメント」のみを選択

メッセージを表示せず、コメントフォームをデフォルトで表示します。

１．２「認証なしコメント」と1つ以上の認証方式を選択

「コメントする前にサインインすることもできます」というメッセージを表示し、コメントフォームをデフォルトで表示します。

１．３ 「認証なしコメント」を選択せず、1つ以上の認証方式を選択

「コメントするにはまずサインインしてください」というメッセージを表示し、コメントフォームは表示しません。

２．サインイン時にローディング画像表示

「サインイン」をクリックすると、サインイン画面に遷移するまでの間、ローディング画像を表示します。

３．匿名表示

名前フィールドを入力せずに、コメントプレビューすると、名前フィールドに「匿名」が自動的に表示されます。

４．サインイン状態のコメントプレビュー

サインイン状態のコメント投稿フォームは、URL入力が消え、テキストエリアのみの表示に変更されています。

コメントプレビュー画面も同様です。

５．親コメントへの返信

コメント本文に表示された「返信」をクリックすると、「～のコメントに返信」のチェックボックスが表示されます。チェックを外すと返信が解除されます。ことなるコメントの「返信」をクリックすると、チェックボックスの表示や保持する情報も切り替わります。

コメントプレビュー時も返信コメントの情報は保持されます。

６．CAPTCHA

CAPTCHAを有効にしていて、かつ「認証なしコメント」と1つ以上の認証方式を選択している場合、デフォルトではCAPTCHAは表示されず、任意の入力フィールドをクリックするとCAPTCHAが表示されます。これは、コメントフォームを表示する方式に変更したことにより、コメント投稿者のサインイン認証の可否が判断するための対処と思われます。

CAPTCHAフィールドが表示されていない状態

サインインせずに入力フィールドをクリックすると、CAPTCHAを表示

７．フォームボタン

投稿すると、フォームボタンをグレーアウトします。

以上です。
JavaScriptも大きく変更されています。これについては別エントリーします。

「月別などのコメント投稿ランキングを表示したい」というご要望をいただきましたので、プラグインを作成してみました。

１．主な機能

• システムログに記録されたコメントより投稿者の一覧を表示します
• 年月指定が可能です
• 投稿件数順による並び替えが可能です
• 一覧から特定の投稿者を非表示にできます

コメント投稿者のURLやメールアドレスのリンク設定はできません。
またブログの文字コードをUTF-8以外で運用している場合の動作については確認できておりません。

２．プラグインのダウンロード

下記のリンクをクリックしてプラグインをダウンロードしてください。

LogCommentAuthors.zip

なお、プラグイン開発やサポート等にご支援・ご賛同くださる方からの寄付をお待ち申し上げます。

上記の「寄付」のリンクをクリックすると Paypal によるお支払いページにジャンプします。

３．プラグインのアップロード

ダウンロードしたプラグインを解凍し、中にあるLogCommentAuthors.pl を plugins ディレクトリに丸ごとアップロードしてください。

ブログ管理メニューの「設定」→「プラグイン」で LogCommentAuthors が表示されればインストール完了です。

４．提供するテンプレートタグ・モディファイア

テンプレートタグ

MTLogCommentAuthors

ログに記録されたコメント一覧のためのブロックタグ

MTLogCommentAuthor

コメント投稿者を出力するファンクションタグ

MTLogCommentAuthorCount

コメント投稿者別の投稿数を出力するファンクションタグ

モディファイア

lastn

最新のコメントから収集する投稿者数

sort_order

descend 指定で投稿の多い順に表示／ascend 指定で投稿の少ない順に表示

year

コメント投稿年（コメント投稿月と併用）

month

コメント投稿月。1月など一桁の月は、1でも01でも可能です。

exclude_author

非表示にしたいコメント投稿者

※モディファイアを複雑に組み合わせた場合の動作は保障できません。

５．使用例

ログに記録されたすべてのコメント投稿者と投稿数を表示

<ul>
<MTLogCommentAuthors>
<li><$MTLogCommentAuthor$> [<$MTLogCommentAuthorCount$>]</li>
</MTLogCommentAuthors>
</ul>

ログに記録された2008年3月分のコメント投稿者と投稿数を、投稿数の多い順に表示

<ul>
<MTLogCommentAuthors year="2008" month="3" sort_order="descend">
<li><$MTLogCommentAuthor$> [<$MTLogCommentAuthorCount$>]</li>
</MTLogCommentAuthors>
</ul>

さらにブログ管理者（yujiro）の分を非表示にする

<ul>
<MTLogCommentAuthors year="2008" month="3" sort_order="descend" exclude_author="yujiro">
<li><$MTLogCommentAuthor$> [<$MTLogCommentAuthorCount$>]</li>
</MTLogCommentAuthors>
</ul>

６．ライセンス

デュアルライセンスです。

６．１ MT4.1個人ライセンス／MT4.1商用ライセンスと組み合わせる場合

• 無料で利用できます。
• 改変・再配布は自由ですが、改変して再配布する場合、原作者のクレジットを必ず残してください。

６．２ MTOSと組み合わせる場合

• 無料で利用できます。
• GPLv2に従います。

Movable Type のブログ記事アーカイブにある、コメントのフラグメントを動的に切り替えるカスタマイズです。

「フラグメント」とは「文書の特定の場所へのリンク」のことです。フラグメントに対応する、コメントへのリンクのフラグメント識別子（URLの#以降の部分）は、今回の場合、次のようになっています。

http://user-domain/2008/03/post.html#comments

今回実現したい、フラグメントによるリンクは次の通りです。

• ブログ記事にコメントが投稿されている場合、メインページに表示されているコメントへのリンクをクリックすると、その先頭にジャンプする
• ブログ記事にコメントが投稿されていない場合、メインページに表示されているコメントへのリンクをクリックすると、コメント投稿フォームにジャンプする

デフォルトテンプレートのコメント関連のマークアップは次のようになっています。投稿コメントおよびコメントフォーム全体を div 要素で括り、フラグメントとなる id 属性（赤色）を付与しているので、投稿コメントの有無に依存せず、常にフラグメントが存在します。

<MTIfCommentsActive>
<div id="comments" class="comments">
    <MTIf name="comment_preview_template">
    <$MTInclude module="コメント入力フォーム"$>
    </MTIf>
    <MTComments>
        <MTCommentsHeader>
    <h2 class="comments-header">コメント(<$MTEntryCommentCount$>)</h2>
    <div class="comments-content">
        </MTCommentsHeader>
        <$MTInclude module="コメント詳細"$>
        <MTCommentsFooter>
    </div>
        </MTCommentsFooter>
    </MTComments>
    <MTUnless name="comment_preview_template">
    <$MTInclude module="コメント入力フォーム"$>
    </MTUnless>
</div>
</MTIfCommentsActive>

問題となるのは、コメント全体に対してフラグメントが設定できないマークアップになっている場合です。

例えば次のようなマークアップを想定します。

<MTIfCommentsActive>
<MTIf name="comment_preview_template">
<div>
    <$MTInclude module="コメント入力フォーム"$>
</div>
</MTIf>
 
<MTComments>
    <MTCommentsHeader>
<h2 id="comments" class="comments-header">コメント(<$MTEntryCommentCount$>)</h2>
<div class="comments-content">
    </MTCommentsHeader>
    <$MTInclude module="コメント詳細"$>
    <MTCommentsFooter>
</div>
    </MTCommentsFooter>
</MTComments>
 
<MTUnless name="comment_preview_template">
<div>
    <$MTInclude module="コメント入力フォーム"$>
</div>
</MTUnless>
</MTIfCommentsActive>

このマークアップでは、もし投稿コメントがひとつもないと、MTComments 内部が実行されず、フラグメントも表示されないため、コメントのリンクをクリックするとページのトップにジャンプすることになります。
つまり、投稿コメントの有無によって、フラグメントの出力位置を切り替える必要があります。

この問題を解消するには、次のようにコメント入力フォーム部分に MTIfNonZero を追加し（青色部分）、投稿コメント件数が0の場合だけ id 属性を表示するようにします。

<MTIfCommentsActive>
<MTIf name="comment_preview_template">
<div>
    <$MTInclude module="コメント入力フォーム"$>
</div>
</MTIf>
 
<MTComments>
    <MTCommentsHeader>
<h2 id="comments" class="comments-header">コメント(<$MTEntryCommentCount$>)</h2>
<div class="comments-content">
    </MTCommentsHeader>
    <$MTInclude module="コメント詳細"$>
    <MTCommentsFooter>
</div>
    </MTCommentsFooter>
</MTComments>
 
<MTUnless name="comment_preview_template">
<div<MTIfNonZero tag="MTEntryCommentCount"><MTElse> id="comments"</MTIfNonZero>>
    <$MTInclude module="コメント入力フォーム"$>
</div>
</MTUnless>
</MTIfCommentsActive>

なお、コメント入力フォームの MTInclude が2ヶ所ありますが、最初に現れる、MTIf タグで括られた方は、コメントプレビュー時しか表示されない（=フラグメントの対象にならないため）ので、対処する必要はありません。

参考記事：文書の特定の場所へのリンク

Movable Type でコメント用の RSS フィードを出力するカスタマイズです。ご質問を頂きましたので本エントリーにて紹介致します。

ネットで検索すると過去の記事がいくつかヒットしましたが、それを使ってみると RSS リーダーで正常に読み込めないケースがあったため、新たに作り直してみました。

livedoor reader、Google リーダー、feedpath Rabbit で正常に購読できることを確認しています。

livedoor reader のサンプル

Google リーダーのサンプル

feedpath Rabbit のサンプル

１．設定方法

「デザイン」→「テンプレート」より「インデックステンプレートを作成」をクリック。

次の画面で以下の内容を設定してください。

• テンプレート名：Comment RSS
• テンプレートの内容：下記
• テンプレートの種類：RSS
• 出力ファイル名：comments.xml（何でもいいです）
• 再構築オプション：チェック

<$MTHTTPContentType type="application/rss+xml"$><?xml version="1.0" encoding="<$MTPublishCharset$>"?>
<rss version="2.0" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title><$MTBlogName remove_html="1" encode_xml="1"$></title>
    <link><$MTBlogURL$></link>
    <description><$MTBlogName remove_html="1" encode_xml="1"$>へのコメント</description>
    <language><$MTBlogLanguage ietf="1"$></language>
    <pubDate><MTComments lastn="1"><$MTCommentDate format_name="rfc822"$></MTComments></pubDate>
    <generator>http://www.sixapart.com/movabletype/</generator>
    <MTComments lastn="15" sort_order="descend">
    <item>
      <title>「<MTCommentEntry><$MTEntryTitle remove_html="1" encode_xml="1"$>」へのコメント</MTCommentEntry></title>
      <link><MTCommentEntry><$MTEntryPermalink encode_xml="1"$></MTCommentEntry>#comment-<$MTCommentID$></link>
      <dc:creator><$MTCommentAuthor$></dc:creator>
      <pubDate><$MTCommentDate format_name="rfc822"$></pubDate>
      <guid><MTCommentEntry><$MTEntryPermalink$>#comment-<$MTCommentID$></MTCommentEntry></guid>
      <description><$MTCommentBody remove_html="1" encode_xml="1"$></description>
      <content:encoded><![CDATA[<$MTCommentBody$>]]></content:encoded>
    </item>
    </MTComments>
  </channel>
</rss>

下は設定イメージです。

保存後、再構築すれば完成です。

２．公開方法

テンプレートモジュールの「ヘッダー」にある link 要素のところに青色の link 要素を追加すれば、RSS リーダーで登録しやすくなります。併せてブログ上にコメント用RSSのリンクを表示すると良いでしょう。

    <MTIf name="main_template">
<link rel="alternate" type="application/atom+xml" title="Atom" href="<$MTLink template="atom"$>" />
<link rel="alternate" type="application/rss+xml" title="RSS" href="<$MTLink template="rss"$>" />
<link rel="alternate" type="application/rss+xml" title="Comment RSS" href="<$MTLink template="Comment RSS"$>" />
   </MTIf>

title 要素の名称が相応しくないようでしたらご指摘ください。

３．表示コメント数の変更

MTComments タグの lastn モディファイアの値を変更してください。デフォルトは15件にしています。

<MTComments lastn="15" sort_order="descend">

４．link 要素と guid 要素について

item 要素内の link 要素と guid 要素は、ユニークな値でなければならないため、このテンプレートではブログ記事のURLに、フラグメント（リンクの#以降の部分）としてコメントIDを付与した形式にしています。

この要素の設定が、ブログの設定ときちんと合っていれば、RSS リーダーで表示される記事へのリンク（ここでは記事+コメントのリンク）をクリックした時に、ブログの該当記事の該当コメントの位置にジャンプしてくれます。

デフォルトテンプレートではフラグメントは、

<$MTEntryPermalink$>#comment-<$MTCommentID$>

となっていますので、このエントリーで配布しているテンプレートもそれにあわせています。

他のテンプレートを利用している場合はフラグメントを確認して適宜修正してください（修正箇所は2つあります）。ちなみに、当サイトのテンプレートをご利用の場合は、

<$MTEntryPermalink$>#c<$MTCommentID$>

としてください。

５．MTHTTPContentTypeタグについて

先頭の MTHTTPContentType タグは、ダイナミックパブリッシングで出力するときに必要なものです。スタティックパブリッシングの場合は何も処理されないので削除する必要はありません。

６．更新日時について

参考までに、更新日時は、下記の MTCommentDate タグに format_name モディファイアで取得しています。

<$MTCommentDate format_name="rfc822"$>

format_nameモディファイアに"rfc822"を設定しておけば、RSS2.0 の仕様に合った形式で更新日付が出力されます。
format_nameモディファイアには、"rfc822"の他、"iso8601"も設定できます。

６．関連記事

• RSS2.0
• rfc822

Movable Type 4 のコメント投稿では複数の認証方式が用意されています。その中のひとつに「Movable Type 認証」という方式があります（下）。

これは、その Movable Type にユーザーとして登録されている人が利用するための認証で、他の、全く別にインストールした Movable Type のアカウントで認証できるものではありません。したがって、Movable Type 認証には「認証しようとするユーザーが、その Movable Type にユーザー登録されている」という制限があります。

ただし、厳密には MT の設定方法によって、外部の人間に対し「コメント投稿者」という権限を与えることができるため、「Movable Type」の認証によるコメント投稿が可能になります。以前、「Movable Type の認証では（他の方のブログの）コメント投稿はできません」と、誤解を招く発言をしたことがあるかもしれませんが、その点についてはお詫び申し上げます。

以下、その設定方法および、Movable Type の認証によるコメント投稿方法を紹介します。

１．（コメント投稿対象ブログの）管理画面の設定

システムメニューの「設定」→「全般」画面で、「システムのメールアドレス」を設定し「変更を保存」をクリック。このフィールドを設定しないと、後に説明する「メール通知」が行われません。

システムメニューの「設定」→「ユーザー」画面で、「コメント投稿者がMovable Typeに登録することを許可する」にチェックをして「変更を保存」をクリック。

ブログ別管理画面の「設定」→「ブログの設定」→「登録/認証」で「ユーザー登録」をチェック。

２．コメント投稿側の設定

コメント投稿の認証画面より「Movable Type」を選択して「サインアップ」をクリック。ブログ管理者の設定によっては「Movable Type」が選択できない場合もあります。

必要事項を記入して「登録する」をクリック。

「ご登録ありがとうございます。」という画面が表示され、表示されている（コメント投稿者の）メールアドレスにアカウント登録の確認メールが送信されます。

下のようなメールが届いていたら、表示されている URL にアクセスします。もしメールが届いてないようであればメールアドレス誤りか、MT の設定（本エントリーの一番最初の手順）が完全に行われていない可能性があります。

メールに表示されたURL にアクセスし、次の画面が表示されれば、他人の MT にコメント投稿者として登録されます。

３．Movable Type 管理画面でのコメント投稿者の扱い

登録した「hoge」さんの MT での権限は「コメント登録者」として表示されます。

「コメント登録者として権限を与えると、ブログ管理画面にログインされてしまうのでは？」と思われるかもしれませんが、登録したアカウントで他人の MT にログインしても、次のようなアカウント変更画面しか表示されません。

また、登録が完了していないユーザは、下のように「保留」状態になります。このフィールドは、ブログ管理画面からのユーザー登録では「有効・無効」しか選択できませんので、外部から登録する際の特殊なケースです。

Movable Type 4 のコメント投稿画面にある、「ログイン情報を記憶」というチェックボックス（下のスクリーンショット一番下のチェックボックス）は、投稿者情報（名前・電子メール・URL）をクッキーを利用して保存し、次回の投稿時に投稿者情報の入力を不要にするためのものです。

チェックボックスにチェックをしておけば、コメント投稿時に投稿者情報がクッキーに保存されます。

逆に、このチェックを外すと、チェックを外した瞬間にクッキーから投稿者情報を消去する動作が実行されるのですが、同時に、入力フィールドに記入された投稿者情報まで消去されてしまいます（下）。

チェックを外す操作によるフォーム情報のクリアは、ユーザが意図しない動作のように思われます。

ということで、このエントリーでは、チェックを外しても投稿者情報を消去せず、クッキー情報のみ削除するカスタマイズを紹介します。

１．設定方法

ブログ管理画面より、「デザイン」→「テンプレート」を開き、一覧に表示された「JavaScript」のリンクをクリック。これは mt.js というコメントフォーム制御用の JavaScript です。

「テンプレートの内容」にある赤色の部分

　　　　：
function forgetMe (f) {
    deleteCookie('mtcmtmail', '/', '');
    deleteCookie('mtcmthome', '/', '');
    deleteCookie('mtcmtauth', '/', '');
    f.email.value = '';
    f.author.value = '';
    f.url.value = '';
}
　　　　：

を削除するか、赤色行の先頭に "//" をつけてコメントアウトします。

　　　　：
function forgetMe (f) {
    deleteCookie('mtcmtmail', '/', '');
    deleteCookie('mtcmthome', '/', '');
    deleteCookie('mtcmtauth', '/', '');
//    f.email.value = '';
//    f.author.value = '';
//    f.url.value = '';
}
　　　　：

編集後、「保存と再構築」をクリックしてください。

Movable Type 4 のコメント投稿フォームの表示方法と、「匿名でコメントすることもできます。」の文言を変更するカスタマイズを紹介します。

１．コメント投稿フォームの違い

コメント投稿フォームの表示は、ブログ管理画面の「設定」→「ブログの設定」→「登録/認証」の「認証方式」（下）のチェック状態によりいくつかのパターンがあります。

１．１　認証方式で「認証なしコメント」のみ選択している場合

コメント投稿フォームはデフォルトで表示されます。

１．２　認証方式で「認証なしコメント」以外を選択している場合

コメント投稿フォームはデフォルトで非表示となります。

サインインすることでコメント投稿フォームが表示されます。認証されたので、「名前」および「電子メール」入力フィールドは表示されません。

１．３　認証方式で「認証なしコメント」と任意の認証方式を選択している場合

コメント投稿フォームはデフォルトで非表示となります。

サインインすることでコメント投稿フォームが表示されます。認証されたので、「名前」および「電子メール」入力フィールドは表示されません。

または「匿名でコメントすることもできます。」のリンクをクリックすればコメント投稿フォームが表示されます。

２．「匿名でコメントすることもできます。」の文言を修正する

「認証方式」の選択状態が１．３項の場合、コメント投稿フォームに「匿名でコメントすることもできます。」のリンクが表示されます。

たしかに名前欄を未記入で投稿することはできますが、このリンクの文言は、厳密には「認証なしでコメントすることもできます。」が正しいように思われます（その後で、さらに匿名投稿の選択の余地がある）。

ということで、この文言の変更方法です。

ブログ管理画面の「デザイン」→「テンプレート」で「インデックステンプレート」の一覧を表示し、テンプレート名の「JavaScript」をクリックします。

その中に

document.write('<a href="<$MTCGIPath$><$MTCommentScript$>?__mode=login&entry_id=' + entry_id + '&blog_id=' + blog_id + '&static=1">サインイン' + '</a>' + 'してからコメントしてください。 <a href="javascript:void(0);" onclick="showAnonymousForm();">匿名でコメントすることもできます。</a>');

という行がありますので、赤色部分を「認証なしでコメントすることもできます。」等に書き換えて、「保存と再構築」をクリックします。

修正後、下記のようになります。

３．コメントフォームを常に表示する

「認証方式」の選択状態が１．３項の場合でコメントフォームを常に表示するには、ブログ管理画面の「デザイン」→「テンプレート」で「インデックステンプレート」の一覧を表示し、テンプレート名の「JavaScript」をクリックします。

その中にある

function individualArchivesOnLoad(commenter_name) {
<MTIfCommentsAccepted>
<MTElse>
    hideDocumentElement('comments-open');
</MTIfCommentsAccepted>
<MTIfPingsAccepted>
<MTElse>
    hideDocumentElement('trackbacks-info');
</MTIfPingsAccepted>
<MTIfRegistrationAllowed>
    <MTIfRegistrationRequired>
    if ( commenter_name &&
         ( !commenter_id
        || commenter_blog_ids.indexOf("'<$MTBlogID$>'") > -1))
    {
        hideDocumentElement('comment-form-name');
        hideDocumentElement('comment-form-email');
        showDocumentElement('comments-open-text');
        showDocumentElement('comments-open-footer');
    } else {
        hideDocumentElement('comments-open-data');
        hideDocumentElement('comments-open-text');
        hideDocumentElement('comments-open-footer');
    }
    <MTElse>
    // comments are allowed but registration not required
    if ( commenter_name &&
         ( !commenter_id
        || commenter_blog_ids.indexOf("'<$MTBlogID$>'") > -1))
    {
        hideDocumentElement('comment-form-name');
        hideDocumentElement('comment-form-email');
    } else if (is_preview) {
        delayShowCaptcha();
    } else {
        hideDocumentElement('comments-form');
    }
    </MTIfRegistrationRequired>
</MTIfRegistrationAllowed>

の赤色部分を、下記のように行頭に "//" を付与して、コメントアウトします。

    } else {
//        hideDocumentElement('comments-form');
    }

CAPTCHA 認証を用いてる場合は、さらに CAPTCHA フィールド表示用の行を追加します。

    } else {
        captcha_timer = setInterval('delayShowCaptcha()', 1000);
//        hideDocumentElement('comments-form');
    }

上記の修正にあわせて、２項で示したテンプレートの「匿名でコメントすることもできます。」のリンク（下記の赤色部分）を削除、または(X)HTMLコメントアウトします。

document.write('<a href="<$MTCGIPath$><$MTCommentScript$>?__mode=login&entry_id=' + entry_id + '&blog_id=' + blog_id + '&static=1">サインイン' + '</a>' + 'してからコメントしてください。 <a href="javascript:void(0);" onclick="showAnonymousForm();">匿名でコメントすることもできます。</a>');

修正後、「保存と再構築」をクリックすれば、コメント投稿フォームは下記のようになります。

投稿フォームが表示されているのに、「サインインしてからコメントしてください。」という文言に違和感を感じる場合は、下記の赤色部分を変更すると良いでしょう。

document.write('<a href="<$MTCGIPath$><$MTCommentScript$>?__mode=login&entry_id=' + entry_id + '&blog_id=' + blog_id + '&static=1">サインイン' + '</a>' + 'してからコメントしてください。 <a href="javascript:void(0);" onclick="showAnonymousForm();">匿名でコメントすることもできます。</a>');

なお、コメントに「認証なしコメント」を適用する場合は、スパムを避けるため、CAPTCHA 機能を併用することをお勧めします。

2008.02.03
CAPTCHA 認証フィールドが表示されない不具合を修正しました。

Movable Type 4 では、元コメントに対する返信機能が新たに追加されましたが、デフォルトでは元コメントに返信できるのは管理画面から、つまり Movable Type ユーザのみです。

ブログ記事ページのコメントフォームから同様に返信できるようにするには、MT3 の時に紹介した、Simply Threaded プラグインが MT4 対応にバージョンアップされたので、これを利用します。

• Simply Threaded プラグイン
• 過去の紹介記事

本プラグインをインストールすることで、管理画面のコメント返信と同等の機能が追加され、さらに MT4 のコメント関連テンプレートタグでカスタマイズすれば、いわゆる掲示板のようなスレッド形式のコメント欄を表示することができます。

まず、プラグイン導入後のコメント返信方法から説明します。

１．コメント返信方法

返信したい元コメントに表示されている「返信」リンクをクリック。

クリックすると、コメント投稿画面にリプライのチェックボックス（「In reply to yujiro」の部分）が表示されます。
チェックボックスチェックした状態でコメント投稿すると、元コメントの返信コメントとして認識されます。

投稿後はスレッド形式で表示することができます。

コメント欄をスレッド表示にする方法は「Movable Type 4 で返信コメントをスレッド形式で表示する」の設定を利用しています。

以下、プラグインの設定方法です。

２．プラグインのダウンロード

Simply Threaded のサイトより、「download now」をクリック。

User Type（ここでは Personal bloggers を選択）、License の確認、Your Name、Email Adress を入力して「Submit」をクリック。

同じ画面の左下に「Success! Check your email for instructions on downloading this plugin」が表示されれば送信OKです。

入力したメールアドレスにダウンロード用のURLが送信されるので、そこにアクセスし、表示された画面で、Version（Movable Type 4.0x の方）、Format を選択して、Download をクリック。

商用利用または企業利用の場合は有償なので、ダウンロード後、「purchase license」をクリックして必要な金額を送金してください。

３．プラグインのインストール

ダウンロードしたアーカイブ Simply-Threaded_1.xx.zip（または tar.gz） を解凍し、SimplyThreaded フォルダを丸ごと plugins フォルダ配下にアップロード。SimplyThreaded フォルダは2つありますので注意してください。

アップロード後、下のような構成になっていればOKです。

plugins/
　SimplyThreaded/
  　lib/
    　SimplyThreaded/
      　CommentThread.pm
　　php/
     　function.MTCommentReplyField.php
　　　function.MTCommentReplyLink.php
　　simplythreaded.pl

管理画面にアクセスすると、「アップグレード開始」画面になるので、「アップグレード」をクリック。

サインインします。

アップグレード開始します。完了後「Movable Type に戻る」をクリック。

「システムメニュー」→「プラグイン」で「Simply Threaded 1.xx」が表示されていればインストール完了です。

４．テンプレート修正（コメント詳細）

管理画面より「デザイン」→「テンプレート」→「テンプレートモジュール」→「コメント詳細」を開き、リプライ用リンクの MTCommentReplyLink タグ（青色部分）を追加します。

デフォルトテンプレート

<div class="comment"<MTIfArchiveTypeEnabled archive_type="Individual"> id="comment-<$MTCommentID$>"</MTIfArchiveTypeEnabled>>
    <div class="inner">
        <div class="comment-header">
            <$MTCommentAuthorLink default_name="Anonymous" show_email="0"$> <MTIfNonEmpty tag="CommentAuthorIdentity"><$MTCommentAuthorIdentity$></MTIfNonEmpty>:
        </div>
        <div class="comment-content">
            <$MTCommentBody$>
        </div>
        <div class="comment-footer">
            <a href="#comment-<$MTCommentID$>" title="コメントのURL"><$MTCommentDate format="%x %X"$></a> | <$MTCommentReplyLink$>
        </div>
    </div>
</div>

公開テンプレート

<div class="comment"<MTIfArchiveTypeEnabled archive_type="Individual"> id="c<$MTCommentID$>"</MTIfArchiveTypeEnabled>>
 
   <div class="comment-content"><$MTCommentBody$></div>
 
   <p class="comment-footer">
      Posted by <$MTCommentAuthorLink default_name="Anonymous" show_email="0"$> <MTIfNonEmpty tag="CommentAuthorIdentity"><$MTCommentAuthorIdentity$></MTIfNonEmpty> at <$MTCommentDate$> | <$MTCommentReplyLink$>
   </p>
</div>

MTCommentReplyLink タグにはオプションで text 属性が用意されています。これで表示テキストを変更できます。

<MTCommentReplyLink text="Reply to this comment">

５．テンプレート修正（コメント入力フォーム）

管理画面より「デザイン」→「テンプレート」→「テンプレートモジュール」→「コメント入力フォーム」を開き、チェックボックス表示用の MTCommentReplyField タグ（青色）を追加します。

デフォルトテンプレート

　　　　　：
<div id="comment-form-remember-me">
    <label for="comment-bake-cookie"><input type="checkbox" id="comment-bake-cookie" name="bakecookie" onclick="if (!this.checked) forgetMe(document.comments_form)" value="1" />
        ログイン情報を記憶</label>
</div>
<$MTCommentReplyField$>
　　　　　：

公開テンプレート

　　　　　：
<div id="comment-form-remember-me">
   <p>
      <label for="comment-bake-cookie"><input type="checkbox" id="comment-bake-cookie" name="bakecookie" tabindex="4" accesskey="r" onclick="if (!this.checked) forgetMe(document.comments_form)" value="1" onkeypress="if (!this.checked) forgetMe(document.comments_form)" />
      ログイン情報を記憶</label>
   </p>
</div>
<$MTCommentReplyField$>
　　　　　：

ちなみに MTCommentReplyField タグは、(X)HTML上は下のように展開されます。

<script type="text/javascript">
<!--
function replyComment(entry_id, parent_id, author, created_on) {
    var p = document.getElementById(entry_id + '_comment-reply');
    while (p.hasChildNodes()) {
        p.removeChild(p.firstChild);
    }
 
    var label = document.createElement('label');
    var checkbox = document.createElement('input');
    checkbox.setAttribute('type', 'checkbox');
    checkbox.setAttribute('name', 'simplythreaded_parent_id');
    checkbox.value = parent_id; 
    checkbox.setAttribute('checked', true);
    checkbox.style.marginLeft = '0px';
    checkbox.style.verticalAlign = 'middle'; 
    label.appendChild(checkbox);
 
    var reply_text = document.createTextNode(' In reply to ');
    label.appendChild(reply_text);
 
    var anchor = document.createElement('a');
    anchor.setAttribute('href', '#comment-' + parent_id);
    anchor.innerHTML = author;
    label.appendChild(anchor);
 
    p.appendChild(label);
    checkbox.focus();
}
//-->
</script>
 
<p id="2_comment-reply"></p>

６．関連リンク

下記に、プラグイン適用時のブログ記事ページを valid にする方法が掲載されています。

• WolaWola：コメント返信機能を使い倒す：Simply Threadedプラグイン

Movable Type 4 ではコメント返信関連のタグ

• MTIfCommentParent
• MTIfCommentReplies
• MTCommentParent
• MTCommentReplies
• MTCommentRepliesRecurse

が追加されており、サブカテゴリーリストのように、返信コメントを元コメントに関連づけ、スレッド形式で表示することができます。

１．サンプル

下はコメント返信関連タグを用いた、デフォルトテンプレートのコメントリストのカスタマイズ例です。コメント本文の数字はコメントの返信関係を示しており、変更後は投稿時間に関わらず、返信コメントが元コメントに関連づけされます。

変更前	変更後

デフォルトテンプレート、および公開テンプレート用のテンプレートおよび CSS を作ってみましたので、よろしければお試しください。

２．テンプレート

2007.10.04 テンプレート・CSSについて、コメントに順序なしリストが投稿された場合を考慮した内容に修正しました。

管理画面より「デザイン」→「テンプレート」→「テンプレートモジュール」→「コメント」を選択して、テキストエリアの内容を、下記の内容にごっそり入れ替えてください。

テンプレートを初期化したい場合は、テンプレート名左のチェックボックスをチェックして、一覧上にあるセレクトボックスより「テンプレートの初期化」を選択して「Go」をクリックします（途中で一旦入れ替えたテンプレートについてはこの機能では復活できないのでご注意ください）。

２．１ デフォルトテンプレート用

<MTIfCommentsActive>
<div id="comments" class="comments">
    <MTIf name="comment_preview_template">
    <$MTInclude module="コメント入力フォーム"$>
    </MTIf>
    <MTComments>
        <MTCommentsHeader>
    <h2 class="comments-header">コメント(<$MTEntryCommentCount$>)</h2>
    <div class="comments-content">
        <ul class="comment-replies">
        </MTCommentsHeader>
        <MTIfCommentParent>
        <MTElse>
            <li class="comment-replies-content">
<$MTInclude module="コメント詳細"$>
            <MTCommentReplies>
                <MTCommentsHeader>
                <ul class="comment-replies">
                </MTCommentsHeader>
                    <li class="comment-replies-content">
<$MTInclude module="コメント詳細"$>
                <$MTCommentRepliesRecurse$>
                    </li>
                <MTCommentsFooter>
                </ul>
                </MTCommentsFooter>
            </MTCommentReplies>
            </li>
        </MTIfCommentParent>
        <MTCommentsFooter>
        </ul>
    </div>
        </MTCommentsFooter>
    </MTComments>
    <MTUnless name="comment_preview_template">
    <$MTInclude module="コメント入力フォーム"$>
    </MTUnless>
</div>
</MTIfCommentsActive>

２．２ 公開テンプレート用

<MTIfCommentsActive>
<div id="comments">
 
   <MTIf name="comment_preview_template">
   <$MTInclude module="コメント入力フォーム"$>
   </MTIf>
 
   <MTComments>
 
   <MTCommentsHeader><h3 class="comments-header">コメント</h3><ul class="comment-replies"></MTCommentsHeader>
        <MTIfCommentParent>
        <MTElse>
            <li class="comment-replies-content">
<$MTInclude module="コメント詳細"$>
            <MTCommentReplies>
                <MTCommentsHeader>
                <ul class="comment-replies">
                </MTCommentsHeader>
                    <li class="comment-replies-content">
<$MTInclude module="コメント詳細"$>
                <$MTCommentRepliesRecurse$>
                    </li>
                <MTCommentsFooter>
                </ul>
                </MTCommentsFooter>
            </MTCommentReplies>
            </li>
        </MTIfCommentParent>
   <MTCommentsFooter></ul></MTCommentsFooter>
   </MTComments>
 
   <MTUnless name="comment_preview_template">
   <$MTInclude module="コメント入力フォーム"$>
   </MTUnless>
 
</div>
</MTIfCommentsActive>

３．CSS

入れ替えたコメント用テンプレートは、各コメントを順序なしリスト（ul/li）でマークアップしているので、リストマークの無効化やインデント幅を設定します。

管理画面より「デザイン」→「テンプレート」→「スタイルシート（メイン）」を選択して、テキストエリアに下記の内容を追加してください。デフォルトテンプレートの場合は「スタイルシート（ベーステーマ）」でも結構です。

３．１ デフォルトテンプレート（罫線なし）

.comments-content ul.comment-replies {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}
.comments-content ul.comment-replies ul.comment-replies {
    border-left: 1px solid #999;
}
.comments-content li.comment-replies-content li.comment-replies-content {
    margin-left: 10px;
    padding-left: 10px;
}

完成例

３．２ デフォルトテンプレート（罫線つき）

.comments-content ul.comment-replies {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}
.comments-content ul.comment-replies ul.comment-replies {
    border-left: 1px solid #999;
}
.comments-content li.comment-replies-content li.comment-replies-content {
    margin-left: 8px;
    padding-left: 8px;
}

完成例

３．３ 公開テンプレート（罫線なし）

#comments ul.comment-replies {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}
#comments li.comment-replies-content li.comment-replies-content {
    margin-left: 10px;
    padding-left: 10px;
}

完成例

３．４ 公開テンプレート（罫線つき）

#comments ul.comment-replies {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}
#comments ul.comment-replies ul.comment-replies {
    border-left: 1px solid #999;
}
#comments li.comment-replies-content li.comment-replies-content {
    margin-left: 7px;
    padding-left: 7px;
}

完成例

４．関連記事

• 技術情報提供ブログ：コメントの返信も簡単に表示も解りやすく

Movable Type 3 から Movable 4 へアップグレードした場合、MT4 で新しく追加・変更されたコメント関連のMTタグは反映されません。

ということで机上での確認ですが、MT4 の機能を利用する場合のテンプレートの差分を示します。

なお本エントリーの反映を行う場合、インデックステンプレートの mt.js（MT3 の mt-site.js の後継） の利用が前提となりますが、アップグレードでは mt.js がインデックステンプレートに生成されません。

mt.js を取得するには、新しいブログをひとつ作成し（再構築はしない）、そこからインデックステンプレートにある「JavaScript（mt.js）」の内容をコピーし、元ブログのインデックステンプレートに新しいテンプレートとして追加してください（他に良い方法があればご教示ください）。

また、mt-site,js を読み込んでいる script 要素も適宜 mt.js を読み込むように変更してください。

以下、エントリー・アーカイブテンプレートとコメント・プレビューテンプレートのMT3/MT4の差分です。

１．認証表示用JavaScript

MT3 まで TypeKey 認証のみでしたが、MT4 から Movable Type/OpenID/LiveJournal/Vox/TypeKey と複数認証に対応するようになったので、TypeKey 認証表示用の JavaScript をそれに対応したものに変更してください。
また、コメントプレビューテンプレートには is_preview = true; を追加してください。

MT3

<script type="text/javascript">
writeTypeKeyGreeting(commenter_name, <$MTEntryID$>);
</script>

MT4

<MTIfRegistrationAllowed>
    <div id="comment-form-external-auth">
        <script type="text/javascript">
        <!--
        writeCommenterGreeting(commenter_name, <$MTEntryID$>, <$MTEntryBlogID$>, commenter_id, commenter_url);
        //-->
        </script>
    </div>
</MTIfRegistrationAllowed>

MT4（コメントプレビュー）

<MTIfRegistrationAllowed>
    <div id="comment-form-external-auth">
        <script type="text/javascript">
        <!--
        is_preview = true;
        writeCommenterGreeting(commenter_name, <$MTEntryID$>, <$MTEntryBlogID$>, commenter_id, commenter_url);
        //-->
        </script>
    </div>
</MTIfRegistrationAllowed>

注：この JavaScript は MT3 では form 要素の中にありましたが、MT4 では form 要素の直前に移動してください。

理由は、MT4 ではコメントフォームがデフォルトで非表示になり、認証コメントの場合はサインインすることによってコメントフォームが表示されます。

またブログ管理画面の「設定」→「登録・認証」で「認証なしコメント」をチェックすれば認証なしのコメントも可能ですが、その際はコメントフォームの代わりに「匿名でコメントすることもできます。 」というリンクが表示され（下）、それをクリックすればコメントフォームが表示されます。

この JavaScript では、インデックステンプレートの JavaScript（mt.js）の生成条件にしたがって、そういった制御を行っています。

２．form 要素

コメントフォームの form 要素の id 属性 comments-form を追加してください。
また input 要素をひとつ追加してください。

MT3

<form method="post" action="<$MTCGIPath$><$MTCommentScript$>" name="comments_form" onsubmit="if (this.bakecookie.checked) rememberMe(this)">
<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$MTEntryID$>" />

MT4

<form method="post" action="<$MTCGIPath$><$MTCommentScript$>" name="comments_form" id="comments-form" onsubmit="if (this.bakecookie.checked) rememberMe(this)">
<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$MTEntryID$>" />
<input type="hidden" name="__lang" value="<$MTBlogLanguage$>" />

３．コメントフォーム

(X)HTMLが変更されています。MT3 までは「名前」と「メールアドレス」を div 要素で括り、TypeKey サインインの場合に id 属性 name-email を狙って非表示にしていましたが、
MT4では「名前」と「メールアドレス」に与えられた id 属性 comment-form-name と comment-form-email で表示・非表示を切り替えています。

MT3

<div id="comments-open-data">
   <div id="name-email">
      <p>
         <label for="comment-author">名前:</label>
         <input id="comment-author" name="author" size="30" />
      </p>
      <p>
         <label for="comment-email">メールアドレス:</label>
         <input id="comment-email" name="email" size="30" />
      </p>
   </div>
 
   <p>
      <label for="comment-url">URL:</label>
      <input id="comment-url" name="url" size="30" />
   </p>
   <p>
      <label for="comment-bake-cookie"><input type="checkbox"
         id="comment-bake-cookie" name="bakecookie" onclick="if (!this.checked) forgetMe(document.comments_form)" value="1" />
         この情報を登録しますか?</label>
   </p>
</div>

MT4

<div id="comments-open-data">
    <div id="comment-form-name">
        <label for="comment-author">名前</label>
        <input id="comment-author" name="author" size="30" />
    </div>
    <div id="comment-form-email">
        <label for="comment-email">メールアドレス</label>
        <input id="comment-email" name="email" size="30" />
    </div>
    <div id="comment-form-url">
        <label for="comment-url">URL</label>
        <input id="comment-url" name="url" size="30" />
    </div>
    <div id="comment-form-remember-me">
        <label for="comment-bake-cookie"><input type="checkbox" id="comment-bake-cookie" name="bakecookie" onclick="if (!this.checked) forgetMe(document.comments_form)" value="1" />
            ログイン情報を記憶</label>
    </div>
</div>

MT4（コメントプレビュー）

<div id="comments-open-data">
    <div id="comment-form-name">
        <label for="comment-author">名前</label>
        <input id="comment-author" name="author" size="30" value="<$MTCommentAuthor encode_html="1"$>" />
    </div>
    <div id="comment-form-email">
        <label for="comment-email">メールアドレス</label>
        <input id="comment-email" name="email" size="30" value="<$MTCommentEmail encode_html="1"$>" />
    </div>
    <div id="comment-form-url">
        <label for="comment-url">URL</label>
        <input id="comment-url" name="url" size="30" value="<$MTCommentURL encode_html="1"$>" />
    </div>
    <div id="comment-form-remember-me">
        <label for="comment-bake-cookie"><input type="checkbox" id="comment-bake-cookie" name="bakecookie" onclick="if (!this.checked) forgetMe(document.comments_form)" value="1" />
            ログイン情報を記憶</label>
    </div>
</div>

４．CAPTCHA 入力フィールド

MT4 で追加された CAPTCHA の入力フィールドを表示する場合は下記の青色部分を追加してください。
この設定とは別に、ブログ管理画面の「設定」→「コメント」で、CAPTCHA プロバイダの設定が必要です。

　　　　　：
<p id="comments-open-text">
   <label for="comment-text">コメント: <MTIfAllowCommentHTML>(スタイル用のHTMLタグが使えます)</MTIfAllowCommentHTML></label>
   <textarea id="comment-text" name="text" rows="15" cols="50"></textarea>
</p>
<MTIfNonEmpty tag="MTCaptchaFields">
<MTIfCommentsAccepted><MTIfRegistrationAllowed><MTElse><$MTCaptchaFields$></MTIfRegistrationAllowed></MTIfCommentsAccepted>
<div id="comments-open-captcha">
</div>
</MTIfNonEmpty>
<div id="comments-open-footer" class="comments-open-footer">
　　　　　：

５．表示・非表示で使われる id 属性

下の5つの id 属性値は mt.js で参照されるものです。変更しないようにしましょう。

comment-form-name
comment-form-email
comments-open-data
comments-open-text
comments-open-footer;

Movable Type でコメント投稿者名が空白の時、「最近のコメント」の投稿者名に[匿名]等の表示を行うカスタマイズです。
エントリー・アーカイブのコメント欄はこのような設定になっているのですが、「最近のコメント」でこの設定が欠落しておりました。

下は公開テンプレートの設定例です。青色の default 属性を追加してください。

<!-- 最近のコメント開始 -->
<dt class="sidetitle">
Recent Comments
</dt>
 
<MTIfNonZero tag="BlogCommentCount">
<dd class="side">
<ul>
<MTEntries lastn="5" recently_commented_on="5">
<li><a href="<$MTEntryLink$>"><MTEntryTitle></a><ul>
<MTComments lastn="5">
<li>└ <a href="<$MTEntryLink$>#c<$MTCommentID$>" title="c<$MTCommentID$>"><MTCommentAuthor default="[匿名]"></a> <$MTCommentDate format="%m/%d"$></li>
</MTComments>
</ul>
</li>
</MTEntries>
</ul>
</dd>
</MTIfNonZero>
<!-- 最近のコメント終了 -->
</dl>

属性値に記述された文字列が実際に表示される部分ですので、Anonymous 等、お好みの文字列を設定してください。

なお、MTCollate をご利用で、空の投稿者名の時に何も表示されない場合は、「MTCollate を使って「最近のコメント」を表示する」のを参照してください。

ちなみに、

<MTCollateSetField name="comment_author"><$MTCommentAuthor encode_html="1" default="Anonymous"$></MTCollateSetField>

という具合にします。

Movable Type のデフォルトテンプレートや公開テンプレートのエントリー・アーカイブでは、コメントリストは過去のコメントから順番に表示されるようになっています。「新着順にコメント表示するにはどうすれば良いですか」というご質問を頂きましたので、本エントリーにてご紹介します。

変更方法は簡単で、管理メニューの「設定」→「基本」→「コメントの表示順」を「降順」にして保存・再構築します。 または、エントリー・アーカイブ（およびコメント・プレビュー）テンプレートの編集画面で MTComments タグに対し、下記のように sort_order 属性を追加します。

<MTComments sort_order="descend">

変更時の注意点としては、コメント投稿フォームをコメントリストの前、つまり新着コメント側へ移動した方がサイト管理者はコメントの返事を書きやすいと思います。
また、MTタグを修正する場合、コメント・プレビューでもコメントリストを表示しているのであれば、エントリー・アーカイブと表示順序を統一するようにしましょう。

レンタルサーバに perl モジュールをインストールする方法を紹介します。

レンタルサーバでは Ogawa::memoranda さんの Captcha プラグインの動作に必要な Authen::Captcha モジュールがインストールされていないケースが少なくないようです（GD はインストールされているという前提）。またネットを検索してみても、一般的な perl モジュールのインストール方法は記されているのですが、そこに Authen::Captcha のインストールについて記されている訳ではないのでお互いの情報が結びつかず、perl に精通していない方が検索エンジンから方法を探し出すのは困難なようです。

ということで、Windows マシンからレンタルサーバにログインして、perl モジュール Authen::Captcha をインストールする方法、およびプラグインの修正について記します。私が実施したのは「さくらインターネット」です。
なおレンタルサーバで telnet/SSH がサポートされていない場合は Perl モジュールをインストールすることはできませんのでご注意ください（Movable Type向きのレンタルサーバー比較等で telnet/ssh のサポート状況が分かります）。

１．UTF-8 TeraTerm Pro with TTSSH2 のインストール

レンタルサーバをお使いの方は FFFTP 等の ftp ツールはよくご存知と思いますが、Perl もジュールをインストールするためには telnet または ssh でサーバと通信するためのツールが必要です。

ここでは TeraTerm Pro を利用します。窓の社にある UTF-8 TeraTerm Pro with TTSSH2 をダウンロードしてインストールしてください。

２．サーバにログイン

サーバにログインします。インストールした Teraterm を起動して、表示されたダイアログで下記の設定をしてください。

• TCP/IP:ここを選択
• Host: サーバのホスト名（ftp のホスト名と同じ）
• Service: Telnet/SSH（SSH1 or SSH2）のいずれかを選択（接続するプロトコルはレンタルサーバに確認してください）
• 他はデフォルトのまま

接続OKであれば、ダイアログが閉じてメイン画面で次のようなプロンプトが表示されます。

login:

ここでは ftp のユーザ名を入力します。OKであれば

Password:

と表示されますので、ftp のパスワードを入力します。入力したパスワードは画面に表示されませんが、焦らずにそのまま入力してください。

OKであれば

Last login: Tue Jun 13 23:39:27 from xxx.xxx.xxx.xxx
Copyright (c) 1980, 1983, 1986, 1988, 1990, 1991, 1993, 1994
　　　　The Regents of the University of California.  All rights reserved.
 
FreeBSD 4.10-RELEASE-p19 (xxxxxxx) #x: Sun Nov 27 11:46:21 JST 2005
 
// Sakura internet rental server service
 
%

というようなログイン成功画面が表示されます（表示画面はレンタルサーバによって異なります）。

この状態で

%ls -l

と入力すると、既に存在するファイルがいくつか表示されると思います。

３．perl ディレクトリの作成

レンタルサーバ側で用意してくれている Perl モジュールは、我々が書き込める権限のないディレクトリに配置されていますので、個人環境に Perl モジュールをインストールするためのディレクトリを作成します。

下記のコマンドを入力して perl というディレクトリを作成します。

%mkdir perl

４．perl モジュールインストールの前準備

• CPAN を使い Perl モジュールをインストールする
• perl モジュール
• Perlメモ/モジュールのインストール(CPAN)

それではまず、３項の画面で以下のコマンドを入力してください。

%perl -MCPAN -e shell

このコマンドを初めて起動した場合、以下のようなメッセージが表示されます。

/home/hogehoge/.cpan/CPAN/MyConfig.pm initialized.
 
 
CPAN is the world-wide archive of perl resources. It consists of about
100 sites that all replicate the same contents all around the globe.
Many countries have at least one CPAN site already. The resources
found on CPAN are easily accessible with the CPAN.pm module. If you
want to use CPAN.pm, you have to configure it properly.
 
If you do not want to enter a dialog now, you can answer 'no' to this
question and I'll try to autoconfigure. (Note: you can revisit this
dialog anytime later by typing 'o conf init' at the cpan prompt.)
 
Are you ready for manual configuration? [yes]

ここでリターンを1回だけ入力します。入力すると次の質問が表示されます。これと同じ要領で、表示された質問に対して回答するという対話形式で作業を進めていきます。

以下、この作業で表示されるメッセージをまとめて掲載します。質問部分は赤色、入力部分は青色で示しています。青色の入力がない行はそのままリターンを入力してください。リターンのみの場合は、[]の中に書かれている内容が設定値として反映されます（上記のメッセージの場合は yes が入力されたものと解釈されます）。

The following questions are intended to help you with the
configuration. The CPAN module needs a directory of its own to cache
important index files and maybe keep a temporary mirror of CPAN files.
This may be a site-wide directory or a personal directory.
 
 
 
I see you already have a  directory
　　/home/hogehoge/.cpan
Shall we use it as the general CPAN build and cache directory?
 
CPAN build and cache directory? [/home/hogehoge/.cpan]
 
 
If you want, I can keep the source files after a build in the cpan
home directory. If you choose so then future builds will take the
files from there. If you don't want to keep them, answer 0 to the
next question.
 
 
 
How big should the disk cache be for keeping the build directories
with all the intermediate files?
 
Cache size for build directory (in MB)? [10]
 
 
By default, each time the CPAN module is started, cache scanning
is performed to keep the cache size in sync. To prevent from this,
disable the cache scanning with 'never'.
 
Perform cache scanning (atstart or never)? [atstart]
 
 
To considerably speed up the initial CPAN shell startup, it is
possible to use Storable to create a cache of metadata. If Storable
is not available, the normal index mechanism will be used.
 
Cache metadata (yes/no)? [yes]
 
 
The next option deals with the charset your terminal supports. In
general CPAN is English speaking territory, thus the charset does not
matter much, but some of the aliens out there who upload their
software to CPAN bear names that are outside the ASCII range. If your
terminal supports UTF-8, you say no to the next question, if it
supports ISO-8859-1 (also known as LATIN1) then you say yes, and if it
supports neither nor, your answer does not matter, you will not be
able to read the names of some authors anyway. If you answer no, names
will be output in UTF-8.
 
Your terminal expects ISO-8859-1 (yes/no)? [yes]
 
 
If you have one of the readline packages (Term::ReadLine::Perl,
Term::ReadLine::Gnu, possibly others) installed, the interactive CPAN
shell will have history support. The next two questions deal with the
filename of the history file and with its size. If you do not want to
set this variable, please hit SPACE RETURN to the following question.
 
File to save your history? [/home/hogehoge/.cpan/histfile]
Number of lines to save? [100]
 
 
The CPAN module can detect when a module that which you are trying to
build depends on prerequisites. If this happens, it can build the
prerequisites for you automatically ('follow'), ask you for
confirmation ('ask'), or just ignore them ('ignore'). Please set your
policy to one of the three values.
 
Policy on building prerequisites (follow, ask or ignore)? [ask]
 
 
The CPAN module will need a few external programs to work properly.
Please correct me, if I guess the wrong path for a program. Don't
panic if you do not have some of them, just press ENTER for those. To
disable the use of a download program, you can type a space followed
by ENTER.
 
Where is your gzip program? [/usr/bin/gzip]
Where is your tar program? [/usr/bin/tar]
Where is your unzip program? [/usr/local/bin/unzip]
Where is your make program? [/usr/bin/make]
Where is your lynx program? [/usr/local/bin/lynx]
Where is your wget program? [/usr/local/bin/wget]
Warning: ncftpget not found in PATH
Where is your ncftpget program? []
Warning: ncftp not found in PATH
Where is your ncftp program? []
Where is your ftp program? [/usr/bin/ftp]
Warning: gpg not found in PATH
Where is your gpg program? []
What is your favorite pager program? [more]
What is your favorite shell? [/bin/csh]
 
 
Every Makefile.PL is run by perl in a separate process. Likewise we
run 'make' and 'make install' in processes. If you have any
parameters (e.g. PREFIX, LIB, UNINST or the like) you want to pass
to the calls, please specify them here.
 
If you don't understand this question, just press ENTER.
 
Parameters for the 'perl Makefile.PL' command?
Typical frequently used settings:
 
　　PREFIX=~/perl　　　 non-root users (please see manual for more hints)
 
Your choice:  []
Parameters for the 'make' command?
Typical frequently used setting:
 
　　-j3　　　　　　　dual processor system
 
Your choice:  []
Parameters for the 'make install' command?
Typical frequently used setting:
 
　　UNINST=1　　　　 to always uninstall potentially conflicting files
 
Your choice:  []
 
 
Sometimes you may wish to leave the processes run by CPAN alone
without caring about them. As sometimes the Makefile.PL contains
question you're expected to answer, you can set a timer that will
kill a 'perl Makefile.PL' process after the specified time in seconds.
 
If you set this value to 0, these processes will wait forever. This is
the default and recommended setting.
 
Timeout for inactivity during Makefile.PL? [0]
 
 
If you're accessing the net via proxies, you can specify them in the
CPAN configuration or via environment variables. The variable in
the $CPAN::Config takes precedence.
 
Your ftp_proxy?
Your http_proxy?
Your no_proxy?
You have no /home/hogehoge/.cpan/sources/MIRRORED.BY
  I'm trying to fetch one
CPAN: LWP::UserAgent loaded ok
Fetching with LWP:
　ftp://ftp.perl.org/pub/CPAN/MIRRORED.BY
 
 
Now we need to know where your favorite CPAN sites are located. Push
a few sites onto the array (just in case the first on the array won't
work). If you are mirroring CPAN to your local workstation, specify a
file: URL.
 
First, pick a nearby continent and country (you can pick several of
each, separated by spaces, or none if you just want to keep your
existing selections). Then, you will be presented with a list of URLs
of CPAN mirrors in the countries you selected, along with previously
selected URLs. Select some of those URLs, or just keep the old list.
Finally, you will be prompted for any extra URLs -- file:, ftp:, or
http: -- that host a CPAN mirror.
 
(1) Africa
(2) Asia
(3) Central America
(4) Europe
(5) North America
(6) Oceania
(7) South America
Select your continent (or several nearby continents) [] 2
Sorry! since you don't have any existing picks, you must make a
geographic selection.
 
(1) China
(2) Hong Kong
(3) India
(4) Indonesia
(5) Iran
(6) Israel
(7) Japan
(8) Malaysia
(9) Philippines
(10) Republic of Korea
(11) Russian Federation
(12) Saudi Arabia
(13) Singapore
(14) Taiwan
(15) Thailand
(16) Turkey
Select your country (or several nearby countries) [] 7
Sorry! since you don't have any existing picks, you must make a
geographic selection.
 
(1) ftp://ftp.dti.ad.jp/pub/lang/CPAN/
(2) ftp://ftp.jaist.ac.jp/pub/lang/perl/CPAN/
(3) ftp://ftp.kddilabs.jp/CPAN/
(4) ftp://ftp.nara.wide.ad.jp/pub/CPAN/
(5) ftp://ftp.ring.gr.jp/pub/lang/perl/CPAN/
(6) ftp://ftp.u-aizu.ac.jp/pub/CPAN
(7) ftp://ftp.yz.yamagata-u.ac.jp/pub/lang/cpan/
(8) http://ftp.cpan.jp/
Select as many URLs as you like (by number),
put them on one line, separated by blanks, e.g. '1 4 5' [] 1 2 3 4 5 6 7 8 注：すべて選択する必要はありません
 
Enter another URL or RETURN to quit: []
New set of picks:
  ftp://ftp.dti.ad.jp/pub/lang/CPAN/
  ftp://ftp.jaist.ac.jp/pub/lang/perl/CPAN/
  ftp://ftp.kddilabs.jp/CPAN/
  ftp://ftp.nara.wide.ad.jp/pub/CPAN/
  ftp://ftp.ring.gr.jp/pub/lang/perl/CPAN/
  ftp://ftp.u-aizu.ac.jp/pub/CPAN
  ftp://ftp.yz.yamagata-u.ac.jp/pub/lang/cpan/
  http://ftp.cpan.jp/
 
 
commit: wrote /home/hogehoge/.cpan/CPAN/MyConfig.pm
Terminal does not support AddHistory.
 
cpan shell -- CPAN exploration and modules installation (v1.7601)
ReadLine support available (try 'install Bundle::CPAN')
 
cpan>

お疲れ様でした。最後に「cpan>」という入力要求（プロンプト）が出ますので、ここではとりあえず "q" を入力して一旦終了します。

cpan> q
Terminal does not support GetHistory.
Lockfile removed.

再度、最初の perl コマンドを入力します。

%perl -MCPAN -e shell
Terminal does not support AddHistory.
 
cpan shell -- CPAN exploration and modules installation (v1.7601)
ReadLine support available (try 'install Bundle::CPAN')
 
cpan>

ここで、３項で作ったディレクトリに perl モジュールがインストールできるようにするためにコマンドを入力します。

cpan> o conf makepl_arg "LIB=~/perl/lib PREFIX=~/perl/lib INSTALLMAN1DIR=~/perl/man/man1 INSTALLMAN3DIR=~/perl/man/man3"
    makepl_arg         LIB=~/perl/lib PREFIX=~/perl/lib INSTALLMAN1DIR=~/perl/man/man1 INSTALLMAN3DIR=~/perl/man/man3

上記は、さくらインターネットのFAQの内容（それはCPANのドキュメントに基づいています）をそのまま入力しています。ちなみにさくらインターネットのFAQでは４項の作業が記されていません。

そして上記の設定を今後も有効にするために以下のコマンドを入力します。

cpan> o conf commit
commit: wrote /home/hogehoge/.cpan/CPAN/MyConfig.pm

これで perl モジュールをインストールできる準備ができました。

５．perl モジュールのインストール

次のコマンドを入力して、Authen::Captcha をインストールしましょう。

cpan>install Authen::Captcha

私がインストールした時のログは下記です。
正常であればここでかなり長大なログが表示されると思います。

cpan> install Authen::Captcha
CPAN: Storable loaded ok
CPAN: LWP::UserAgent loaded ok
Fetching with LWP:
  ftp://ftp.dti.ad.jp/pub/lang/CPAN/authors/01mailrc.txt.gz
Going to read /home/hogehoge/.cpan/sources/authors/01mailrc.txt.gz
CPAN: Compress::Zlib loaded ok
Fetching with LWP:
  ftp://ftp.dti.ad.jp/pub/lang/CPAN/modules/02packages.details.txt.gz
Going to read /home/hogehoge/.cpan/sources/modules/02packages.details.txt.gz
  Database was generated on Thu, 11 Jan 2007 06:26:25 GMT
 
  There's a new CPAN.pm version (v1.8802) available!
  [Current version is v1.7602]
  You might want to try
    install Bundle::CPAN
    reload cpan
  without quitting the current session. It should be a seamless upgrade
  while we are running...
 
Fetching with LWP:
  ftp://ftp.dti.ad.jp/pub/lang/CPAN/modules/03modlist.data.gz
Going to read /home/hogehoge/.cpan/sources/modules/03modlist.data.gz
Going to write /home/hogehoge/.cpan/Metadata
Running install for module Authen::Captcha
Running make for U/UN/UNRTST/Authen-Captcha-1.023.tar.gz
Fetching with LWP:
  ftp://ftp.dti.ad.jp/pub/lang/CPAN/authors/id/U/UN/UNRTST/Authen-Captcha-1.023.tar.gz
CPAN: Digest::MD5 loaded ok
Fetching with LWP:
  ftp://ftp.dti.ad.jp/pub/lang/CPAN/authors/id/U/UN/UNRTST/CHECKSUMS
Checksum for /home/hogehoge/.cpan/sources/authors/id/U/UN/UNRTST/Authen-Captcha-1.023.tar.gz ok
Scanning cache /home/hogehoge/.cpan/build for sizes
x Authen-Captcha-1.023/
x Authen-Captcha-1.023/Captcha/
x Authen-Captcha-1.023/Captcha/images/
x Authen-Captcha-1.023/Captcha/images/w.png
x Authen-Captcha-1.023/Captcha/images/background4.png
x Authen-Captcha-1.023/Captcha/images/8.png
x Authen-Captcha-1.023/Captcha/images/k.png
x Authen-Captcha-1.023/Captcha/images/x.png
x Authen-Captcha-1.023/Captcha/images/background5.png
x Authen-Captcha-1.023/Captcha/images/9.png
x Authen-Captcha-1.023/Captcha/images/l.png
x Authen-Captcha-1.023/Captcha/images/y.png
x Authen-Captcha-1.023/Captcha/images/m.png
x Authen-Captcha-1.023/Captcha/images/z.png
x Authen-Captcha-1.023/Captcha/images/a.png
x Authen-Captcha-1.023/Captcha/images/n.png
x Authen-Captcha-1.023/Captcha/images/b.png
x Authen-Captcha-1.023/Captcha/images/o.png
x Authen-Captcha-1.023/Captcha/images/c.png
x Authen-Captcha-1.023/Captcha/images/p.png
x Authen-Captcha-1.023/Captcha/images/d.png
x Authen-Captcha-1.023/Captcha/images/q.png
x Authen-Captcha-1.023/Captcha/images/2.png
x Authen-Captcha-1.023/Captcha/images/e.png
x Authen-Captcha-1.023/Captcha/images/r.png
x Authen-Captcha-1.023/Captcha/images/3.png
x Authen-Captcha-1.023/Captcha/images/f.png
x Authen-Captcha-1.023/Captcha/images/s.png
x Authen-Captcha-1.023/Captcha/images/Thumbs.db
x Authen-Captcha-1.023/Captcha/images/4.png
x Authen-Captcha-1.023/Captcha/images/g.png
x Authen-Captcha-1.023/Captcha/images/t.png
x Authen-Captcha-1.023/Captcha/images/background1.png
x Authen-Captcha-1.023/Captcha/images/5.png
x Authen-Captcha-1.023/Captcha/images/h.png
x Authen-Captcha-1.023/Captcha/images/u.png
x Authen-Captcha-1.023/Captcha/images/CVS/
x Authen-Captcha-1.023/Captcha/images/CVS/Root
x Authen-Captcha-1.023/Captcha/images/CVS/Repository
x Authen-Captcha-1.023/Captcha/images/CVS/Entries
x Authen-Captcha-1.023/Captcha/images/background2.png
x Authen-Captcha-1.023/Captcha/images/6.png
x Authen-Captcha-1.023/Captcha/images/i.png
x Authen-Captcha-1.023/Captcha/images/v.png
x Authen-Captcha-1.023/Captcha/images/background3.png
x Authen-Captcha-1.023/Captcha/images/7.png
x Authen-Captcha-1.023/Captcha/images/j.png
x Authen-Captcha-1.023/MANIFEST
x Authen-Captcha-1.023/Captcha.pm
x Authen-Captcha-1.023/Changes
x Authen-Captcha-1.023/t/
x Authen-Captcha-1.023/t/1.t
x Authen-Captcha-1.023/README
x Authen-Captcha-1.023/examples/
x Authen-Captcha-1.023/examples/wwwtest.cgi
x Authen-Captcha-1.023/examples/README
x Authen-Captcha-1.023/license.txt
x Authen-Captcha-1.023/Makefile.PL
 
  CPAN.pm: Going to build U/UN/UNRTST/Authen-Captcha-1.023.tar.gz
 
Checking if your kit is complete...
Looks good
Writing Makefile for Authen::Captcha
cp Captcha/images/8.png blib/lib/Authen/Captcha/images/8.png
cp Captcha/images/s.png blib/lib/Authen/Captcha/images/s.png
cp Captcha/images/a.png blib/lib/Authen/Captcha/images/a.png
cp Captcha/images/l.png blib/lib/Authen/Captcha/images/l.png
cp Captcha/images/z.png blib/lib/Authen/Captcha/images/z.png
cp Captcha/images/5.png blib/lib/Authen/Captcha/images/5.png
cp Captcha/images/b.png blib/lib/Authen/Captcha/images/b.png
cp Captcha/images/9.png blib/lib/Authen/Captcha/images/9.png
cp Captcha/images/4.png blib/lib/Authen/Captcha/images/4.png
cp Captcha/images/6.png blib/lib/Authen/Captcha/images/6.png
cp Captcha/images/background2.png blib/lib/Authen/Captcha/images/background2.png
cp Captcha/images/c.png blib/lib/Authen/Captcha/images/c.png
cp Captcha/images/g.png blib/lib/Authen/Captcha/images/g.png
cp Captcha/images/v.png blib/lib/Authen/Captcha/images/v.png
cp Captcha/images/y.png blib/lib/Authen/Captcha/images/y.png
cp Captcha/images/u.png blib/lib/Authen/Captcha/images/u.png
cp Captcha/images/q.png blib/lib/Authen/Captcha/images/q.png
cp Captcha/images/p.png blib/lib/Authen/Captcha/images/p.png
cp Captcha/images/3.png blib/lib/Authen/Captcha/images/3.png
cp Captcha/images/background4.png blib/lib/Authen/Captcha/images/background4.png
cp Captcha/images/d.png blib/lib/Authen/Captcha/images/d.png
cp Captcha/images/h.png blib/lib/Authen/Captcha/images/h.png
cp Captcha/images/background3.png blib/lib/Authen/Captcha/images/background3.png
cp Captcha/images/n.png blib/lib/Authen/Captcha/images/n.png
cp Captcha/images/o.png blib/lib/Authen/Captcha/images/o.png
cp Captcha/images/f.png blib/lib/Authen/Captcha/images/f.png
cp Captcha/images/Thumbs.db blib/lib/Authen/Captcha/images/Thumbs.db
cp Captcha.pm blib/lib/Authen/Captcha.pm
cp Captcha/images/2.png blib/lib/Authen/Captcha/images/2.png
cp Captcha/images/j.png blib/lib/Authen/Captcha/images/j.png
cp Captcha/images/x.png blib/lib/Authen/Captcha/images/x