ムーバブルタイプが、テンプレート・モジュールやウィジェットをカスタマイズすることによって、さまざまな機能を取り入れられることは先稿で述べたとおりだ。一方、スタイルシートをいじることによって、画面の見栄えをデザインすることができる。
スタイルシートには、blog.css と screen.css の二種類がある。前者は画面の骨格を定義し、後者は詳細な見栄えを定義する。ムーバブルタイプにはさまざまなテンプレートセットが用意されているが、前者はすべてのテンプレートセットに共通して作用し、後者はテンプレートセットごとに異なっている。
従来の 3x ではスタイルシートはひとつしかなかった。そこでは、前段で全体的な定義、後段で個別のテンプレートに応じた定義という形をとっていたのを、 4x は二つに分けることで、操作を分りやすくしたわけだ。もっとも、二つに分けたことで、それを括るための第三のスタイルシートを用意することとなった。管理画面の中で「スタイルシート」と表示されているのは、この第三のスタイルシートである。
ムーバブルタイプが用意しているデフォールトの画面は、なぜか非常に見づらい。文字サイズは小さいし、全体にごちゃごちゃとしている。おそらく英文用に用意した画面設定を、そのまま日本語に翻訳したのだろう。日本人向けに見やすくするためには、是非ともカスタマイズする必要がある。
こんなわけで、筆者はスタイルシートをカスタマイズする作業に取り掛かったが、その際に、「Movable Type カスタマイズブック4.2」(大藤幹著)という本が非常に役に立った。この本はムーバブルタイプの構造を分りやすく説明しており、またローカルフォルダでスタイルシートを編集し、それをサーバーにアップロードする方法も教えてくれる。
詳細はこの本を読んでもらうとして、筆者はまず、ローカルフォルダにデフォールトのスタイルシートを貼り付け、同時にブログのインデックスページを同じフォルダにダウンロードした。こうしておけば、ローカルでカスタマイズした結果が、そのまま同じフォルダで確認できる。満足した結果を得られたら、カスタマイズしたスタイルシートを、サーバーにアップロードすればよい。
いま読者が見られている画面は、こうしたカスタマイズの結果できあがったものだ。
コメントする