3カラムデザインをStyleCatcherで10秒で実現しよう
This entry is posted by melondog at 2007-02-23 (金) 01:47
filed under Movable Type 3.3 3カラム Movable Type StyleCatcher WidgetManager
10秒というのはいいすぎですが・・・
効率よくページに情報を詰め込むには、いつかしら3カラム(3段組)のページデザインが必要だと感じていたんですが。ぶっちゃけどうやればいいのかよくわかりませんでした。
しかし今回不意に実現できました。
プロセスは
- Movable Type 3.2以上のデフォルトテンプレートを用意
- あらかじめWidgetManagerで3段目の内容を(モジュールを)用意しておく
- StyleCatcherの初期設定をする
- StyleCatcherで適当にスタイルを選ぶ(※ここで適用したスタイルのCSSファイルが3カラムをサポートしていることが条件です)
- 各テンプレートに3つ目のカラム(段組)のHTMLの記述を書き加える
こんな感じです。
僕の場合、1はTemplate Backup and Refreshを使い各テンプレートを初期化しました。2に、WidgetManagerにとりあえず「カレンダー」と「Powerd By」を入れました。3はすでにStyleCatcherの設定は以前に終えていまして。4ではthe style contestのリポジトリ(http://www.thestylecontest.com/browse)のものから、「Minimal」というテーマ(作者paolo cremaschi 作者HP)を選びました。このスタイルではCSSファイルで3つ目のカラム「#gamma」も言及されていました。5の段階では各テンプレートにHTMLの記述をちろっと書き加えます。
<div id="gamma">
<div id="gamma-inner" class="pkg">
<$MTWidgetManager name="Widget Managerの名前"$>
</div>
</div>
この5行だけです。
これで3カラムのページにとりあえずなりました。10秒どころか1時間かかっちゃうかもしれません凹○コテッ
- Previous Entry
テンプレートを差し替えたら・・ - Next Entry
都心、この冬は雪ゼロ。
- Trackback URL


Leave Your Words