- 鳥繁 -
« MovableTypeにREDボタンを追加 | メイン | MovableTypeの<strong><em>を<b><i>に »
2004年09月01日
MovableTypeにIMGボタンを追加
MovableType 3.0のエントリーの投稿画面にIMGボタンを追加してみました。
こんなん。
文字列を選択してクリックすると、URLを訊いてくるので、すでにアップロード済の画像のURLを入力し、次のプロンプトでALT属性を設定（初期値は選択範囲の文字列）すると、<img src="画像のURL" alt="ALT属性" width="" height="" border="0">というタグを補います。
widthとheightを自動的に取得するのは面倒なんでやってません。ので各自画像を右クリックしてプロパティで画像サイズを調べるなどして対処してください。
を見直しながら、対処法を決めました。
まずボタンの画像を用意します。
画像を
/mt/images/
にアップロードします。
つぎに、
mt/tmpl/cms/edit_entry.tmpl
の175行付近に、
write('<a title="<MT_TRANS phrase="Insert Link">" href="#" onclick="return insertLink(document.entry_form.text)"><img src="<TMPL_VAR NAME=STATIC_URI>images/url-button.gif" alt="<MT_TRANS phrase="Insert Link">" width="26" height="18" border="0" /></a>');
というのがあるはずです。これが、URL（リンク）ボタンなので、これと類似の行を作って挿入してやればいいわけです。
write('<a title="<MT_TRANS phrase="Insert Image">" href="#" onclick="return insertImg(document.entry_form.text)"><img src="<TMPL_VAR NAME=STATIC_URI>images/img-button.gif" alt="<MT_TRANS phrase="Insert Image">" width="26" height="18" border="0" /></a>');
こんなのを挿入してみました。
で、URLで使っているinsertLink()のかわりに新しくinsertImg()を用意します。
mt/mt.js
の164行付近
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 + '" target="_blank">' + str + '</a>');
return false;
}
を参考にして、これにつづけて、
function insertImg (e) {
if (!canFormat) return;
var str = getSelection(e);
if (!str) return;
var my_link = prompt('Enter Image-URL:', 'http://');
var str = prompt('Edit Altanate-Text:', str);
if (my_link != null)
setSelection(e, '<img src="' + my_link + '" alt="' + str + '" width="" height="" border="0">');
return false;
}
とします。
いちいち画像のサイズ調べて入力するのが面倒な人は、ほかのエライ人のエントリを探すか、赤字の部分を削除してください。
投稿者 Kirishima : 2004年09月01日 11:36
Tweet