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

トラックバックピープルのリンクリストにスクロールバーをつけるカスタマイズです。リンクリストにスクロールバーをつけるシリーズ

BlogPeopleのリンクリストにスクロールバーをつける MyBlogList にスクロールバーをつける（改）

に続く第3弾です。

カスタマイズの前に、トラックバックピープルのリンクリストのデフォルトのタグは下記のようになっています。

<div class="blogpeople-tbp">
<div class="blogpeople-tbp-link"><a href="http://・・・">タイトル1</a></div>
<div class="blogpeople-tbp-link"><a href="http://・・・">タイトル2</a></div>
　　　　　　　　　：
　　　　（最大10トラックバック）
　　　　　　　　　：
<div class="blogpeople-tbp-link"><a href="http://・・・">タイトルn</a></div>
<div class="blogpeople-tbp-credit">（クレジットバナー）<br />（クレジット「Powered by BlogPeople」）</div>
</div>

BlogPeople 本来のリンクリストはリンク部分とクレジットバナーが div タグで分割されているので、CSSの設定のみでスクロールとクレジットバナーを分割できたのですが、トラックバックピープルは新着記事を最大10件まで表示するという仕様であるため、タグの構成が異なっているようです。言い換えるとCSSに、

リスト全体： blogpeople-tbp

各記事： blogpeople-tbp-link

クレジットバナー・クレジット： blogpeople-tbp-credit

というクラスセレクタを設定することで、きめ細かいスタイルを指定することができます。これはトラックバックピープルの「スクリプトの作成」ページの下の方に「上級者向け情報」として説明されています。

他のリンクリストと同様にスクロールバーを与える場合、本来のタグ構成では実現できないため、クレジットバナーおよびクレジットをスクロールバーの外に完全に追い出すスクリプトを作りました。
動作的には最初のリストに対し、青色の div タグを挿入して記事側の blogpeople-tbp-link 全体を blogpeople-tbp で括っているようにみせかけ、余った </div> に対応する <div blogpeople-tbp-box> を付与することでタグの帳尻を合わせています。

<div class="blogpeople-tbp-box">
<div class="blogpeople-tbp">
<div class="blogpeople-tbp-link"><a href="http://・・・">タイトル1</a></div>
<div class="blogpeople-tbp-link"><a href="http://・・・">タイトル2</a></div>
　　　　　　　　　：
　　　　（最大10トラックバック）
　　　　　　　　　：
<div class="blogpeople-tbp-link"><a href="http://・・・">タイトルn</a></div>
</div>
<div class="blogpeople-tbp-credit">（クレジットバナー）<br />（クレジット「Powered by BlogPeople」）</div>
</div>

以下カスタマイズ方法です。

１．トラックバックピープル表示用タグの修正

各テンプレートに設定している、トラックバックピープルのリストを表示するタグ

<script type="text/javascript">b=0</script><script type="text/javascript" src="http://・・・" ></script>

を div タグ等で括って

<div class="side" id="hogehoge">
<script language="javascript">b=0</script><script type="text/javascript" src="http://・・・" ></script>
</div>

としてください。括られていない場合は、サンプルのようにタグを追加してください（タグは div でなくても大丈夫と思いますが、他のタグについては動作未確認です）。
hogehoge の部分は、任意の id 属性名を設定してください。id 属性名はページ内で一意になる名称にしてください（=他の id 属性名と重複しないこと）。
追加が終わったら保存・再構築してください。

２．テンプレートにJavaScript追加

１項のトラックバックピープル表示用タグの下に、下記のスクリプト（青色）を追加します。

<div class="side" id="hogehoge">
<script language="javascript">b=0</script><script type="text/javascript" src="http://・・・" ></script>
</div>
 
<script type="text/javascript" language="javascript">
<!--
id = 'hogehoge';
tag1 = '<div';
if (window.navigator.userAgent.indexOf("MSIE") != -1) {
    tag1 = tag1.toUpperCase();
}
nodes = document.getElementById(id).innerHTML;
data = '<div class="blogpeople-tbp-box">';
list = nodes.split(tag1);
flg = 0;
for (i = 0; i < list.length; i++) {
    if(list.length == i + 1) {
        data += '</div><div ' + list[i];
        break;
    } else {
        if (i != 0){
            data += '<div ' + list[i];
        } else {
            data += list[i];
        }
        continue;
    }
}
document.getElementById(id).innerHTML = data;
//-->
</script>

スクリプトの3行目の右辺（赤色）には、１項で設定した id 属性名を設定してください。
追加が終わったら保存・再構築してください。

３．CSS設定

下記のクラスセレクタをスタイルシート（styles-site.css）に新たに定義します。場所はどこでも大丈夫です。

.blogpeople-tbp-box {
    /* 必要に応じて設定 */
}
 
.blogpeople-tbp {
    overflow: auto;
    height: 60px;
}
 
.blogpeople-tbp-credit {
    margin-top: 10px;
    margin-bottom: 0px;
}

上から順番に、全体・リンクリスト用・クレジットバナーおよびクレジット用のスタイルです。内容は適宜変更してください。
もし同一名称のクラスセレクタがすでに存在する場合は、クラスセレクタを任意の名称に変更してください。その場合、２項のスクリプトに埋め込まれた３項のクラスセレクタ名を変更した名称に修正してください。
追加が終わったら保存・再構築してください。

以上です。Windows2000・XPのIE6.0/Netscape7.0/Firefox1.0/Opera7.23・8.0で正常に表示されることを確認しています。

2005.07.25 追記
２項のHTMLタグに誤りがありましたので修正しました。

同一エントリーへの重複トラックバックを抑止するプラグインです。このプラグインは Movable Type 3.1/3.2 で有効です。3.3 以降は「重複トラックバック防止プラグイン（3.3版）」をご利用ください

duplicateTBPingfilter.zip （3.2x版）

duplicateTBPingfilter.zip （3.1x版） *1

2005.05.28 Ver 1.00
2005.05.30 Ver 1.01 ロジック修正（1.00と機能的な差分はありません）
2005.05.30 Ver 1.02 プラグイン名変更（〃） ←すいません…
2005.10.05 Ver 2.00 3.2x版対応（ブログ別設定機能追加）

本プラグインは下記の機能を有します。

• 同一エントリーに対する、同一URLからのトラックバックを受け付けないようにすることができます。
• チェック方法は、トラックバック受信時、同一エントリー内のトラックバック（の source_url ）を新着順に取り出し、受信したトラックバックの source_url と比較、同一URLであればフィルタ対象とします。
• 受信したトラックバックに含まれるタイトルまたは概要を含めたフィルタリングが可能です。デフォルトではタイトル・概要が全く同じトラックバックのみをフィルタリングしています（カスタマイズ方法は後述）。
• チェックするトラックバック数を指定できます（カスタマイズ方法は後述）。
• トラックバックがフィルタリングされた場合、ログを出力します。

１．使用方法

duplicateTBPingfilter.zipをダウンロードし、アーカイブを解凍してください。解凍すると中に duplicateTBPingfilter.pl がありますので Movable Type の plugins ディレクトリにアップロードしてください。3.2x の場合は duplicateTBPingfilter ディレクトリを含めてplugins ディレクトリにアップロードしてください。管理画面のメイン・メニューの「利用可能なプラグインの設定」に「Duplicate Trackback Ping Filter Plugin ?」が表示されればOKです。3.2xの場合は、管理メニューの[設定]→[プラグイン]→[Duplicate Trackback Ping Filter Plugin]の右側にある「設定を表示」をクリックして、左に表示されたチェックボックスをチェックし、「変更を保存」をクリックすることで有効になります。

フィルタされたURLについてはログに

Filter duplicate trackback ping from the following URL:http://?

というメッセージを出力します。

２．カスタマイズ

２．１ トラックバックのタイトルをフィルタ対象にする

エントリー内に同一URLからのトラックバックが検出された場合、新着トラックバックのタイトルと登録済トラックバックのタイトルを比較する／しないを設定します。比較する場合、タイトルの文字列が異なっていれば新たなトラックバックとして受け付けます。比較する場合は "1"、しない場合は "0" を赤色部分に設定します。デフォルトは "1" を設定しています。

our $title = 1;

２．２ トラックバックの概要をフィルタ対象にする

エントリー内に同一URLからのトラックバックが検出された場合、新着トラックバックの概要と登録済トラックバックの概要を比較する／しないを設定します。比較する場合、概要の文字列が異なっていれば新たなトラックバックとして受け付けます。比較する場合は "1"、しない場合は "0" を赤色部分に設定します。デフォルトは "1" を設定しています。

our $excerpt = 1;

２．３ チェックするトラックバック数を指定する

エントリーに登録されたトラックバックと最大いくつまでチェックするかを指定します。例えば3つまでチェックしたい場合は "3" を赤色部分に設定します。デフォルトは "0" で、これはエントリー内の全てのトラックバックがチェック対象であることを意味します（同一URLのトラックバックが見つかった時点で処理を終了します）。

our $counter = 0;

３．その他

このプラグインは TBPingFilter という Application Level Callback を使用しています。フィルタされた場合はトラックバックを登録しませんが相手サイトには 403 Forbidden が返却されます。これを正常に終了したかのようにするには、lib/MT/App/Trackback.pm の 280行目辺りを

$ping->blog_name($blog_name);
if (!MT->run_callbacks('TBPingFilter', $app, $ping)) {
    return $app->_response(Error => "", Code => 403);
    return 1;
}
 
$ping->save;

と変更します。この変更により、相手サイトにはトラックバックが正常終了したかのようにみえますので、さらに重複トラックバックが送信される可能性が低くなります。ただし他のプラグインと競合している場合はご注意ください。

なお、送信時間が極端に近いトラックバックについては重複してしまいます。また離れていても同一トラックバックとみなせないケースがあるようですので予めご容赦ください。

2005.05.30 変更
本文をプラグインの説明と入れ替えました。以前の内容は下記の追記に移動しました。

2005.07.06 変更
本文の最後に重複する可能性のあるケースを追加しました。

2005.10.05 追記
3.2x版をリリースしました。また本文に3.2x版の設定方法を追記しました。

*1：3.2xでも使用可能ですが、ブログ別の設定はできません。

先日の「ブログ開設1周年記念・【TB企画】あなたのサイトのお気に入りカスタマイズ」に大変多くのトラックバックをお送りくださり、ありがとうございました。当初20サイトくらい頂ければ上出来、と思っていたら現時点で535455サイト。嬉しい悲鳴です。この場をお借りして改めてお礼申し上げます。

ということで予告通り、本エントリーにてトラックバックをくださったサイトをキャプチャ画像で紹介させて頂きます。画像リンクより各サイトのトップページにジャンプします。気の利いたコメントが書ければいいのですが、ご勘弁ください。キャプチャ環境は Windows XP + IE6.0 です。
また画像・タイトル・リンクの組み合わせはプログラムで行っているので、不具合ございましたらお許しください。ダイナミックに並べ替えとかできるといいのですが、とりあえず受信順です。

ぼくたび　BLOG

fuul’s Diary

我楽

TOY COZY MUSEUM 別館

kazunoblog

.Daily-note.o●

WhiteжButterfly

やむやむ

本日のおすすめ !!

Stupid excuse!!

PHAT∴LOVESICK

[N?]Nonsense?

体験手記レポート部

eizo slash blog

SWEET WATER Web Server

深い雪

Four Seasons

Sans-Souci

Magic White

ＣＵ＊Ｃｈｕ！

チームニゴイでございます。

existence Uhheri Edition

from NaOHの迷宮

猫派の読書空間

The blog of H.Fujimoto

WAY TO GO

えてぽんの部屋

nancha-tei

KSMT :: HR/HM Blog

日々一歩-裏-

Mojo Walkin'+

caramel*vanilla

う・わ・き・も・の

新妻blog(もう新妻じゃないけど)

帰宅部大学生のblog

Monochrome Recollections・blog

ハルニレの木の下で

CEFA::Blog

今日の覚え書き

和道楽日記 - Kazulog -

あそび

ぷちぷちつづり

Luna's*PaPa

ひびのつぶやき

gaw

blog::made in SAGA

GF*days

人間万事塞翁が馬　で行こう

M*C?B Version?

langsam

MIND DIARY

ブログ別！作成・カスタマイズ講座

Blog@Peaceman

東京西郊日誌

THE TRENDYLINE

DS2に

皆さんすでにご存知と思われますが、最近お世話になっている壱さんの著書「Movable Type 上級カスタマイズ術」が発売されました。この本は名前の通り、Movable Type に対してさらに高度なカスタマイズを目指す方向けのもので、ブログ関連の書籍が増える中、Movable Type でこの手の内容のものはおそらく初めてではないでしょうか。

ブログ自由自在 Movable Type 上級カスタマイズ術 posted with amazlet at 05.05.24 藤本 壱 技術評論社 (2005/05/18) 売り上げランキング: 6,985 通常4日間以内に発送 おすすめ度の平均: こんな本を待っていた Amazon.co.jp で詳細を見る

他で見かける Movable Type の基本的操作や 簡単な Tips 集といった著書と異なり、Perl による制御やプラグインの作成方法、また PHP によるモジュール化やダイナミックパブリッシングの導入とそれに伴う PHPプラグインの作成方法等、これまでになかった情報が満載です。Movable Type 特有のデータ構造も分かりやすく書かれているので、プログラミングに関する一定の基礎知識があればブログの制御やプラグインも作成も可能です。
もちろんテンプレートの作成方法やCSSによるデザイン変更といった基本的な内容も書かれてまして、こちらは必要最低限の内容で最大の効果があげられることを考慮して書かれているのが嬉しいところです。

まとめると「痒いところに手が届く1冊」です。ということで早速購入致しまして、念願のプラグイン作成・公開に向けて勉強したいと思います。

前回の記事では原文にもとづいたカスタマイズ（+公開テンプレートに合わせた修正）を行いましたが、そのままの状態では Typekey 認証を設定している場合、サイン・イン後もセキュリティコードの設定が要求されます。サイン・インを行った後は他の認証手段と併用しない方がコメンターにとってはありがたいと思われますので、今回はその部分の修正について紹介したいと思います。
カスタマイズの前に、前回の記事で MT-SCode プラグインの設定が全て完了していることが前提となります。

１．テンプレートの修正

管理メニューより個別エントリーアーカイブテンプレートを開き、前回の６項（または９項）で追加したセキュリティコード表示部分に対して、div タグおよび JavaScript を追加します。この追加によりサイン・イン状態を判定して、サイン・イン状態であればセキュリティコード入力エリアを表示しないようになります。
リストのように、セキュリティコード表示用タグに対して青色部分を追加してください。９項に追加するイメージで書いてますが、挿入箇所は６項も同様です。

<!-- Security Code Check -->
<div id="securitycode">
<p><label for="securityCode"> Security Code:</label><br />
<input type="hidden" id="code" name="code" value="<$MTSecurityCode$>" />
<input tabindex=3 id="scode" name="scode" />
<img border="0" src="<$MTCGIPath$><$MTSecurityImage$>?code=<$MTSecurityCode$>" style="vertical-align: middle; margin-top:-6px;" /><br />
手動で送信されたコメントであることを示すために、上のボックスに表示されている通りに数字を入力してください</p>
</div>
<!-- end of Security Code Check -->
 
<MTIfNonEmpty tag="MTTypeKeyToken">
<script language="javascript" type="text/javascript">
<!--
if (commenter_name) {
    document.getElementById('securitycode').style.display = 'none';
}
// -->
</script>
</MTIfNonEmpty>

なお前回の６項では、セキュリティコード表示の設定箇所が「TypeKey サイン・インを常に要求する場合」と「TypeKey サイン・インをしなくてもコメント可能な場合」の計2ヶ所あり、今回の修正は下方、つまり「TypeKey サイン・インをしなくてもコメント可能な場合」のコメント用フォームに対して実施します。文章ではわかりづらいので下に個別エントリーアーカイブテンプレートのタグの抜粋を示します。

            ：
<MTIfRegistrationRequired>
    <MTIfNonEmpty tag="MTTypeKeyToken">
            ：
        TypeKey サイン・インを常に要求し、
        TypeKeyが設定されている場合の処理
        コメント用フォーム表示
            ：
    <MTElse>
            ：
        TypeKey サイン・インを常に要求し、
        TypeKeyが設定されていない場合の処理（=環境設定誤り）
            ：
    </MTElse>
    </MTIfNonEmpty>
<MTElse>
            ：
    TypeKey サイン・インをしなくてもコメント可能な場合の処理
    コメント用フォーム表示
            ：
</MTElse>
</MTIfRegistrationRequired>
            ：

ご覧の通り、赤色部分にコメントフォームが計2ヶ所あります。下にある方が今回の修正対象です。
どちらのコメント用フォームが使われるかは、管理メニューの「ウェブログの設定」→「設定」の「コメントの設定」欄にある「未登録の読者からのコメントを受けつける」のチェックボックスへのチェック有無で決まります。チェックされていなければ上のフォーム、チェックされていれば下のフォームが適用されます。
また、上のフォームは「未登録の読者からのコメントを受けつける」にチェックがついていない場合にしか使われないため、前回の説明で既にセキュリティコード表示が設定されている場合は Typekey 認証と競合するため削除してください（厳密に言うと、「未登録の読者からのコメントを受けつける」にチェックをされているのであれば、放っておいても構いません）。

２．Comments.pm の修正

ここでの修正は、cookie に保持されているサイン・イン状態を取得・判定して、サイン・インされていればセキュリティコードチェックを実施しない処理の追加です（１項で非表示にしてもセキュリティチェック自体は実施されるため）。
lib/MT/App/Comments.pm をダウンロードし、任意のエディタで開いて、前回の5項の設定に対して下記の青色部分を追加してください（8行ほど挿入した数行下に "}" の挿入がありますのでご注意ください）。

# SecurityCode hack start 
#
require MT::SCode;
my $code = $q->param('code');
my $scode = $q->param('scode');
my $sscode = MT::SCode::scode_get($code);
 
my $class = $ENV{MOD_PERL} ? 'Apache::Cookie' : 'CGI::Cookie';
eval "use $class;";
my $cookies = $class->fetch;
my $commenter_name = "";
if ($cookies && $cookies->{commenter_name} && $cookies->{commenter_name}->value()) {
    $commenter_name = MT::I18N::encode_text($cookies->{commenter_name}->value(),'utf-8',undef);
}
if (!$commenter_name) {
 
if ($scode ne $sscode) {
    return $app->handle_error($app->translate(
       "Wrong or missing Security Code."));
}
 
}
 
MT::SCode::scode_delete($code);
MT::SCode::scode_create($code);
#
# Security hack ends

３．Context.pm の修正

この項では、コメント・プレビュー／コメント・エラーページに対して、Typekey サイン・イン状態を判定して、サイン・イン状態であればセキュリティコード入力エリアを表示しないための修正です。
lib/MT/Template/Context.pm をダウンロードし、任意のエディタで開いて、前回の８項または１０項で行った設定に対して青色部分を追加してください。

<!-- Security Code Check -->
<div id="securitycode">
<p><label for="securityCode">Security Code:</label><br />
<input type="hidden" id="code" name="code" value="$securitycode" />
<input tabindex=3 id="scode" name="scode" />
<img border="0" alt="Please enter the security code you see here" src="$path/mt-scode.cgi?code=$securitycode" style="vertical-align: middle; margin-top:-6px;" /><br />
<MT_TRANS phrase="Please enter the security code you see here."></p>
</div>
<!-- end of Security Code Check -->
HTML
        if ($rem_auth_token && $registration_allowed) {
        $result .= MT->translate_templatized(<<HTML);
<script language="javascript" type="text/javascript">
<!--
if (getCookie("commenter_name")) {
    document.getElementById('securitycode').style.display = 'none';
}
// -->
</script>
HTML
        }
        $result .= MT->translate_templatized(<<HTML);

TB企画に参加くださったサイトの皆様、ありがとうございました（まだ継続受付中です）。大変多くのトラックバックを頂いて嬉しい限りです（涙）。
ということで、只今トラックバックを頂いた順に各エントリーへご返事を書かせて頂いておりますが、時間の関係で本日は一旦締めさせてください。また本日の夜辺りから順にご返事させて頂きます。全てのサイトへのコメントが完了するまで若干かなりタイムラグが生じますが、予めご了承ください。

なおTB企画に乗って頂いた全サイトにつきまして、トップページのキャプチャ画像つきで別途エントリーさせて頂く予定です（中身は多分ほとんどありませんが）ので、併せてよろしくお願い致します。

カラーを

本サイト開設より丁度1年が経過致しました。おかげさまをもちまして1年間無事にブログを運営することができました。ありがとうございます。
ということで、簡単にこの1年を振り返ってみたいと思います。

開設当初は「ブログ？って何」って感じで、よくわからないまま Movable Type 3.0D をインストール。当時は 2.6x の情報で溢れてましたが公式サイトでは既に配布が終わっており、出だしから情報不足の状態でした。
過去の記事を読み直すと2日目ですでに3カラムテンプレートに変更しておりまして、それを含めて現在のデザインに落ち着くまで、他のサイトより計3回テンプレートを頂いて入れ替えました。

その後、6月28日より公開テンプレートとして配布開始。さらにコメント用テンプレートや検索テンプレート、また Movable Type で提供している Typekey やポップアップ機能にも対応させることができました。現在400近いユーザにご利用頂いており、大変感謝している次第です。今年1月にはテンプレートユーザ有志で mixi の「小粋なユーザコミュニティ」も立ち上げてくださいました。ありがとうございます。
HTMLタグは何年も書いてきましたが valid という意味ではこの1年が一番進歩した気がします。CSS や XHTML も多少分かってきました。今後は公開テンプレートのCSSを整理して、クロスブラウザを考慮したものを目指したいと思います。

折りたたみやツリー化、カレンダー等をはじめとした他のカスタマイズも多岐にわたり、色々なものを含めると枚挙に暇がありません。またカスタマイズについてのご質問を多数頂くことで、より信頼性のある記事となり、サイトも賑やかになっていきました。
カスタマイズでは JavaScript のスキルが向上し、全く書いたことのなかった PHP も利用方法が少し理解できました（Perl は相変わらず）。カスタマイズはサイトの機能や利便性を向上させるための手段であり、ブログ本来の目的からするとコンテンツに注力すべきですが、私の場合は手段が目的となってしまいました。まあ日常ネタもさほどありませんので。

そんなこんなであっという間に駆け抜けた1年でした。ブログを始めてから色々なサイトの方とお付き合いをさせて頂いており、そのことも大変嬉しいのですが、ネット上でのいわゆるゴタゴタがなく続けられたことが本当に良かったと感じています。

さて1周年記念ということで、このサイトに似合わないTB企画です。
ここに訪れてくださった方とは、（ダジャレを除いて）テンプレートやカスタマイズでつながっている方がほとんどですので、お題は

あなたのサイトのお気に入りカスタマイズ

にしてみました。
内容はカスタマイズ・テンプレート含め、簡単なものから高度なものまで、どんなものでも結構です。例えば「ここに配置している画像がお気に入り」等でもOK（それも立派なカスタマイズ）。テンプレートやカスタマイズはこのサイトで取り上げていないものでも結構です。紹介する数に制限はありません。関連のエントリーや参照記事があればそちらへのリンクも是非設定してやってください。
要はご自身のサイトの自慢トラックバックです。他のサイトで気になるカスタマイズがあれば、そちらを紹介くださっても構いません。

それでは今後も引き続きどうぞよろしくお願い致します。

MyBlogListのリンクリストにスクロールバーをつけるカスタマイズです。（改）マークはJavaScriptによってクレジットバナーおよび「ListMe」をスクロールバーの外に追い出すことを指しています。

BlogPeopleのリンクリストにスクロールバーをつける場合は、div タグを付与する設定でリンクリスト表示用コードを生成すれば、div タグに予め指定されたクラス属性に対するスタイルを与えることでバナーをスクロールバーから外に追い出せたのですが、MyBlogListの場合は表示用コード生成でそのようなオプションが用意されていないため分割ができません。リストはバナーや「ListMe」を含め、単純に a タグが並んでいるだけのようです。

ということで、バナーおよび「ListMe」をスクロールバーの外に完全に追い出すためのスクリプトを作りました。スクロールバーの一番最後にも「by MyblogList」を表示しません。
具体的には BlogPeople と同様、リンクリストとバナーおよび「ListMe」をそれぞれ <div>～</div> タグで括り、個別にスタイルを与えることができるようにしました。リストの一番最初と最後に "<div>" および "</div>" をつけるのは簡単ですが、単純に並んだ a タグの途中でどのようにして div タグを挿入するかで悩みました。結局、a タグ（"<a"）で分割して検索していき、クレジットバナーの img タグが出現した時点で "</div><div>" を付与、「ListMe」については「MyblogList」という文字を検索して同様に "</div><div>" を追加という方法に落ち着きました。クレジットバナーに画像を使っていない場合も考慮しています。
2005.05.20 追記：リストへの日付や時刻の付与、および画像を用いたNEW装飾にも対応できるように改良しました。
以下カスタマイズ方法です。

１．MyBlogList 表示用タグの修正

各テンプレートに設定している、MyBlogList のリンクリストを表示するタグ

<script language="javascript" type="text/javascript" src="http://list.myblog.jp/list/js…" charset="EUC-JP"></script>

を div タグ等で括って

<div class="side" id="hogehoge">
<script language="javascript" type="text/javascript" src="http://list.myblog.jp/list/js…" charset="EUC-JP"></script>
</div>

としてください。括られていない場合は、サンプルのようにタグを追加してください（タグは div でなくても大丈夫と思いますが、他のタグについては動作未確認です）。
hogehoge の部分は、任意の id 属性名を設定してください。id 属性名はページ内で一意になる名称にしてください（=他の id 属性名と重複しないこと）。
追加が終わったら保存・再構築してください。

２．テンプレートにJavaScript追加

１項の MyBlogList 表示用タグの下に、下記のスクリプト（青色）を追加します。

<div class="side" id="hogehoge">
<script language="javascript" type="text/javascript" src="http://list.myblog.jp/list/js…" charset="EUC-JP"></script>
</div>
 
<script type="text/javascript" language="javascript">
<!--
id = 'hogehoge';
image = 1;
 
tag1 = '<a';
if (window.navigator.userAgent.indexOf("MSIE") != -1) {
    tag1 = tag1.toUpperCase();
}
if (!image) {
    tag2 = '>by MyblogList<';
} else {
    tag2 = 'myblog_list_banner';
}
nodes = document.getElementById(id).innerHTML;
data = '<div class="mybloglist-main">';
list = nodes.split(tag1);
counter = 0;
for (i = 0; i < list.length; i++) {
    if(list[i].indexOf('window.open') != -1) {
        data += '</div><div class="mybloglist-listMe">' + tag1 + list[i];
        break;
    }
    if(list[i].indexOf(tag2) != -1) {
        data += '</div><div class="mybloglist-powered-by">' + tag1 + list[i];
    } else {
        if(counter){
            data += tag1;
        }
        data += list[i];
    }
    counter++;
}
document.getElementById(id).innerHTML = data + '</div>';
//-->
</script>

スクリプトの3行目の右辺（赤色）には、１項で設定した id 属性名を設定してください。またクレジットバナーに画像を用いず「by MyblogList」を表示している方は、4行目の赤色を

image = 0;

に変更してください。
追加が終わったら保存・再構築してください。

３．CSS設定

下記のクラスセレクタをスタイルシート（styles-site.css）に新たに定義します。場所はどこでも大丈夫です。

.mybloglist-main {
    overflow: auto;
    height: 300px;
}
 
.mybloglist-powered-by {
    margin-top: 10px;
    margin-bottom: 0px;
}
 
.mybloglist-listMe {
    margin-top: 0px;
}

上から順番に、リンクリスト用・クレジットバナー用・「ListMe」用のスタイルです。内容は適宜変更してください。
もし同一名称のクラスセレクタがすでに存在する場合は、クラスセレクタを任意の名称に変更してください。その場合、２項のスクリプトに埋め込まれた３項のクラスセレクタ名を変更した名称に修正してください。
追加が終わったら保存・再構築してください。

以上です。Windows2000・XPのIE6.0/Netscape7.0/Firefox1.0/Opera7.23・8.0で正常に表示されることを確認しています。

2005.05.19 追記
スクリプトに誤りがありましたので修正しました。

2005.05.20 追記
先頭に日付・時刻が表示されている場合に不具合がありましたので修正しました。これに伴い２項のスクリプトおよび説明を修正しました。またNEW装飾に画像を用いることができるように改良しました。

総務省は17日、ブログの利用者が「04年度末で延べ約335万人、閲覧者は約1651万人にのぼった」という推計を発表したそうです。また「06年度末には利用者が約782万人、閲覧者が約3455万人と、ともに倍以上に増えると予測」しているようで、まだまだ発展途上の技術であることをうかがわせます。

個人的には、個人レベルで既存のHTMLによるWebサイトから移行する人に加え、HTMLを知らなくても手軽に始められるという利便性から、これまでWebサイトを持っていなかった方の参加も見込まれるので、しばらくは継続的な増加が見込まれると予想しています。
なお、「延べ335万人の利用者のうち約95万人が月に１度以上更新」ということで、約3割は継続しているようです。ちょっと前の他の調査では2/3が三日坊主でしたが。

上記は、

鮫山ネギのブログ３：ブログ利用者、延べ３３５万人　総務省推計

asahi.com：ブログ利用者、延べ３３５万人　総務省推計（元記事）

からの引用です。ちなみに上記の鮫山ネギのブログ３さんはブログを14持っていらっしゃるようで、すごいです。

個別エントリーアーカイブ等のコメント欄にエントリー画面と同じ編集ボタンを表示するカスタマイズです。カスタマイズの完成イメージは左の画像のようになります。 このカスタマイズのオリジナルはcaramel*vanillaさんのようですが、該当のエントリーが見当たりませんでした（見落としてたらすいません）。なおそこから参照されたご近所さんでは

やむやむ：コメント欄に編集ボタン装備

Magic White：コメントに編集ボタン

がありました（もれがありましたらお許しを）。

久しぶりの（改）マークですが、オリジナルからはアイデアのみ頂いて、中身は自力で作りました。機能的な差異は

• Mozilla系ブラウザでも表示（Opera7/8もOK）
• コメント・プレビュー／コメント・エラー画面にも表示

です。「自力で作った」というのは言い過ぎで、Movable Type の管理画面の設定を一部拝借したものです。
以下、カスタマイズ方法です。

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

管理メニューの「ウェブログの設定」→「設定」にある「除去機能」の「カスタマイズ」を選択してテキストボックスに下記を設定します。

a href,a href target,strong,br/,p,em,u,ul,li,blockquote,img src,font color,s

参考までに、「標準の設定」で許可されているHTMLタグは、

a href、b、br、p、strong、em、ul、li、およびblockquote

です。
また同じページの下の方にある「コメントでのHTMLの利用を許可する」をチェックして保存・再構築してください。

２．編集ボタン用画像のコピー

ローカル・サイト・パス（index.html があるディレクトリ）の直下に images ディレクトリを作り、Movable Type の images ディレクトリに存在する下記の画像を images 配下にコピーしてください。

html-bold.gif

html-italic.gif

html-underline.gif

html-link.gif

html-quote.gif

ローカル・サイト・パス配下のどこか（ディレクトリも含む）に Movable Type の images ディレクトリがすでに存在していれば本項目はスキップしてください（images ディレクトリがローカル・サイト・パス直下でない場合は後の設定を若干変更する必要があります）。

３．JavaScriptファイルの作成

編集ボタンをクリックした時に動作させるためのJavaScriptを作ります。Movable Type の mt.js を ローカル・サイト・パスにコピーするか、mt.js より下記を部分を抜粋してJavaScriptの外部ファイル（ここでは commentButton.js）を作ってローカル・サイト・パスにアップロード（または配置）してください。mt.js がすでにローカル・サイト・パスにある場合は本項目をスキップして結構ですが、以降は commentButton.js を配置した前提で説明を進めますのでご注意ください。

var canFormat = 0;
if (document.selection)
    canFormat = 1;
var ua = navigator.userAgent;
if (ua.indexOf('Gecko') >= 0 && ua.indexOf('Safari') < 0)
    canFormat = 1;
 
function getSelection (e) {
    if (document.selection)
        return document.selection.createRange().text;
    else {
        var length = e.textLength;
        var start = e.selectionStart;
        var end = e.selectionEnd;
        if (end == 1 || end == 2) end = length;
        return e.value.substring(start, end);
    }
}
 
function setSelection (e, v) {
    if (document.selection)
        document.selection.createRange().text = v;
    else {
        var length = e.textLength;
        var start = e.selectionStart;
        var end = e.selectionEnd;
        if (end == 1 || end == 2) end = length;
        e.value = e.value.substring(0, start) + v + e.value.substr(end, length);
    }
}
 
function formatStr (e, v) {
    if (!canFormat) return;
    var str = getSelection(e);
    if (!str) return;
    setSelection(e, '<' + v + '>' + str + '</' + v + '>');
    return false;
}
 
function insertLink (e, isMail) {
    if (!canFormat) return;
    var str = getSelection(e);
    if (!str) return;
    var my_link = isMail ? prompt('Enter email address:') : prompt('Enter URL:', 'http://');
    if (isMail) my_link = 'mailto:' + my_link;
    if (my_link != null)
        setSelection(e, '<a href="' + my_link + '">' + str + '</a>');
    return false;
}

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

スタイルシート（styles-site.css）に下記を追加してください。場所はどこでもOKです。

.field-header {
    width: 270px; /* ボタンを配置するエリアの幅 */
    height: 30px; /* ボタンを配置するエリアの高さ */
    position: relative;
}
 
.field-label {
    position: absolute;
    bottom: 0px;
    left: 0px;
}
 
.field-buttons {
    position: absolute;
    bottom: 0px;
    right: 0px;
}
 
.field-buttons img {
    border: 0;
    margin: 0px 0px 0px 3px;
}

コメント部分の値（赤色）はコメントエリアの幅によって適宜変更してください。編集用ボタンは width で設定した幅の一番右側に配置されるようになっています。IEでボタンの右端が 2px ほどテキストエリアの内側になるようにしておけば、Firefoxで丁度揃って表示されるようです。

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

個別エントリーアーカイブ／コメント・プレビュー／コメント・エラーテンプレートの <head>～</head> の間に下記を追加します。

<script type="text/javascript" src="<$MTBlogURL$>commentButton.js" charset="utf-8"></script>

コメント・プレビュー／コメント・エラーでボタンを表示する必要がない場合は個別エントリーアーカイブのみ設定してください。

６．テンプレートの修正（個別エントリーアーカイブへ編集用ボタン設定）

個別エントリーアーカイブテンプレートを開き、下記のリストの通り、赤色部分を青色のものに入れ替えてください。

<p><label for="text">コメント:</label> <MTIfAllowCommentHTML>
(書式を変更するような一部のHTMLタグを使うことができます)</MTIfAllowCommentHTML><br />
<div class="field-header">
<div class="field-label"><label for="text">コメント:</label> <MTIfAllowCommentHTML>
(書式を変更するような一部のHTMLタグを使うことができます)</MTIfAllowCommentHTML></div>
<div class="field-buttons">
<a title="太字" href="#" onclick="return formatStr(document.comments_form.text, 'strong')"><img class="button" src="<$MTBlogURL$>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="<$MTBlogURL$>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="<$MTBlogURL$>images/html-underline.gif" alt="アンダーライン" width="22" height="16" /></a>
<a title="ハイパーリンク" href="#" onclick="return insertLink(document.comments_form.text)"><img class="button" src="<$MTBlogURL$>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="<$MTBlogURL$>images/html-quote.gif" alt="引用" width="22" height="16" /></a>
</div>
</div>

同じ場所が2ヶ所ありますので両方変更します。厳密に言うと「コメント:」で検索して先にみつかった方には MTIfAllowCommentHTML タグがありませんので、

<MTIfAllowCommentHTML>
(書式を変更するような一部のHTMLタグを使うことができます)</MTIfAllowCommentHTML>

の部分は削除してください。それと関連して、コメントでHTMLタグが使える場合には

(書式を変更するような一部のHTMLタグを使うことができます)

というメッセージが表示されますが、本カスタマイズではそれが表示されないことを前提にスタイルを設定していますので、2ヶ所とも削除した方が見栄えはいいです（HTMLタグを挿入するカスタマイズでHTMLタグが使えるメッセージを削除するのは矛盾してますが）。

７．ContextHandlers.pm の修正

注：MT3.3x の時点の内容を記述していますが、コメント・プレビュー／コメント・エラーに <$MTCommentPreviewBody$> タグが使われていない場合は６項の内容を実施してください。

これはコメント・プレビュー／コメント・エラー画面で編集ボタンを表示するための設定です。４項と関連してコメント・プレビュー／コメント・エラーへの表示が不要な場合は本項目をスキップしてください。
５項までの作業で個別エントリーアーカイブに編集用ボタンが表示されるようになりますので、そちらが正常に動作することを確認した後に本項目の設定を行うことをお勧めします。

lib/MT/Template/ContextHandlers.pm

をダウンロードし、任意のエディタで開いて下記の修正を行います。
まず2050行目辺りに青色の行を追加しま