Vorheriger Artikel Nächster Artikel

Kickstrap: Twitters Bootstrap mit Themes und Goodies

Kickstrap basiert auf der neusten Version des HTML5 Frameworks von , bietet aber tolle Erweiterungen, wie z.b. zusätzliche , Icons, Boilerplate Unterstützung und neue JavaScript-Plugins. Wir stellen euch Kickstrap kurz vor.

Kickstrap: Twitters Bootstrap mit Themes und Goodies
Kickstrap Projektseite

Ein zweiter Layer für Bootstrap ohne die Basis zu verändern

Adam Kochanowicz, der sich eigentlich überwiegend mit User Experience Design befasst, hat mit Kickstrap ein Werkzeug für Webentwickler geschaffen, mit dem man auf Basis von Twitters Bootstrap Framework hilfreiche Erweiterungen für Webanwendungen mit HTML5 und CSS3 erhält, ohne den Bootstrap Code anzufassen oder zu beeinträchtigen. Kickstrap beinhaltet den kompletten, aktuellen Bootstrap Code.

Eigentlich wollte Adam Kickstrap, das sich aktuell nach eigenen Angaben noch in unfertigem Zustand befindet, noch gar nicht veröffentlichen. Aber ein paar Leute haben es sich sofort geschnappt und schon angefangen, damit Websites zu bauen und es in PHP und MVC Frameworks zu integrieren. Kickstrap hat sich auch als Release Candidate schon im produktiven und kommerziellen Einsatz bewiesen.

Was Kickstrap mehr kann als Bootstrap

Nur mit Bootstrap entwickelten Websites wird oft vorgeworfen, sie würden alle gleich aussehen. Kickstrap schafft hier Abhilfe und liefert 12 neue Themes, die das Default-Bootstrap-Theme überschreiben. Mit Hilfe von LESS lässt sich ein neues Kickstrap-Theme über Änderungen in nur einer Zeile leicht einbinden. Auch wenn sich die Kickstrap-Themes vom Grundlayout her ebenfalls ähneln, bekommt man in Bezug auf Farben und Schriften eine gute Vorlagenauswahl.

Kickstrap Amelia Theme

Durch die Integration von HTML5 Boilerplate in Kickstrap kann man seine Verzeichnisse schnell optimieren und Workflow-Abläufe werden vereinfacht. Die in Kickstrap enthaltenen HTML-Beispieldateien sind z.B. für Google Analytics, Versionserkennung für den Internet Explorer und HTML5 Polyfilling mittels Modernizr gerüstet.

Die Glyphion Bibliothek in Bootstrap wurde bei Kickstrap durch Icon Fonts mit Font Awesome und IcoMoon ersetzt. Änderungen an Schrift, Größe, Farbe sowie Schatteneffekte sind so viel einfacher umzusetzten.

FontAwesome in Kickstrap

Mit animate.css können in Kickstrap schicke Cross-Browser CSS-Effekte komfortabel eingebunden werden. An zusätzlichen JavaScript-Plugins, die jQuery benötigen,  bringt Kickstrap z.B. Chosen für schicke Select-Boxen oder jGrowl für Benachrichtigungen mit.

Die Installation von Kickstrap ist genauso simpel, wie bei Bootstrap, und kann sowohl „from scratch“ als auch bei bestehenden Bootstrap-Projekten erfolgen. Wer noch nicht mit Bootstrap gearbeitet hat, lädt sich einfach das Kickstrap-Ziparchiv bei GitHub herunter, entpackt es in einen Ordner und kann mit index.html oder sample_index.html loslegen. Bei bestehenden Bootstrap-Projekten wird der /extras Ordner, sample_index.html und bootstrap(.min).css von Kickstrap in die entsprechenden Bootstrap-Verzeichnisse kopiert.

Kickstrap Sample Website

In gerade Mal 4 Monaten hat das Kickstrap Projekt bei GitHub schon über 1.1000 Beobachter. Adam versucht, bald eine offizielle Version v1 von Kickstrap zu veröffentlichen, aber es ist noch Einiges zu tun, wie er schreibt. Da er das ordentlich machen will, legt er sich besser nicht auf einen genauen Zeitpunkt fest.

Weiterführende Links:

Vorheriger Artikel Zurück zur Startseite Nächster Artikel
Eine Antwort
  1. von Tim am 17.07.2012 (11:45Uhr)

    Für solche Artikel lese ich Euren Feed und das Magazin. Top Tipp!

    Antworten Teilen
Deine Meinung

Bitte melde dich an!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Mehr zum Thema Templates
Bootstrap/386: Umfangreiches Bootstrap-Theme im Retro-Look
Bootstrap/386: Umfangreiches Bootstrap-Theme im Retro-Look

Retro-Fetischisten und IT-Liebhaber könnten mit dem neuen „Bootstrap/386“-Theme voll auf ihre Kosten kommen. Damit sehen Webseiten aus wie klassische User-Interfaces in den 80er- und 90er-Jahren. » weiterlesen

Bootstrap 3.1 ist da: Wir zeigen euch die Neuerungen
Bootstrap 3.1 ist da: Wir zeigen euch die Neuerungen

Bootstrap 3.1 steht ab sofort zum Download bereit. Zu den neuen Features gehört unter anderem ein offizieller Sass-Port. » weiterlesen

Bootstrap: Mit diesen 10 Tools und Erweiterungen holst du mehr aus Twitters Framework raus
Bootstrap: Mit diesen 10 Tools und Erweiterungen holst du mehr aus Twitters Framework raus

Bootstrap 3 von Twitter bietet eine ausgezeichnete Grundlage für die Webentwicklung. Wir stellen euch zehn Tools und Erweiterungen vor, mit denen ihr noch mehr aus der aktuellen Version rausholt. » weiterlesen

Kennst Du schon unser t3n Magazin?

t3n-Newsletter t3n-Newsletter
Top-Themen der Woche für Web-Pioniere
Jetzt kostenlos
anmelden
Diesen Hinweis verbergen