MTで記事の投稿を格段に楽にする管理画面のカスタマイズ｜caraldo.net

2007年8月 1日

コメント（0）トラックバック（0） Posted by ; k.

MTで記事の投稿を格段に楽にする管理画面のカスタマイズ

MTでエントリーの投稿をかなり楽にする事ができる管理画面のカスタマイズを2つ程ご紹介。

Movable Type のエントリー編集画面に自由に機能追加できるプラグイン
エントリーの編集画面を横に長くする

この2つのカスタマイズを紹介していきたいと思います。
どちらも簡単に実装可能です。

詳細は以下よりどうぞ。

エントリー編集画面に自由に機能追加できるプラグイン

参照元はMovable Type のエントリー編集画面に自由に機能追加できるプラグイン - blog.aklaswad.comさんです。

このプラグインの実装は非常に簡単です。
その簡単さからは想像できない位便利ですが。

具体的に何ができるかと言うとこのエントリーTOPの画像のように自分でHTML挿入ボタンを作成できるようになります。

例えば当ブログの場合、イメージをポラロイド風に見せる為に少しHTMLを記述しています。

<div class="******"><img alt="******" src="*****" width="***" height="***" /></div>

こんなコードや

<div class="bubblequote_wrap">
<div class="bubblequote clearfix">
<p class="top"><span>&nbsp;</span></p>
<blockquote>引用部分</blockquote>
<p class="bottom"><span>&nbsp;</span></p>
</div>
</div>

こんな複雑なコードもボタン一つで挿入できます。

インストールやボタンの作成方法についてはプラグイン配布元様が完璧なのでそちらをご覧下さい。
ムービーまで完備されております。

※記事の見栄え上、上のコードは改行していますが実際には改行無しで記載しないとJavaScriptが動きません。

エントリーの編集画面を横に長くする

続いてエントリーの編集画面を横に長くするカスタマイズです。

エントリーの編集フィールドが横に短く勝手に折り返してしまうのがどうにも気に入りませんでした。
何かないか探していたところ見つけましたので早速実践。

こちらも作業としてはなんら難しい点はありません。

参照元はエントリーの編集画面を横に長くする-Movable Type3.3編 (河口湖wiki)

3．3編とありますが、3．5でも問題ありませんでした。

編集するファイルは/mt-static/styles.cssです。
管理画面に適用されているCSSの編集作業です。

以下参照先様より引用です。数値を青字部分に変更します。

24行目
.body-wrap {
width: 750px; --> 950px;
}
32行目
.body-nav {
float: left;
margin: 0 0 15px 15px;
width: 625px; --> 825px;
}
1663行目
#edit-template input.wide,
#edit-category input.wide {
width: 300px; --> 500px;
}
1668行目
#edit-template textarea.wide,
#edit-category textarea.wide {
width: 618px; --> 818px;
margin: 0;
}
2141行目
#edit-entry .field-wrapper,
#edit-template .field-wrapper {
width: 573px; --> 773px;
border: 1px solid #8FAEBE;
padding: 9px;
background-color: #EAF2FF;
}
2177行目
#edit-entry .textarea-wrapper textarea#text { width: 571px; } --> 771px;
#edit-entry .textarea-wrapper textarea#text_more { width: 571px; } --> 771px;
#edit-entry .textarea-wrapper textarea#excerpt { width: 591px; height: 66px; } --> 791px;
#edit-entry .textarea-wrapper textarea#keywords { width: 591px; height: 34px; } --> 791px;
#edit-entry .textarea-wrapper input#tags { width: 591px; } --> 791px;
#edit-template .textarea-wrapper textarea#text { width: 603px; } --> 803px;