- 2005-03-29 (火) 2:22
- MovableType
なんとなくブログを桜色に染めてみたかったのでスタイルシートをいじっていました。
しかしながら通常だと、一つのスタイルシートしか使えないので、元々使っていたスタイルシートを破棄せねばなりません。
それはそれでありですが、少々悲しいので切り替える方法はないものかと調べてみるとありました。
こちらに解説がありますが、JavaScriptを使って結構簡単にできそうです。
左サイドバーのFeedMeterの下あたりに切り替えリンクがあるので試してみてください。
(リンクが適当なのは気のせいです）
2005/03/29 追記
切り替えリンクをバナーボタンにしてみました。
以下メモ書き
こちらのサイトからスタイルシート切り替えスクリプトをゲットします。
Download styleswitcher.jsというリンクがあるので右クリックして「リンク先を保存」で保存したあと、自分のブログのrootにUPしておきます。
で、とりあえず 新しく作ったスタイルシートをMTのテンプレートとして追加します。
「テンプレートの編集＞新しいインデックス・テンプレートを作る」として、テンプレートの名前はわかりやすい名前に、出力ファイル名はsite-style-cherry.css、再構築のチェックは外しました。
その次にスタイルシートを使うページ（インデックス、個別アーカイブ、カテゴリなど）のテンプレートに以下を追記します。
・ヘッダのlinkタグがあるあたりに追加
<link rel=”stylesheet” href=”<$MTBlogURL$>styles-site.css” type=”text/css” title=”Default” />
<link rel=”alternate stylesheet” href=”<$MTBlogURL$>styles-site-cherry.css” type=”text/css” title=”Cherry” />
<script type=”text/javascript”src=”<$MTBlogURL$>styleswitcher.js”></script>
・サイドバーのどこかに追加
<!– Style Sheet –>
<div class=”sidetitle”>
Style Sheet
</div>
<div class=”side”>
<a href=”#” onclick=”setActiveStyleSheet(‘Default’); return false;”>Default</a><br />
<a href=”#” onclick=”setActiveStyleSheet(‘Cherry’); return false;”>Cherry</a><br />
</div >
これで 全アーカイブを再構築すれば完了
Comments:0
Trackbacks:0
- Trackback URL for this entry
- http://blog.eternalmiracle.net/taka/archives/2005/03/29-022246/trackback
- Listed below are links to weblogs that reference
- スタイルシートの切り替え from eternal miracle blog mode
