2004年09月30日
投稿画面カスタマイズ Part.1
使いやすい様に投稿画面にボタンやセレクターを追加してみました！
参考にさせて頂きましたサイト様。ありがとうございました！！
■投稿画面をカスタマイズ（フォントカラータグ編）
参考Blog：Trivial BLOG『Color Selectorをつける』より
<font color="">を簡単に設定できるボタンがあればいいなぁ…と探していた所で発見しました。
MT2.6用だったので、MT3.0でも使えるかどうか不安だったのですが、大丈夫でした。
document.という一箇所を削除すれば…の話ですが。
/mt/tmpl/cms/bm_entry.tmpl
/mt/tmpl/cms/edit_entry.tmpl
の2つのファイルの2箇所を修正（追記）します。
1.
<script type="text/javascript">
<!--
以下に追記function colorSelect (obj) {
var v;
if (!document.selection) return;
var str = document.selection.createRange().text;
if (!str) return;
with(obj) {
if (options[selectedIndex].value == "------") return;
v = options[selectedIndex].value;
}
document.all.colcol.style.backgroundColor = v;
document.selection.createRange().text = '>font color="' + v + '">' + str + '</font>';
}function colorSet() {
var v;
if (!document.selection) return;
var str = document.selection.createRange().text;
if (!str) return;
if (document.all.colcol.options[document.all.colcol.selectedIndex].value == "------") return;
v = document.all.colcol.options[document.all.colcol.selectedIndex].value;
document.selection.createRange().text = '<font color="' + v + '">' + str + '</font>';
}
2.
<div class="field">
<script type="text/javascript">
<!--
if (canFormat) {
with (document) {
以下に追記
（箇所は、自分の表示したい場所に合わせてください。）write('<td width="100">
<form name="colform">
<select name="colcol" onchange="colorSelect(this)" width="48">
<option value="------" selected>------
<option value="red">red
<option value="yellow">yellow
<option value="blue">blue
<option value="green">green
<option value="cyan">cyan
</select>
<input type="button" onclick="colorSet()" value="set"></td>');
色は好きな色に変更、追加する事も出来ますよ♪
私は取りあえずこのまま使ってますが…。
色はカラーテーブルで確認してください。私はコチラを使わせてもらってます！
■投稿画面をカスタマイズ（blockquoteタグ編など⇒応用可）
参考Blog：feel easy『エントリー画面のボタン追加』より
引用も結構使う様になったので、追加したいなぁ～と探していて辿り着いたのが上記Blogでした。
出来るんだなぁ～と分かったら、BoldボタンやItalicボタンを参照に変更。
/mt/tmpl/cms/edit_entry.tmpl
に以下を追記。
<script type="text/javascript">
<!--
if (canFormat) {
から
write('</div>');
の間に追加。write('<a href="#" onclick="return formatStr(document.entry_form.text, \'blockquote\')">
<img src="<TMPL_VAR NAME=STATIC_URI>images/bq-button.gif" alt="blockquote" width="26" height="18" border="0"></a>');
これで正しいか分からないんだけど、出来てるからOKだろう（汗）
gifファイルは自身で用意してください。
私の場合は、以下のボタンを作って使ってます。必要ならばDLしてご自由にお使い下さい。
この調子で？<center></center>タグも追加。
追記場所は、上記と同じで。
write('<a href="#" onclick="return formatStr(document.entry_form.text, \'center\')">
<img src="<TMPL_VAR NAME=STATIC_URI>images/center-button.gif" alt="center" width="24" height="18" border="0"></a>');
centerボタンは以下を使用してます。これも必要ならDLの上ご利用下さい^^
長くなりすぎたのでPart2に続く…（はず。）
読み終わったらClickしてね♪⇒
