Skalierbares Kalenderblatt mit WordPress
Durch das Anschauen des Quelltextes der index.php beim WordPress-Theme Stardust und die Anleitung “Eine Liste als Kalenderblatt” auf den Seiten 283 bis 286 im Buch Little Boxes, Teil 2 von Peter Müller habe ich meine Version eines mit dem Text zoomenden Kalenderblattes in dem auf dem CSS-Framework YAML basierenden WordPress-Theme Blitzblank realisiert.
Hierzu benötigte ich lediglich geringe PHP- und CSS-Kenntnisse.
Der Trick: Das Kalenderblatt kommt ohne Grafik aus.
Hier für Interessierte meine Ergänzungen in der CSS-Datei content.css
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | ul.kalenderblatt { float: left; list-style-type: none; margin:0 10px 5px 0; padding:0.5em 1em; border:1px solid #333; border-top:4px dotted #999; border-left:1px solid #ccc; background:#ffe; text-align:center; font-size:100%; overflow: hidden } ul.kalenderblatt:hover { background:#eee; cursor:help } ul.kalenderblatt li.tag { margin:0; padding:0; color:#333; font-size:100%; font-family:Georgia, "Times New Roman", Times, serif } ul.kalenderblatt li.datum { margin:0; padding:0 0 2px 0; color:#c80606; font-size:100%; font-family:Georgia, "Times New Roman", Times, serif } ul.kalenderblatt li.zeit { background-color:transparent; color:#333; margin:0; padding:0 0 2px 0; border-top:1px dotted #999; font-family:Georgia, "Times New Roman", Times, serif } |
Durch das Blog F-LOG-GE von Jens Grochtdreis bin ich auf das WordPress-PlugIn Code Autoescape zur Darstellung von Quellcode aufmerksam geworden. Nachdem ich dieses PlugIn installiert habe, kann ich nun auch den zugehörigen PHP-Code aus der index.php des von mir modifizierten WordPress-Themes Blitzblank hier posten:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <?php $time = get_the_time('F j Y l H i'); list($mo, $da, $ye, $wo, $ho, $mi) = explode(" ", $time); ?> <ul class="kalenderblatt" title=" <?php echo($wo).", den "; ?> <?php the_time('d.m.Y'); ?> <?php echo", ".($ho).":".($mi)." Uhr"; ?> "> <li class="tag"> <?php echo($wo); ?> </li> <li class="datum"> <?php echo($da).". ".($mo)." ".($ye); ?> </li> </ul> |
Cool, so was hab ich gesucht. Tolle Idee, und mit dem gepunkteten Rand wunderbar simpel umgesetzt. Danke!
Bitte!
Viel Spaß mit dieser zugänglichen und benutzerfreundlichen Kalenderblatt-Lösung.