Nobuo Kihara
10 years ago
5 changed files with 97 additions and 0 deletions
@ -0,0 +1,27 @@ |
|||||||
|
Yii 2 Twitter Bootstrap エクステンション |
||||||
|
======================================== |
||||||
|
|
||||||
|
このエクステンションは、マークアップとコンポーネントのフレームワーク [Bootstrap 3](http://getbootstrap.com/) ("Twitter Bootstrap" としても知られています) に対するサポートを提供します。 |
||||||
|
Bootstrap は優れた、レスポンシブなフレームワークであり、クライアント側の開発プロセスを大いにスピードアップすることが出来るものです。 |
||||||
|
|
||||||
|
Bootstrap のコアは二つの部分によって表されます。 |
||||||
|
|
||||||
|
- CSS の基礎。例えば、グリッド・レイアウト・システム、タイポグラフィ、ヘルパ・クラス、レスポンシブ・ユーティリティなど。 |
||||||
|
- そのまま使えるコンポーネント。フォーム、メニュー、ページネーション、モーダル・ボックス、タブなど。 |
||||||
|
|
||||||
|
|
||||||
|
始めよう |
||||||
|
-------- |
||||||
|
|
||||||
|
* [インストール](installation.md) |
||||||
|
* [基本的な使用方法](basic-usage.md) |
||||||
|
|
||||||
|
使用方法 |
||||||
|
-------- |
||||||
|
|
||||||
|
* [Yii ウィジェット](usage-widgets.md) |
||||||
|
|
||||||
|
追加のトピック |
||||||
|
-------------- |
||||||
|
|
||||||
|
* [Bootstrap の .less ファイルを直接に使う](topics-less.md) |
@ -0,0 +1,17 @@ |
|||||||
|
基本的な使用方法 |
||||||
|
================ |
||||||
|
|
||||||
|
Yii は bootstrap の基礎を PHP コードでラップすることをしていません。 |
||||||
|
なぜなら、この場合の HTML コードがそれ自体として非常にシンプルだからです。 |
||||||
|
bootstrap の基礎を使用することに関する詳細は、[bootstrap ドキュメントウェブサイト](http://getbootstrap.com/css/) で見ることが出来ます。 |
||||||
|
それでも、Yii はあなたのページに bootstrap のアセットをインクルードするための便利な方法を提供しています。 |
||||||
|
`@app/assets` ディレクトリに配置されている `AppAsset.php` に一行を加えるだけで大丈夫です。 |
||||||
|
|
||||||
|
```php |
||||||
|
public $depends = [ |
||||||
|
'yii\web\YiiAsset', |
||||||
|
'yii\bootstrap\BootstrapAsset', // この行です |
||||||
|
]; |
||||||
|
``` |
||||||
|
|
||||||
|
Yii のアセットマネージャによって bootstrap を使うと、必要に応じて、bootstrap のリソースを最小化したり、あなた自身のリソースと結合したりすることが出来ます。 |
@ -0,0 +1,18 @@ |
|||||||
|
インストール |
||||||
|
============ |
||||||
|
|
||||||
|
## Composer パッケージを取得する |
||||||
|
|
||||||
|
このエクステンションをインストールするのに推奨される方法は [composer](http://getcomposer.org/download/) によるものです。 |
||||||
|
|
||||||
|
下記のコマンドを実行してください。 |
||||||
|
|
||||||
|
``` |
||||||
|
php composer.phar require --prefer-dist yiisoft/yii2-bootstrap |
||||||
|
``` |
||||||
|
|
||||||
|
または、あなたの `composer.json` ファイルの `require` セクションに、下記を追加してください。 |
||||||
|
|
||||||
|
``` |
||||||
|
"yiisoft/yii2-bootstrap": "~2.0.0" |
||||||
|
``` |
@ -0,0 +1,16 @@ |
|||||||
|
Bootstrap の .less ファイルを直接に使う |
||||||
|
======================================= |
||||||
|
|
||||||
|
あなたが [Bootstrap CSS をあなたの less ファイルに直接含める](http://getbootstrap.com/getting-started/#customizing) ことを望む場合は、オリジナルの CSS ファイルがロードされないように無効化する必要があります。 |
||||||
|
[[yii\bootstrap\BootstrapAsset|BootstrapAsset]] の `css` プロパティを空に設定することによって、そうすることが出来ます。 |
||||||
|
そのためには、`assetManager` [アプリケーション・コンポーネント](https://github.com/yiisoft/yii2/blob/master/docs/guide-ja/structure-application-components.md) を以下のように構成します。 |
||||||
|
|
||||||
|
```php |
||||||
|
'assetManager' => [ |
||||||
|
'bundles' => [ |
||||||
|
'yii\bootstrap\BootstrapAsset' => [ |
||||||
|
'css' => [], |
||||||
|
] |
||||||
|
] |
||||||
|
] |
||||||
|
``` |
@ -0,0 +1,19 @@ |
|||||||
|
Yii ウィジェット |
||||||
|
================ |
||||||
|
|
||||||
|
複雑な bootstrap コンポーネントのほとんどは Yii ウィジェットでラップされて、より堅牢な構文を与えられ、フレームワークの諸機能と統合されています。 |
||||||
|
全てのウィジェットは `\yii\bootstrap` 名前空間に属します。 |
||||||
|
|
||||||
|
- [[yii\bootstrap\ActiveForm|ActiveForm]] |
||||||
|
- [[yii\bootstrap\Alert|Alert]] |
||||||
|
- [[yii\bootstrap\Button|Button]] |
||||||
|
- [[yii\bootstrap\ButtonDropdown|ButtonDropdown]] |
||||||
|
- [[yii\bootstrap\ButtonGroup|ButtonGroup]] |
||||||
|
- [[yii\bootstrap\Carousel|Carousel]] |
||||||
|
- [[yii\bootstrap\Collapse|Collapse]] |
||||||
|
- [[yii\bootstrap\Dropdown|Dropdown]] |
||||||
|
- [[yii\bootstrap\Modal|Modal]] |
||||||
|
- [[yii\bootstrap\Nav|Nav]] |
||||||
|
- [[yii\bootstrap\NavBar|NavBar]] |
||||||
|
- [[yii\bootstrap\Progress|Progress]] |
||||||
|
- [[yii\bootstrap\Tabs|Tabs]] |
Loading…
Reference in new issue