2007年05月06日 日曜日

TFforEditButtonsをカスタマイズしてルビボタンを出現させる

SOMA Hitoshi様が公開されている「TFforEditButtons」という大変便利なMovable Typeプラグインがあるのですが、こちらを少しカスタマイズして、Movable Type 3.3以降の編集画面上に「ルビを振る」ボタンを出現させてみました。
もしかしたら同じことをしたいと思ってる人がいるかもしれないので、その時のやり方を書いておきます。
(それなりに分かる方向けなので、説明が若干不親切ですがお許しください)

movabletypeeditwindow.jpg

まず、TFforEditButtons.plを開きます。

write('<a class="textbuttons" title="" href="javascript:void(0);" onclick="return markup_html(document.entry_form.text, \\'br\\', \\'\\', \\'empty\\');">br</a> ');
の後に一行あけて、そこに次のよう書き足してください。
write('<a class="textbuttons" title="" href="javascript:void(0);" onclick="return markup_ruby_html(document.entry_form.text);">ruby</a> ');

同様に、

write('<a class="textbuttons" title="" href="javascript:void(0);" onclick="return markup_html(document.entry_form.text_more, \\'br\\', \\'\\', \\'empty\\');">br</a> ');
の後に一行あけて、そこに次のよう書き足してください。
write('<a class="textbuttons" title="" href="javascript:void(0);" onclick="return markup_ruby_html(document.entry_form.text_more);">ruby</a> ');

次に、editbuttons.jsを開いて、一番最後の行から、次のように書いてください。(貼り付けてください。)

function markup_ruby_html (e) {
if (!function_available) return;

/* ルビタグ非対応のブラウザでルビタグを表示しようとすると、括弧書きで表示されます。
下にある"(" ")" を書き換えると、そのとき括弧を指定できます。*/
var Bracket1 = "(";
var Bracket2 = ")";

var RubyString = prompt("Input ruby string. (or empty to cancel)", "");
if (!RubyString) { return false; }

var starttag = '<ruby><rb>';
var endtag = '</rb><rp>' + Bracket1 + '</rp><rt>' + RubyString + '</rt><rp>' + Bracket2 + '</rp></ruby>';

markup(e, starttag, endtag, '');

return false;
}

編集後、これらを指定の場所にアップロードして、見慣れた編集画面に「Ruby」というボタンが追加されれば完成です!
ちなみにWindows 2000+Opera 9.10、Windows 2000+IE6、Windows 2000+Firefox 1.0(常用してないのでバージョン古いまま放置してました○| ̄|_)で動作を確認しています。

当然ですが、カスタマイズは自己責任で。
特にこのカスタマイズに関する質問等を、TFforEditButtonsの作者様に問い合わせるのは絶対に止めてください。

あ、IEで検証中に「他のページに行きますか?」ダイアログがうるさかったので、

href="javascript:void(0);"
を消したところ、満足に機能しなくなりました。お気を付けください。

[2007年5月7日 0時34分追記]
RUBYタグに対応しているブラウザは、私の知っている限りではIE5以上と、「XHTMLルビサポート」拡張を導入しているFirefoxです。
他にあったらコメントにでもお願いします...

投稿者 Anija : カテゴリ ソフト開発 : 2007年05月06日 23:53

トラックバック

このエントリーのトラックバックURL:
http://blog.fusagiko.com/mt/mt-tb.cgi/324

コメント

コメントしてください




保存しますか?



スパム対策のため、お手数ですが、日本語は必ず1文字以上入れてください。
(半角英数字のみのコメントは受け付けていません。)