typo の skinを作成する

typoのskinを自作する事にした。　

日頃、ネットワーク、サーバ管理が主なので、CSS,xhtmlと触った事が無いものばかりだったが、すごいシンプルなものでOKだった(むしろシンプルにしたかった)のでいけるだろうと。。。。

ということで、がんばってみました。 参考にしたのは、 Typo tutorial
version 2.5 ですが、最新版である4.0.3でも基本的に同じです。

1. 他themeをコピー

デフォルトで入っているazureあたりのものをそのままコピー。

2. 各ディレクトリをチェック

images,javascriptディレクトリの中にあるものは今回使わないので削除

3. stylesheetsディレクトリの

style.cssをいじる

• サイトのwidthを920pxに
• divタグ、navigationとsearchを左に寄せる
• 色を#cc0に

4. preview.pngファイルを作成して置き換え

３で出来たものをブラウザに表示させて、スクリーンキャプチャ。
ほとんどのものは256 X 210程度で作成されている模様なので、 それにあわせる(もちろん、大きい画像でもリサイズされるが、 画像の左上の部分だけが表示されるようにリサイズされてしまう。。。)

できたものを新しいpreviewpngとして既存のものと置き換える

5. about.markdownファイルを書き換える

ここは、自由に書いてよいみたいです。

ここまで出来たら、あとは、このディレクトリごとまるまる、 themeディレクトリにコピーすればOKです。 themeタブから、preview.pngで作成した画像が閲覧できて、Activate出来るよう になってると思います。　

やってみた感想は、シンプルなもので済ませようとすれば、非常に簡単だって事ですね。 layoutsディレクトリにあるlayouts.rhtmlをいじったり、画像なども作って凝ったのにしたいのですが、まだ、そこまでRailsや、デザイン(画像作るとなるとPhotoShopですよね?)知識があるわけでもないので、とりあえずは、この辺りにしとく予定です。 こんご少しずつ、ブラッシュアップしていく予定。。(あくまでも予定。)