typoの1記事表示がIEだと表示できない
typoの1記事をクリックして表示させる場合、titleタグに日本語が入ってるとIEだとページが真っ白に表示される。原因はtitleタグが"charset=utf-8"よりも先に来ていて文字コードの認識に失敗して文字化けしてしまうから。 まぁ、解決方法は簡単に言うと以下なんだけれども、IEも、もうちょっとなんというか気を使ってもらえるとたすかるんだけどな。
解決方法
page_headerをtitleよりも先に持ってくる。
<head>
- <title><%=h page_title %></title>
<%= page_header %>
+ <title><%=h page_title %></title>
<%= stylesheet_link_tag "/stylesheets/theme/styles", :media => 'all' %>
<%= stylesheet_link_tag "/stylesheets/theme/local", :media => 'all' %>
</head>
typoの場合だと、スキンデザインがthemesディレクトリに入っているので、その中のlayoutsディレクトリのdefault.rhtml(つまり、「themes/使用しているスキン名/layouts/default.rhtml」ファイル)をいじればOK
メンドイのは新しいスキンをどこから取ってきて試すたびに、該当部分だけは直さなきゃいけないところ。
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ファイルを作成して置き換え
3で出来たものをブラウザに表示させて、スクリーンキャプチャ。
ほとんどのものは256 X 210程度で作成されている模様なので、
それにあわせる(もちろん、大きい画像でもリサイズされるが、
画像の左上の部分だけが表示されるようにリサイズされてしまう。。。)
できたものを新しいpreviewpngとして既存のものと置き換える
5. about.markdownファイルを書き換える
ここは、自由に書いてよいみたいです。
ここまで出来たら、あとは、このディレクトリごとまるまる、 themeディレクトリにコピーすればOKです。 themeタブから、preview.pngで作成した画像が閲覧できて、Activate出来るよう になってると思います。
やってみた感想は、シンプルなもので済ませようとすれば、非常に簡単だって事ですね。 layoutsディレクトリにあるlayouts.rhtmlをいじったり、画像なども作って凝ったのにしたいのですが、まだ、そこまでRailsや、デザイン(画像作るとなるとPhotoShopですよね?)知識があるわけでもないので、とりあえずは、この辺りにしとく予定です。 こんご少しずつ、ブラッシュアップしていく予定。。(あくまでも予定。)
typo4.0.3をインストールメモ
あとで詳細書きますが、メモ。
public以下に.htaccessが無いので、自前で用意する必要があった。
dispatch.fcgiには
require ‘fcgi_handler’ しか記載がなく、動いていないみたいだったので、
require ‘rubygems’
require_gem ‘fcgi’
を書き加える必要があった