Drücke die Tasten ◄ ► für weitere Artikel  

Kickstrap: Twitters Bootstrap mit Themes und Goodies

Kickstrap basiert auf der neusten Version des HTML5 Frameworks Bootstrap von Twitter, bietet aber tolle Erweiterungen, wie z.b. zusätzliche Themes, Font Icons, HTML 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 und CSS3 erhält, ohne den Code anzufassen oder zu beeinträchtigen. Kickstrap beinhaltet den kompletten, aktuellen 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 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. 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:

85 Shares bis jetzt – Dankeschön!

Bewerten
VN:F [1.9.22_1171]
2 Antworten
  1. von Tim am 17.07.2012 (11:45Uhr)

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

  2. von Bootstrap 3 veröffentlicht: Das kann di… am 20.08.2013 (11:37Uhr)

    […] Kickstrap: Twitters Bootstrap mit Themes und Goodies – t3n News […]

Deine Meinung

Bitte melde dich an!

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

Jetzt anmelden

Mehr zum Thema Font
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

Font Awesome: Das ist neu in Version 4.0 des Icon-Fonts
Font Awesome: Das ist neu in Version 4.0 des Icon-Fonts

Font Awesome ist eine der beliebtesten kostenlosen Icon-Fonts. Vor Kurzem ist die neue Version 4.0 erschienen. Wir verraten dir, was sich geändert hat. » weiterlesen

Bootstrap 3 vs. Foundation 5: Die Top-Frameworks im ersten Vergleich
Bootstrap 3 vs. Foundation 5: Die Top-Frameworks im ersten Vergleich

Heute zeigen wir euch, was die größten Unterschiede dieser beiden Frameworks sind. Im kommenden „Bootstrap 3 vs. Foundation 5“-Teil zeigen wir euch, wie sich die Frameworks im „Prototyping“ ... » weiterlesen

Kennst Du schon unser t3n Magazin?

t3n 35 jetzt kostenfrei probelesen! Alle Inhalte des t3n Magazins Diesen Hinweis verbergen