Yii Bootstrap
Das Yii Bootstrap von Christoffer Niska macht es auf einfache Weise möglich, das Twitter Bootstrap in Yii Projekten zu verwenden. Das Twitter Bootstrap ist eine Sammlung von CSS Befehlen, die schon ein recht gutes Layout vorgeben. Es gab eine Zeit lang, da hat sich das Twitter Bootstrap ohne Ende verbreitet und jeder wollte es verwenden. Auch heute gibt es immer mehr Anhänger des Twitter Bootstrap. Was im Twitter Bootstrap unabhängig von dem Yii Bootstrap enthalten ist, kann man auf der Twitter Bootstrap Webseite sehen.
Das Yii Bootstrap kann von der Webseite heruntergeladen werden. Anschließend wird das Zip-Archiv entpackt und in das Verzeichnis /protected/extensions/bootstrap verschoben. Wenn man die Standard Themes des Yii Bootstrap verwenden möchte, so kann man das Theme Verzeichnis in das /themes Verzeichnis von Yii kopiert werden.
Da das Yii Bootstrap auch schon viele vorgefertigte Yii-Widgets mitliefert, muss in der Konfiguration natürlich noch etwas hinzugefügt werden:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | Yii::setPathOfAlias('bootstrap', dirname(__FILE__).'/../extensions/bootstrap'); return array( 'theme'=>'bootstrap', // requires you to copy the theme under your themes directory 'modules'=>array( 'gii'=>array( 'generatorPaths'=>array( 'bootstrap.gii', ), ), ), 'components'=>array( 'bootstrap'=>array( 'class'=>'bootstrap.components.Bootstrap', ), ), ); |
Wichtig ist hier die erste Zeile mit der der Pfad für die Bootstrap Widgets gesetzt werden.
Darüber hinaus bietet Yii Bootstrap auch noch einen Gii-Crud-Generator an,der ebenfalls mit obenstehender Konfiguration eingebunden wird. Wenn wir uns jetzt in unser Gii einloggen, finden wir als untersten Menüpunkt den Yii Bootstrap Gii Generator. Wir können also, wie wir es von Yii schon gewohnt sind, auch mit Gii uns Code generieren lassen, der anschließend mit Yii Bootstrap Widgets ausgeliefert wird.
Im Layout muss das Yii Bootstrap mit folgendem Befehl eingebunden werden:
1 | Yii::app()->bootstrap->register(); |
Wenn wir jetzt unsere Stylesheet Dateien ganz normal einbinden, wie wir es gewohnt sind, werden wir feststellen, dass das Yii Bootstrap nach unseren fest eingebundenen Stylesheet Dateien eingebunden wird. Dies ist allerdings manchmal nicht ganz sinnvoll, da man ja nicht immer genau den Style des Twitter Bootstrap haben möchte, sondern auf die Formatierung in der Webseite selbst Hand anlegen möchte. Hier habe ich folgenden Weg gefunden, um das Yii Bootstrap einzubinden und doch anschließend noch meine eigene CSS-Datei:
1 2 3 4 | Yii::app()->bootstrap->register(); $baseUrl = Yii::app()->baseUrl; $cs = Yii::app()->getClientScript(); $cs->registerCssFile($baseUrl.'/css/style.css'); |
Wenn ich mein Stylesheet nach diesem Schema einbinde, habe ich keine Probleme mehr und kann in meinem Stylesheet nun die Styles des Yii Bootstrap überschreiben.
Wer hat das Yii Bootstrap schon einmal eingesetzt und kennt es schon bzw. hat damit schon Erfahrungen gemacht?
Schreibe einen Kommentar