2004年8月12日木曜日

エントリー画面にdecodeボタンetcを追加

04_08_12.gif
今回は、TrivalBLOGさんを参考に、MTのエントリー画面にデコード、コードそしてBlockquote改良版ボタンをつけてみました。

ただし、MT3.0だと書き方が変わってるので大分いじってはあります。

まず、触るファイルはMTのcgi郡がある場所のrootからみて
tmpl/cms/bm_entry.tmpl
tmpl/cms/edit_entry.tmpl
となります。

下の通りに上の二つのファイルに追記していってください。

function format_code() {
if (!document.selection) return;
var str = document.selection.createRange().text;
if (!str) return;
document.selection.createRange().text = "<div class=\"code\">" + str + "</div>";
return;
}
function format_quote() {
if (!document.selection) return;
var str = document.selection.createRange().text;
if (!str) return;
document.selection.createRange().text = "<div class=\"blockquote\">" + str + "</div>";
return;
}
function deCode() {
if (!document.selection) return;
strSelection = document.selection.createRange().text
if (!strSelection) return;
strSelection = strSelection.replace(new RegExp("&","g"), "&amp;");
strSelection = strSelection.replace(new RegExp("<","g"), "&lt;");
strSelection = strSelection.replace(new RegExp(">","g"), "&gt;");
document.selection.createRange().text = strSelection;
return;
}

を追記。
これが命令部分になります。

で、次に実際に画像を表示させてクリックしたら処理が行われるようにします。
追加するセクションは、
<script type="text/javascript">
<!--
if (canFormat) {
with (document) {
write('<div style="float: right;">');

ここになります。(MT2.Xと命令的には同じ場所だけど構文変わってる)

で、

document.write('<td width="24"><a href="javascript:format_quote()"><img src="<TMPL_VAR NAME=STATIC_URI>images/quote-button.gif" alt="quote" width="24" height="18" border="0"></a></td>');

document.write('<td width="24"><a href="javascript:deCode()"><img src="<TMPL_VAR NAME=STATIC_URI>images/decode-button.gif" alt="decode" width="24" height="18" border="0"></a></td>');

document.write('<td width="24"><a href="javascript:format_code()"><img src="<TMPL_VAR NAME=STATIC_URI>images/code-button.gif" alt="code" width="24" height="18" border="0"></a></td>');


ではなくて、

write('<a title="<MT_TRANS phrase="Blockquote">" href="#" onclick="return format_quote()"><img src="<TMPL_VAR NAME=STATIC_URI>images/quote-button.gif" alt="<MT_TRANS phrase="Blockquote">" width="24" height="18" border="0" /></a>');


write('<a title="<MT_TRANS phrase="deCode">" href="#" onclick="return deCode()"><img src="<TMPL_VAR NAME=STATIC_URI>images/decode-button.gif" alt="<MT_TRANS p
hrase="deCode">" width="24" height="18" border="0" /></a>');


write('<a title="<MT_TRANS phrase="Code">" href="#" onclick="return format_code()"><img src="<TMPL_VAR NAME=STATIC_URI>images/code-button.gif" alt="<MT_TRANS p
hrase="code">" width="24" height="18" border="0" /></a>');

を追加してください。writeから</a>');は改行を入れず一行で書いてください。

trivalさんのとこを見れば知識のある方ならすぐに書きかえれると思いますが、俺はPG的才能がゼロなので多少がんばりましたw
ボタン画像はtrivalさんとこのを使わせていただきました。
ちなみにツールバーのテーブルは、変更無しで問題なかったです。

で、これをやることで下のblockquoteはやめて、CSSからdivでひっぱってくるように変わりましたw

1 件のコメント:

  1. 実は、これつける前までは<とか全部手でかいてたのよね・・面倒だった

    返信削除

素材集

FreePhoto