3. Bootswatchなどからデザイン設定済みファイルを入手する
最後にテーマを入手する方法について紹介します。
Bootstrapのフリーテーマを配布しているBootswatch
Bootswatchは、テーマをオープンソースで開発／配布しているサイトです。Bootswatchでは15パターンにわたるテーマが公開されておりプレビューを見ることができます。テーマを適用するには、Bootstrap.cssをダウンロードして、Webサイトの同ファイルを上書きして保存するだけです。
Bootswatchのuniteテーマを適用して赤色に変更
ここでは、Uniteというテーマをダウンロードして、赤系のデザインに変更しました。CSSだけではなくLESSファイルも入手することができるため、BootswachをベースにしてLESSで拡張していくことも可能です。
有償テーマを配布しているWrapBootstrap
有償で販売されているテーマも存在します。WrapBootstrapというサイトでは、Bootstrap対応のデザインテンプレートが数多く公開されています。1サイト用、複数サイト用、再販用という3つの価格帯に分かれていますが、1サイト用であれば数ドルと値段も安いので、テンプレートを購入することを検討してもよいでしょう。
最後に
以上、Bootstrapの基本について説明してきました。Bootstrapでは、ページを簡単にデザインできることが理解できたと思います。今回はASP.NET MVCのひな形で使用されている機能を中心に説明してきましたが、Bootstrapには多くの部品が提供されています。公式サイトは英語ですが、分かりやすい構成になっているので、一度目を通してみると良いでしょう。今後、ASP.NETでWebページを作るときにはBootstrapの活用を検討してみてはいかがでしょうか。
参考資料
- Bootstrap 公式サイト （英語）
- @font-face（ウェブフォント）の利用（Adobe）
- LESSで3倍ラクするスマートフォンコーディング（Gihyo.jp）
