Seite 1 von 1
Twitter Bootstrap
Verfasst: Mi 2. Apr 2014, 11:07
von shadowcat
Für diejenigen, die mal mit Twitter Bootstrap experimentieren möchten, hier die notwendigen Basis-Komponenten als Template.
Das Template beinhaltet die aktuelle Version als *min* sowie die Beispiele Jumbotron ("default") und Fixed Top ("fixedtop") als Varianten. Bei Fixed Top habe ich eine Kombination mit Jumbotron gebaut, das heißt die Variante basiert auf "default". Ihr könnt das als Vorlage nehmen oder eine komplett eigene Variante bauen. Beide Varianten haben zwei Inhaltsblöcke.
Zum Erstellen einer eigenen Variante legt man unterhalb von ./templates/bootstrap/templates ein neues Unterverzeichnis an, das die Template-Dateien beinhaltet. Dann die Variante in der info.php unter $template_variants eintragen und schon kann man sie im Backend auswählen.
Alternativ kann man auch das komplette Template als Vorlage nehmen und ein ganz eigenes, neues Template erstellen.
Edit 2016-06-08: Es gibt Bootstrap auch als Bibliotheks-Modul im Addons-Bereich.
http://blackcat-cms.org/page/add-ons/or ... em&item=96
Aus dem Template heraus einfach referenzieren mit:
Code: Alles auswählen
<link rel="stylesheet" href="{$CAT_URL}/modules/lib_boostrap/vendor/css/bootstrap.min.css" type="text/css" media="all" />
Alternativ eine headers.inc.php verwenden.
http://wiki.blackcat-cms.org/doku.php?i ... pl:headers
Re: Twitter Bootstrap
Verfasst: Mi 2. Apr 2014, 11:09
von shadowcat

- 2014-04-02_120747.png (34.66 KiB) 7648 mal betrachtet
Variante "Fixed Top" mit Dropdown-Menü und zweitem Content Block. Der "graue Balken" oben (Text "DUMDUDUM") verschwindet komplett, wenn der zweite Content Block leer ist.
Re: Twitter Bootstrap
Verfasst: Mi 2. Apr 2014, 11:26
von ralf
Das kitFramework liefert zu Bootstrap ein wenig Unterstützung, in:
Code: Alles auswählen
/kit2/extension/phpmanufaktur/phpManufaktur/Library/Helper/bootstrap/navbarlinks/1.0.0/
findet ihr die Datei
Diese ermöglicht die Umsetzung von responsive Navbar Links:
Code: Alles auswählen
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-ex1-collapse">
<?php
require_once WB_PATH.'/kit2/extension/phpmanufaktur/phpManufaktur/Library/Helper/bootstrap/navbarlinks/1.0.0/navbarlinks.php';
navbarlinks(2, 0, true);
?>
</div><!-- /.navbar-collapse -->
entsprechend
diesem Bootstrap Beispiel (mit show_menu2() lässt sich das nicht umsetzen).
Wer sich für dieses Thema interessiert sei auch ganz herzlich in die
Internet Usergroup am 03.04.2014 eingeladen, das Thema ist:
Mit Bootstrap Templates für WebsiteBaker, LEPTON CMS und BlackCat CMS erstellen
Gruß
Ralf
Re: Twitter Bootstrap
Verfasst: Mi 2. Apr 2014, 14:13
von shadowcat
Cool, dann kannst Du das Ergebnis ja auch noch hier posten.

Re: Twitter Bootstrap
Verfasst: Fr 4. Apr 2014, 10:48
von ralf
Hier wie versprochen das Template, das gestern in der Internet Usergroup entstanden ist.
Das Template kann natürlich nicht den Abend wiedergeben, wir haben uns intensiv mit dem Grid System beschäftigt und uns die vielen Möglichkeiten angesehen, die Bootstrap bietet.
EDIT: Anhang entfernt -
siehe aktuelleren Beitrag
Gruß
Ralf
Re: Twitter Bootstrap
Verfasst: Mo 7. Apr 2014, 09:56
von shadowcat
Das sollte vielleicht in den Anforderungen stehen...
Unknown error type:
[2] require_once(/abs/path/to/kit2/framework/symfony/translation/Symfony/Component/Translation/TranslatorInterface.php): failed to open stream: No such file or directory
Re: Twitter Bootstrap
Verfasst: Mo 7. Apr 2014, 10:00
von ralf
shadowcat hat geschrieben:Das sollte vielleicht in den Anforderungen stehen...
Unknown error type:
[2] require_once(/abs/path/to/kit2/framework/symfony/translation/Symfony/Component/Translation/TranslatorInterface.php): failed to open stream: No such file or directory
Mein Fehler! Das fiel mir leider erst hinter her auf, dass das kitFramework ja zwingend erforderlich ist ... ich bin gerade dabei die nächste Version der NavbarLinks fertig zu stellen und schreibe an der Dokumentation dazu, Sorry!!!
Gruß
Ralf
Re: Twitter Bootstrap
Verfasst: Di 8. Apr 2014, 08:43
von ralf
Ich habe mich noch mal mit den NavbarLinks() für Bootstrap beschäftigt und eine neue Release freigegeben.
- Diese neue Release trennt Code und Ausgabe sauber, d.h. die gesamte HTML Ausgabe kann bei Bedarf angepasst werden,
- NavbarLinks() setzt Klassen für den ersten und letzten Menueintrag der jeweiligen Ebene
- Ein Schmankerl: Es können Icons (Glyphicons aus Bootstrap oder Icons aus Font Awesome) oder auch Grafiken für die Menueinträge zugewiesen werden
In diesem Zusammenhang habe ich dann auch ein Beispiel Template erstellt und mir ein wenig Mühe mit der Dokumentation gegeben:
Artikel zu NavbarLinks
Beispiel Template, installierbar
README mit allen wichtigen Erläuterungen und Angabe der Parameter
Gruß
Ralf
Re: Twitter Bootstrap
Verfasst: Di 8. Apr 2014, 09:30
von shadowcat
Super Sache! Damit dürfte Bootstrap in BC nichts mehr im Wege stehen.
