2005年10月22日

■ エントリーで色ボタン設定

| コメント [0] | tb [0]

MovableTypeのバージョンが3.2にあがって以前の3.17から書き方が変わってます。
   【補足】エントリーで色ボタン設定(3.17バージョン)

まずやりたい事ですがMovableTypeの新規エントリー画面は
entrybefore.gif
のようになっていて、色の指定に<font color=~>とタグを書かなくてはいけません…
そこで
entryafter.gif
のように新規エントリー画面に色指定できるボタンを作成します。

作業は3点あります。
1.イメージファイルをアップロード
 /cgi/mt/mt-static/imagesの配下に画像gifをアップロードします。

darkred.gif
この画面で使っている画像です。
もし使われるようならダウンロードしてください。

2./cgi/mt/tmpl/cms/edit_entry.tmplを修正

348行目からがエントリーの内容、376行目からが追記のボタンを決めています。
まず348行目

write('<a title="<MT_TRANS phrase="Bold">" href="#" onclick="return formatStr(document.entry_form.text_more, \'strong\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/html-bold.gif" alt="<MT_TRANS phrase="Bold">" width="22" height="16" /></a>');

の上に
write('<a title="<MT_TRANS phrase="DarkRed">" href="#" onclick="return formatColorStr(document.entry_form.text, \'990000\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/darkred.gif" alt="<MT_TRANS phrase="darkred">" width="22" height="16" /></a>');

を追記します。

次に376行目に

write('<a title="<MT_TRANS phrase="DarkRed">" href="#" onclick="return formatColorStr(document.entry_form.text_more, \'990000\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/darkred.gif" alt="<MT_TRANS phrase="darkred">" width="22" height="16" /></a>');

を挿入してください。

3./cgi/mt/mt-static/mt_ja.jsを修正

場所はfunction formatStr (e, v) {の上あたりに

function formatColorStr (e, v) {
if (!canFormat) return;
var str = getSelected(e);
if (!str) return;
setSelection(e, '<font color="#' + v + '">' + str + '</font>');
return false;
}

を追記します。

以上で完成です。

さらに色を追加したい時は
1.ボタンは作成してください。(ペイントで簡単にできます。)
2. /cgi/mt/tmpl/cms/edit_entry.tmplで追加したコードの上に

write('<a title="<MT_TRANS phrase="DarkRed">" href="#" onclick="return formatColorStr(document.entry_form.text, \'990000\')"><img src="<TMPL_VAR NAME=STATIC_URI>images/darkred.gif" alt="<MT_TRANS phrase="darkred">" width="22" height="16" /></a>');

を自分が追加したい色に変更して追加してください。

3.は必要ありません。

おまけ
作業の確認をすると、


 1.表示する画像をアップロードしています。

 2.管理画面のを編集しています。(HTMLにコードを足しているのと同じです。)

 3.javascriptでプログラムを追加しています。


どんな作業をやったかを正しく理解する事で
もうちょっと違った事がやりたい!」とか「動かない…」という事にも対応できるようになります。
大事なことです…



ランキングのご協力をお願いします。


TOPに戻る
■カテゴリ:4.管理画面操作法
△次の記事:エントリーで文字サイズ設定

このエントリーのトラックバックURL:
トラックバックする際は,このブログまたはこの記事へのリンクをお願いします。
貴サイトにリンクがない場合は削除します。

この記事のタイトル : エントリーで色ボタン設定
この記事のリンク用ソース :

コメント




保存しますか?