Allgemein, CSS, xHTML, JS, Entwicklung, Webküche

Theme für Mantis Bugtracker

MantisBT ist eines meiner Werkzeuge zum Tracken von Bugs und Entwicklung. In dem Zusammenhang nutze ich ein eigenes Theme seit vielen Jahren um die Arbeit der Anwender zu unterstützen. Insbesondere für Nicht-Entwickler war dies ein wichtiger Schritt um sie in der Oberfläche abzuholen. Eine abgewandelte Form ist dies nun frei nutzbar, wie auch das Markdown Plugin für MantisBT.
Weiterlesen

Standard
Webküche

Ausgewählte Font Type Kombinationen

Fonts sind weiterhin große Lieblinge der Kunden geworden, mit relativ wenig Aufwand kann man viel erreichen – zumindest wenn man sich der Typographie ein wenig versteht und Lösungen nutzt, die einfach zu implementieren sind. In diesem Zusammenhang musste ich Erfahrungen mit eigenen Fonts von Designern sammeln und der Aufwand und die rechtliche Form stehen in keinen Verhältnis zur Nutzung der freien Fonts inkl. Webservice. Insbesondere Google liefert hier eine Fülle an Lösungen und macht die Integration, den Nutzen einfach.

Die Fülle stellt aber auch das Problem dar und so ist es nicht einfach die richtigen Fonts in der Kombination zu finden. In der Vergangenheit sind mir dabei einige Lösungen unter gekommen, die ich in einer einfachen Seite gesammelt habe und nun einen recht schönen Umfang haben. Die Auswahl stammt nicht von mir, sondern in der Regel von den Designern oder Vorgaben aus dem Netz.
Weiterlesen

Standard
Code, Tipps, WordPress

Scripte von WordPress debuggen

WordPress kann sich komfortabel um das verwalten von Scripten und Stylesheets kümmern, Vorraussetzung ist die Nutzung der Möglichkeiten rund um wp_enqueue_script() und wp_enqueue_style(). Will man sich um die darin übergeben Dateien kümmern, so kann eine kleine Funktion helfen und die integrierten Scripte und Styles zurück geben.
Weiterlesen

Standard
CSS, xHTML, JS, Entwicklung, Webküche

Simple Media Queries Debugging

Der Titel dieses Artikels ist für die entstandene Lösung sicher überzogen – trotzdem hatte ich mal wieder Spaß an einer kleinen statischen Spielerei, die im Grunde nur entstanden ist, da ich für ein Projekt den Viewport haben wollte um besser für entsprechende Media Queries zu stylen. Die eigentliche Lösung wurde dann etwas erweitert und durch die Hilfe der Community, insbesondere Frederic und Jens, wurde der Iststand erreicht und kann in jeder Form genutzt werden.
Weiterlesen

Standard
Code, CSS, xHTML, JS, PHP, Plugin, Tipps, WordPress

WordPress Admin Bar nach unten verschieben

Nicht jeder mag die WordPress Admin Bar, eingeführt mit WordPress 3.1, am oberen Rand des Browsers. Mit ein wenig CSS lässt sich das ändern. Die folgende kleine Funktion bringt etwas CSS direkt in den Footer von Backend und Frontend ein und sorgt dafrü, dass die Admin Bar an den unteren Rand verschoben wird.
Weiterlesen

Standard
Code, PHP, Themes, Tipps, WordPress

WordPress Custom Post Types als CSS-Klasse im Frontend nutzen

Die Möglichkeit in WordPress eigene Post-Types einzubringen erfreut sich wachsender Beliebtheit und kann so manche Arbeit vereinfachen – wichtig ist, dass man im Vorfeld die Anforderungen exakt bewertet und die Möglichkeiten einschätzt. Aber darum soll es in diesem kleinen Beitrag nicht gehen – ich möchte kürz eine Lösung zeigen, die den oder die neuen Post Typen in das Frontend bringt, um die neuen Typen mittels CSS anzusprechen.
Weiterlesen

Standard
Code, CSS, xHTML, JS, PHP, Webküche

Simple Media Queries Tester

CSS Media Queries dringen immer weiter vor und die Möglichkeiten der Anpassung bei der Größe einer Website an die den entsprechenden Client bzw. die Bildgröße des Browsers werden notwendiger. Die Media Queries sind eine Lösung, die ihre Vor- und Nachteile haben. Beim Einsetzen empfand ich es manchmal als Nachteil, dass ich mir nicht alle Größe gleichzeitig ansehen konnte. Warum also nicht einfach ein kleines Script und das iframe-Element sinnvoll gebrauchen.
Wer mag und dies braucht, der findet hier nun eine simple und einfache Lösung oder kann auch gern das laufende Script in meinem „Test-Labor“ nutzen. Die Version hat auch einige weitere Spielereien inne, so kann man außerdem die Werte der iframes anpassen und diese Daten speichere ich mittels der DOM Storage-API innerhalb eines Browsers lokal. Meine Lösung im Labor hat keinen Fallback und sollte nur mit Browsers sauber laufen, die die Möglichkeit der Storage API unterstützen.
Weiterlesen

Standard
Code, CSS, xHTML, JS, PHP, Themes, Tipps, WordPress

Einfaches Autoresize für die WordPress Hintergrundbild-Funktion

Mit WordPress 3.0 wurde die Möglichkeit im Theme geschaffen, dass der User einfach ein Hintergrundbild hochladen und nutzen können. Das Bild wird mittels CSS im Hintergrund positioniert. Damit ist es nicht ganz so einfach, dass die Möglichkeit des Autoresize schafft und der Hintergrund sich an die Größe des Browsers anpasst. Es gibt einige schöne Möglichkeiten für diese Anforderung, ich möchte kurz eine sehr einfache Möglichkeit mittels CSS aufzeigen, da so die Funktion von WordPress nicht angefasst werden muss.
Weiterlesen

Standard
Webküche

Die Reduktion von HTML5

Neben dem 10k Contest gibt es aktuell auch ein 1k Variante, wobei es sich dabei um einen reinen JavaScript Vergleich handelt. Die Basis ist trotzdem HTML5 und ein canvas-Element steht zur Verfügung. Mit diesem kann man spielen und es sind einige wirklich tolle Sachen dabei – alles in allem 1k; externe Libraries sind hier nicht erlaubt. Für mich ein kleiner Ansporn um meine Idee mit HTML5 und CSS3 zu reduzieren und mal zu schauen, ob es denn auch im Rahmen von max. 1kByte geht.
Weiterlesen

Standard
CSS, xHTML, JS, Webküche

Inspiriere mit maximal 10k HTML5

Es ist an der Zeit, zurück zu den Ursprüngen zu finden und sich auf die Optimierung mit Blick auf Größe der Website Gedanken zu machen – so oder so ähnlich interpretiere ich den Wettbewerb für Menschen, die Websites machen.

Vor zehn Jahren haben A List Apart einen Aufruf gestartet Much Ado About 5K. Weniger als 5 kByte waren zulässig um kleine Websites zu machen – diese Arbeiten sind aus meiner Sicht in erster Linie Anregung zu eigenen Gedanken und Inspiration für neue Arbeiten. Die Gemeinschaft der Webentwickler diskutiert gerne und so sind diese Formen der Themenanregung beliebt. Neben der Größe der Website von 10 k gibt es einige weitere Bedingungen – Standards: html5 und die Darstellung in Firefox, IE9, Safari und Chrome & diverse Bibliotheken – und damit ist zehn Jahre später ein neuer Wettbewerb 10k Apart durch fast das gleiche Team ins Leben gerufen. Zeit ein wenig Spaß zu haben und eine eigene kleine Arbeit bereit zu stellen.

10k Apart Logo
Weiterlesen

Standard