スタイルシートの構成を変更してみました

mt.VicunaテンプレートのスキンのStylesheetと、カスタマイズしたスタイルとの構成を見直して変えてみることにしました。

既にmt.Vicunaでは新しいスキンが提供されているわけですが(MTテンプレート vicuna - スキン)、ここのブログで切り替えしようかどうか迷ったんですけれども、結局、使い慣れているということから今までのスキン(style-ninja)を使うことにしました。

これまでこちらが追加したスタイルは、<$MTBlogURL$>style.css内に、以下のように書いていました。

@import url(<$MTStaticWebPath$>themes/style-ninja/import.css);
/* add styles */
<MTInclude file="foo.css" />

上記のように追加するスタイルシートは別にカスタムインデックステンプレートで作成して、MTIncludeで取り込んで追加分ファイル側から設定を変更したりなどしていました。

これをこの度、上記のような方法をやめにして、追加スタイルシートを別途作成したうえでlink要素から追加するという書き方に変えました。

追加スタイルのほうですが、index系のテンプレート、アーカイブリスト、記事ページ毎に追加スタイルをそれぞれ設けることとしました。具体的には以下のような形でそれぞれのテンプレートのhead要素内に追記しています。

変更のときはFTPクライアント経由ということでおこなうとします。(カスタムインデックステンプレートを作成してもいいのだけど、今の状況からテンプレートを増やしたくないというか)

インデックステンプレート
  • <link rel="stylesheet" href="<$MTBlogURL$>custom-style_indexes.css" type="text/css" />
アーカイブリストテンプレート
  • <link rel="stylesheet" href="<$MTBlogURL$>custom-style_archivelist.css" type="text/css" />
記事ページテンプレート
  • <link rel="stylesheet" href="<$MTBlogURL$>custom-style_entry.css" type="text/css" />

それと、import.cssですが(旧スキンでは0-import.css)、インポートするスタイルをlayoutとsubSkinの2つのスタイルだけにして、他のファイルはimport.cssに統合させる、としました。5-module.cssについても、利用しているのは今のところグローバルナビゲーションのスタイルのみですので、そのスタイルも統合しました。以上です。