Ein Adventskalender mit WordPress: WP-Advent

Da ich dieser Tage einen Adventskalender brauche, hatte ich zwei Möglichkeiten: Ich bastele mir aus PHP schnell selbst etwas… oder ich Beweise mal wieder meine Aussage, dass man mit WordPress einfach alles kann. Und nun sagt alle „Hallo WordPress-Adventskalender!“

Screenshot vom WordPress-Adventskalender

Einen guten Nachmittag und den halben Abend habe ich damit verbracht, das Ding zusammen zu bauen. Wesentlich aufwendiger wird es nun, mir noch passende Inhalte aus den Fingern zu saugen zu überlegen.

Technisches und Quellen

Aber vielleicht mal ein paar technische Details: Das ganze ist ein WordPress-Theme und läuft bei mir unter WordPress 3.0.1 problemlos. Getestet hab ich die Geschichte mal in Chrome und Firefox, da sieht alles top aus. Der Internet Explorer sollte in einer möglichst aktuellen Version auch keine Mucken machen, aber das weiß man ja nie.

Zum Anzeigen der virtuellen Türchen verwende ich Fancybox, ein jQuery-Plugin. Das kann Videos, Bilder und Text darstellen. Man ist also in seinen Möglichkeiten kaum eingeschränkt. Die verwendete Schrift ist übrigens Tangerine aus dem Google Font Directory. Das Hintergrundbild habe ich selbst im Urlaub auf Langeoog geschossen.

YouTube- und Vimeo-Videos lassen sich mit den Tags
[html]
[ youtube ]xxx[ /youtube ]
[ vimeo ]xxx[ /vimeo ]
[/html]
einbinden, wobei das „xxx“ für die Video-ID steht, die man aus der URL rauskopieren muss. Außerdem muss man die Leerzeichen in den eckigen Klammern entfernen. Das notwendige Gehackte hat netterweise der Herr Netzblogr zur Verfügung gestellt.

Zur Darstellung der Einträge verwende ich zwei Loops. Den Code für den Teil mit den noch nicht erschienenen Beiträgen habe ich mir bei Michael Loeser abgeschaut.

Installation und Einrichtung

Zuerst einmal braucht es ein leeres WordPress. Wie man so etwas installiert, möchte ich grade gar nicht erklären – das lässt sich auch einfach zusammengooglen und ist eigentlich auch nicht schwer. Der Titel des Blogs wird oberhalb des Kalenders ausgegeben. Außerdem wichtig: Man muss unter Einstellungen -> Lesen die Einstellung Blogseiten zeigen maximal auf 24 stellen. Als zweites braucht es dann das Adventskalender-Theme, welches man in den Themes-Ordner lädt. Dann schnell das Theme aktivieren!

Schließlich legt man dann genau 24 Beiträge im WordPress an und datiert diese in der „Publizieren“-Box am rechten Rand entsprechend auf den 1. bis 24. Dezember vor. Als Titel sollte man einfach die Ziffern 1-24 nehmen.

Download

WordPress-Theme WP-Advent

Disclaimer

Ich habe das Theme für meinen eigenen Bedarf recht flott zusammengebastelt und für meinen Zweck funktioniert es. Falls etwas schief gehen sollte, darf man mich gerne in den Kommentaren drauf hinweisen. Wenn ich Zeit und Muse finde bastele ich auch noch ein wenig daran rum. Ansonsten darf aber auch jeder gerne das Theme ganz nach den eigenen Wünschen umbauen und Kram. Das Hintergrundbild lässt sich zum Beispiel recht einfach austauschen, indem man ein Bild auf die Maße 600*500 Pixel bringt und dann von oben links nach unten rechts in durchnummerierte Teile á 100*125 Pixel zerschneidet. Die Bilder packt man dann in den Ordner ausschnitte im Theme-Ordner und schon ist alles super mit dem eigenen Bild.

Nur die beiden Links unter dem Kalender, die bleiben bitte drin. Sonst finde ich das doof. Wer das Theme einsetzt, darf mir das auch gerne da so im Kommentarbereich erzählen. Ich freue mich sehr über einen Link, damit ich mir das dann mal anschauen kann.

13 Antworten zu “Ein Adventskalender mit WordPress: WP-Advent”

  1. Hallo,
    es ist in der Tat traurig, daß da so gar nix in der Richtung auf dem WordPress-Markt ist … wollte mal kurz anfragen, ob es schon Bestrebungen in Richtung Plugin gibt? :) Das wäre eine echte WordPress-Marktlücke!!

  2. Guten Tag,
    vielen Dank für das „theme“.
    Derzeit versuche ich mit Photoshop den Hintergrund neu einzuteilen. Doch mit ihren Angaben oben gelingt die es mir leider nicht. Ich mache dies mit der Slices Funktion von Photoshop? Jemand eine Idee? Habe das Bild auf die 500×600 zu geschnitten und dieses dann in 24 gleiche Teile geschnitten, doch passt es nicht.

  3. Marc: Das Hintergrundbild muss 600 Pixel in der Breite und 500 Pixel in der Höhe haben. Die einzelnen „Türchen“ sind dann jeweils 100 Pixel breit und 125 Pixel hoch. Wie oben beschrieben. In Photoshop kannst du das, wie du schon schreibst, sehr einfach mit Slices machen. Nachdem du das Bild richtig skaliert und eingeteilt hast, lassen sich die einzelnen Teile dann mit der Funktion „Für’s Web exportieren“ („Save for web“).

    Inke: Auf Anhieb habe ich leider keine Lösung für dein Problem. Ich habe das Theme auf die Schnelle und für eine sehr kleine Zielgruppe (genau genommen eine Person) zusammengebaut und deshalb den Internet Explorer nicht berücksichtigt.

    • Da ich den Adventskalender als eigenständiges Theme angelegt habe, geht das leider nicht ohne Weiteres. Vielleicht schaffe ich es ja dieses Jahr, ein Plugin daraus zu bauen.

  4. Lieber Martin,

    funktioniert das Theme inzwischen nicht mehr? Die Türchen werden bei mir korrekt angezeigt, auch transparent – aber es öffnet sich keine Box. Kannst ja gerne mal schauen: http://www.advent.der-leitfalke.de

    Ich habe 1 & 8 zurückdatiert um es zu testen, jeweils einen Artikel erstellt (ein Foto und text).
    Stelle ich mich zu doof an?^^
    LG
    Christian

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *