Artikel des Monats April 2012

23. April 2012 / 1 Kommentar

[WordPress] 'EINS' – Mein erstes WordPress-Theme

Nun ist es endlich vollbracht: mein erstes WordPress-Theme. Nach monatelanger Arbeit, zahlreichen schlaflosen Nächten (und Tagen) sowie ausgiebigen Tests kann ich nun endlich mein Debüt als Theme-Designer feiern.

Darf ich vorstellen: ‚EINS‘ – mein erstes deutschsprachiges WordPress-Theme:

Highlights:

  • Layout ist komplett CSS-basiert (keine Grafiken)
  • Cross-Browser kompatibel (Chrome, Firefox, Internet Explorer 9, Android und iOS 5 getestet)
  • responsives Layout (CSS3 media queries) angepasst für Tablets (bis 1024px) und Smartphones (bis 480px)
  • Post-Thumbnail-Funktion integriert
  • vorbereitetes Gästebuch-Template

Hier gibt’s die Live-Demo zum ausgiebigen testen:

und hier den Download:

Weiterlesen →

23. April 2012 / Keine Kommentare

[Uncharted] Die Trilogie in Film-Form

Uncharted-Fans anwesend? Da hat sich doch tatsächlich ein Fan der Serie hingesetzt und zu den drei bisher erschienenen Teilen jeweils einen Film zusammengebastelt. Dazu hat er hauptsächlich die Zwischensequenzen der Spiele genutzt.

“Uncharted 1: Drake’s Fortune” 1:53 Stunden Spieldauer

“Uncharted 2: Among Thieves” 2:57 Stunden Spieldauer

“Uncharted 3: Drake’s Deception” 3:16 Stunden Spieldauer

Auch wenn der Ton englisch ist, anschauen ist Pflicht.

18. April 2012 / 4 Kommentare

[CSS3] Ein horizontales Dropdown-Menü erstellen

Ich habe mir schon lange vorgenommen mal ein Tutorial für ein horizontales Dropdown-Menü zu erstellen. Und da ich gerade mal wieder ein wenig Zeit und Lust hatte, habe ich mal hingesetzt und ein wenig ausprobiert.

Das ist dabei rausgekommen:

Wenn ihr ebenfalls etwas Zeit und Lust mitbringt, zeige ich in diesem Tutorial, wie ihr ein schickes horizontales Dropdown-Menü erstellt. Das Menü wird, mit Ausnahme der Hauptmenü-Icons, CSS-only, wir verwenden also keine Bilddateien.

Weiterlesen →

12. April 2012 / Keine Kommentare

[CSS3] Die Pseudo-Klasse :target im Detail

Ich habe vor kurzem in diesem Artikel einige Pseudo-Elemente vorgestellt und auch Beispiele für den praktischen Einsatz aufgezeigt. Ein Element habe ich dabei bewusst ausgelassen, da es sich definitiv lohnt, es genauer vorzustellen: die Pseudo-Klasse :target.

Wie der Name schon verrät (target (englisch) = Ziel), wird die Klasse aktiv, wenn das dazugehörige Element aufgerufen oder Ziel einer Aktion ist. Mittels :target können bestimmte Elemente oder Bereiche auf der Webseite angesprochen und formatiert werden.

So lässt sich beispielsweise die Schriftfarbe ändern, wenn das entsprechende Element aufgerufen wird. Die simple Style-Deklaration dafür wäre wie folgt:

[css]#absatz {
color: #fff;
}

#absatz:target {
color: #000;
}[/css]

Stellt sich nur die Frage, wie die ID absatz als Ziel aufgerufen werden kann. Vielleicht ist bekannt, dass IDs als Ankerpunkt genutzt werden können. Beispielsweise kann ich mit dem Link

http://www.olivergast.de/gb/#comments

direkt zum Kommentarformular des Gästebuchs springen, ohne das Gästebuch aufrufen und zum Kommentarformular scrollen zu müssen.

Und so können wir im obigen Beispiel durch einen direkten Link auf das Element dessen Schriftfarbe ändern:

[html]<a class="button" href="http://www.einbeispiel.de/seite/#absatz">Schriftfarbe ändern</a>[/html]

Klar soweit?

Weiterlesen →

8. April 2012 / Keine Kommentare

[XBMC] "Eden" mit direkter Unterstützung für Movie sets

Kennt ihr sicher: ihr habt Film-Serien, die vom Titel her nicht einheitlich benannt sind. Insbesondere bei eingedeutschten Titeln ist das oftmals der Fall. Folge: die Filme werden in der Filmansicht nicht hintereinander aufgeführt.

Beispiel:

  • Lethal Weapon
  • Lethal Weapon 2 – Brennpunkt L.A.
  • Brennpunkt L.A.: Die Profis sind zurück
  • Lethal Weapon 4 – Zwei Profis räumen auf

Um die Filme zusammenhängend zu gruppieren gibt es die Movie sets-Funktion.

Das ist quasi ein Ordner, in den alle Filme der Reihe eingeordnet werden.

Okay. Movie Sets gibt es nicht erst seit Version 11, aber der Umgang mit Movie sets ist mit Veröffentlichung von „Eden“ wesentlich einfacher und direkt in das XBMC eingebunden. Musste man vor Version 11 manuell mit .nfo-Dateien hantieren, reicht es nun eine Option in den Einstellungen zu aktivieren.

Diese Anleitung bezieht sich auf das XBMC in Version 11 (Eden). Weitere Voraussetzung ist der Datenbankmodus sowie die Nutzung des Scrapers The MovieDB.

Weiterlesen →

6. April 2012 / Keine Kommentare

[CSS3] WordPress-Banner mit Pseudoelementen

Ich habe vor kurzem auf einer Webseite ein hängendes Werbebanner mit verschieden angeordneten Buchstaben gesehen, welches als Bilddatei eingebunden wurde. Sah klasse aus und da habe ich mir gedacht, dass das auch per CSS3 – gänzlich ohne Grafikdateien – umgesetzt werden könnte. Also habe ich mich mal hingesetzt und dabei kam dann das hier raus:

Habt ihr Lust das Banner nachzubauen?

Weiterlesen →