CakePHPでBootstrapを使ってみた
最新のアプリ・Webサービスを紹介するサービスサファリを運営しています。
今さらですが、Bootstrapを使ってみました。
興味のある技術とSEO施策の検証用に、カフェの検索サービスCakePHPで開発し、ここに適用してみました。まだまだ途中ですが。
Bootstrapのダウンロードはこちらからできます。
ダウンロードファイルを解凍したら、css、jsファイルをwebroot配下のフォルダにコピーします。
default.ctp内で以下のように記述すれば、すぐに適用されます。調整しないと色々崩れてしまいますが。
<link href="css/bootstrap.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
導入した段階で、既にフォームがかっこ良くなっています。
角丸かつフォーカス中のフォームの縁が蒼色に!
ボタンも簡単に追加できます。
<buttonclass="btn btn-large btn-primary"type="button">登録する</button>
Cakeのヘルパーを使うと以下の様な記述です。
<?= $form->end(array('label' => '登録する', 'class' => 'btn btn-large btn-primary')); ?>
他にも色々適用してみようと思います。