エントリー画面での「div」挿入

前回に引き続き、またもや、安直カスタマイズネタです(笑)

今度は、エントリー画面で、

<div id="***"></div>

を入れるカスタマイズです。

これはスタイルシートでのデザインを考慮したものです。


まず、「mt.js」の編集です。

以下のコードを挿入してください。

「mt.js」

function insertDiv (e) { if (!canFormat) return; var str = getSelection(e); if (!str) return; var my_div = prompt('div id=',''); setSelection(e, '<div id="' + my_div + '">' + str + '</div>'); return false; }


次に、tmpl/cms/edit_entry.tmplに以下を追加。

tmpl/cms/edit_entry.tmpl

write('<a title="<MT_TRANS phrase="Insert Div">" href="#" onclick="return insertDivt(document.entry_form.text)"> <img src="<TMPL_VAR NAME=STATIC_URI>images/html-div.gif" alt="<MT_TRANS phrase="Insert Div">" width="22" height="16" /></a>');


そして、下記のような画像をimagesにアップします。

↓こちらのボタン画像はご自由にお使いください。

html-div.gif


文字列を選択し、ボタンを押すと、下のようなプロンプトが出てきますので、

スタイルシートのID名を入力してください。


すると、

<div id="kyodai">あ</div>

のようなタグが挿入されます。


そこで、スタイルシートテンプレートに、

#kyodai { font-size: xx-large; font-weight: bold; }

のような記述をしてください。


<div class="***"></div>

のようなクラスでの指定が良い場合もあるあもしれませんが、
今回はIDで。。。。

以上、安直カスタマイズ・ネタでした(^^;)

----------------------------------------------------
2005/06/24
MTのバージョンが3.17になり、ファンクション名が変わっています。

こちらを必ず参照してください。

スタイルシートによるレイアウトデザイン見本帖
大藤 幹 松原 慶太 押本 祐二
翔泳社 (2005/05/10)
売り上げランキング: 5,189
This item is currently not available.

HTML&スタイルシートレイアウトブック―「脱!フレーム&テーブル」で「最新・標準」レイアウトにリメイク!
外間 かおり
ソーテック社 (2005/04)
売り上げランキング: 43,291
This item is currently not available.