style-free | Webデザイナーのヒヨコ

自分でも欲張りすぎかなぁと思うのですが、やるなら全てやりたい！！

ブログと言えば、MovableType
じゃ、これも設置しちゃいましょう♪
ということで～。

http://style-free.biz/blog

ちょっと時間は掛かりましたが
過去に何度もCGIの掲示板をUPした経験があるので、結構スムーズに設置はできました。

「あとはデザインをCSSで！」ってここからが本番なんですよね～。(^^;)

さぁ、いよいよ（？）デザインの変更開始！
まずは、タイトルバナーに画像を表示させましょう♪

はじめに、画像の用意。
サイズを決めて、Photoshopで7１0px×150pxのバナーを用意しました。
（サイズは自由）

画像ができたら、CSSファイルのあるフォルダにFTPでアップロード
UPできたら、CSSのレイアウト。
赤字の部分を追加します。

#banner {
width: 710px; /* necessary for ie win */
background-image: url("画像ファイル名");
background-position: left top;
background-repeat: no-repeat;}

アップロードが完了したら、リロードしてみましょう。
バナー部分の画像が変わっていたら成功！

タイトルやサブタイトルのカラーやフォントサイズも画像に合わせて変更すればなおGOOD♪

ヘッダータイトルは
#banner-header {
margin: 0;
color: #fff;
font-size: 20px;
font-weight: bold;
line-height: 1;
text-shadow: #36414d 0 2px 3px;
}

サブタイトルは
#banner-description {
margin-top: 5px;
margin-bottom: 0;
color: #666;
background: none;
font-size: 12px;
font-weight: bold;
line-height: 1.125;
text-shadow: #36414d 0 1px 2px;
}

赤字の部分を変更すればOK。

データベースをSQLiteに移行しようとして失敗。
データベースファイルのバックアップ の取り方が間違っていました。
もっとちゃんと調べてからすれば失敗しなかったかもしれないのですが…

デフォルトからやり直しです。
コメントくださってた方、申し訳ありません。

１から出直します。

とりあえず、エントリーとコメントを手作業で戻しました。
デザインのカスタマイズはこれから…
一度やったことなのに、もう忘れてる自分が悲しいよぉー！
途中になっているので、かなり見苦しいですがお許しを…
できるだけ早めに元に戻します。

「ま、こうやって何回も繰り返すことで覚えるのよ♪」と言い訳がましく思ってみたり。
皆さんの優しいお心遣いに感謝！

明日（いや、もう今日ですが）はWEBスタンダードの最後の授業です。
でもここからが始まり。
自分との戦いに負けないよう、常にお尻に火をつけておこうっと。

StyleCatcherというプラグインを使ってみました。
簡単にデザイン変更ができるので、おもしろいかも～

さらに勢いで、追記部分をJavascriptでページジャンプしないように変更。
MovableTypeを攻略せよ！ を参考にさせて頂きました。

そそ、それからようやくMTを3.3にバージョンアップしました。