concrete5にtwitter bootstrapをいれてみた

突然、concrete5にtwitter bootstrapを入れてみたらどうなるんだろうと思ってやってみました。

 

テーマフォルダの直下にbootstrap.min.cssを置いて、header.phpに


<link rel="stylesheet" href="<?php echo $this->getThemePath()>/bootstrap.min.css">

と書いてみました。

 

おぉ、ボタンとかテキストボックスなんかが格好よくなっている!!

 

と思ったんですが、テーブルの幅とかずれちゃって元のページが崩れちゃいました。

最初から想定して作ってあれば良かったんでしょうけども、既存のページに入れると思った通りにはできませんね。

 

このページをIE6でみたら、なんかもう…悲惨なページになってしまいました。

後学の為に、「なんとかならんのかなぁ」と調べてみたら Bootstrap-IE6 というものがあるそうです。

さっそくダウンロードしてみたんですが、これはIE6だけ読み込ませたい。

 

というわけでこんな感じにしてみました。

<!-- Bootstrap from Twitter -->
<!--[if !lte IE 6]><![IGNORE[--><![IGNORE[]]>
<link rel="stylesheet" href="<?php echo $this->getThemePath()?>/bootstrap.min.css">
<!--![endif]-->
<!--[if IE 6]>
<linkrel="stylesheet" href="<?php echo $this->getThemePath()?>/ie6.min.css">
<![endif]-->

これでIE6でも普通に見れるページになります。

ただ、やっぱり当初のページとは違ってしまうので、採用は見送ることになりました。