blogを始める以前に手書きのHTMLでwebサイトを作られていた方だと、言葉の強調を物理タグではなく論理タグで行うことに慣れてしまっている方もいらっしゃるかと思います。
実際、わたしもそうなんです（笑）
そこで今回は、エントリーを書くときの「B」ボタンと「i」ボタンを「strong」ボタンと「em」ボタンに変身させる小技です（笑）
用意するものは mt.js。mt.js は MovableTypeをインストールしたディレクトリのルートの中に、mt.cfgやmt.cgi、mt-*.cgiなどと並んで入っています。
このスクリプトの148～154行めにかけての「mtShortCuts()」という関数を書き換えます。
function mtShortCuts () {
if (event.ctrlKey != true) return;
if (event.keyCode == 1) insertLink();
if (event.keyCode == 2) formatStr('b');
if (event.keyCode == 9) formatStr('i');
if (event.keyCode == 21) formatStr('u');
}
このうち、151～152行目を
if (event.keyCode == 2) formatStr('strong');
if (event.keyCode == 9) formatStr('em');
このように書き換えてください。
すると、「B」ボタンで「strong」、「i」ボタンで「em」各タグが自動的に追加される仕様になりました。
あとはテンプレートと一緒に並んでいるスタイルシートで、strong や em の仕様を好みにカスタマイズしておきましょう。ちなみにわたしは日本語の斜体が（特にパソコン画面上で）かなり読みにくいと感じるので、文字種をイタリックではなく通常体にし、書体が違わない分を色で強調する形にカヴァーしています。
さて、機能面はこれでOKなんですが、表示をどうにかしないといけません。
とりあえず、ヘタクソなんですがまず、専用のボタン画像をつくります。
これを 「images」ディレクトリの中へ追加します。
更に「tmpl/cms/」ディレクトリの中にある「bm_entry.tmpl」「edit_entry.tmpl」も書き換えます。
bm_entry.tmpl でいうと 199-200行目、edit_entry.tmpl でいうと172-173行目にある
write('<a title="<MT_TRANS phrase="Bold">" href="#" onclick="return formatStr(document.entry_form.text, \'strong\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/bold-button.gif" alt="<MT_TRANS phrase="Bold">" width="24" height="18" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Italic">" href="#" onclick="return formatStr(document.entry_form.text, \'em\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/italic-button.gif" alt="<MT_TRANS phrase="Italic">" width="24" height="18" border="0" /></a>');
これを、次のように書き換えます。
write('<a title="<MT_TRANS phrase="Strong">" href="#" onclick="return formatStr(document.entry_form.text, \'strong\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/strong-button.gif" alt="<MT_TRANS phrase="Strong">" width="48" height="18" border="0" /></a>');
write('<a title="<MT_TRANS phrase="Emphasis">" href="#" onclick="return formatStr(document.entry_form.text, \'em\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/em-button.gif" alt="<MT_TRANS phrase="Emphasis">" width="24" height="18" border="0" /></a>');
「strong」ボタンの幅が変わっているのも忘れずに書き換えましょう（汗）
書き換えたファイルをアップロードすれば、できあがりです♪
この技法、応用できればMTでもヤプログみたいないろんなファンシーなことができるようになるかも!?
P.S. その後全然使ってないアンダーライン用ボタンも「blockquote」用ボタンに替えました。
* comments *