回転MovableType

<HTML> <HEAD> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>エントリーの表示</TITLE> <LINK rel="stylesheet" href="styles-site.css" type="text/css"> </HEAD> <BODY> <div id="id_body"> <div id="id_header">ヘッダー</div> <div id="id_main"> <div id="id_left"> レフト </div> <div id="id_right"> <MTEntries> <p> <$MTEntryDate$><br/> <div id="entry_title"> <h2><$MTEntryTitle$></h2> </div> <div id="entry_body"> <$MTEntryBody$> </div> <br /> </p> </MTEntries> </div> </div> <div id="id_footer">フッター</div> </div> </BODY> </HTML>

スタイルシート

* { margin : 0 ; padding : 0 ; } body { width : 100% ;background-color: #4FBF3F;} #id_header { width : 100% ; height : 55px ; background-color:#839F5F;} #id_footer { width : 100% ; clear : both ; background-color:#839F5F; } #id_body { margin: 0 auto; width : 700px ; } #id_left { float : left ; width : 160px ; background-color:#1FC7DF;} #id_right { float : left ; width : 540px ; background-color:#D0D0D0;} #entry_body { border: medium red dotted; } #entry_title { background-color:#CCFFFF;}

これで下記のようになります。

（クリックで拡大）
http://d.hatena.ne.jp/tgenji/20070619

Permalink
by
at 12:39
in テンプレート
Comments (0)
Trackbacks (0)

エントリー時の設置

マニュアルにエントリー時に「カテゴリー指定ができる」とあるのに
できていませんでした。

エントリー時の画面下の
「画面の表示設定を変更」
で
設定が変更できました。

これでMovableTypeでエントリー時に以下が指定できます。

カテゴリー指定
追記
抜粋
キーワード
タグ
日付
改行設定
出力ファイル名
コメントを受信
トラックバックを受信
トラックバック送信先URL

(画像クリックで拡大します)

知らなんだ。
http://d.hatena.ne.jp/tgenji/20070618

Permalink
by
at 08:40
in MovableType
Comments (0)
Trackbacks (0)

MovableTypeの2カラムレイアウト

MovableTypeの2カラムレイアウトを手作りします。

テンプレートのメインページとスタイルシートを設定します。

（画像をクリックすると拡大されます。）

メインページを以下のように設定します。

<HTML> <HEAD> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>MovableTypeの2カラムレイアウト</TITLE> <LINK rel="stylesheet" href="styles-site.css" type="text/css"> </HEAD> <BODY> <div id="id_body"> <div id="id_header">ヘッダー</div> <div id="id_main"> <div id="id_left"> レフト </div> <div id="id_right"> <MTEntries> ～ </MTEntries> ライト </div> </div> <div id="id_footer">フッター</div> </div> </BODY> </HTML>

スタイルシートを以下のように設定します。

* { margin : 0 ; padding : 0 ; } body { width : 100% ;background-color: #4FBF3F;} #id_header { width : 100% ; height : 55px ; background-color:#839F5F;} #id_footer { width : 100% ; clear : both ; background-color:#839F5F; } #id_body { margin: 0 auto; width : 700px ; } #id_left { float : left ; width : 160px ; background-color:#1FC7DF;} #id_right { float : left ; width : 540px ; background-color:#D0D0D0;}

こんな画面になります。

（画像をクリックすると拡大されます。）
実用までにはだいぶ遠いですが、骨組みがわかりました。