Startseite > Blog > WordPress > Skalierbares Kalenderblatt mit WordPress

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. :smile:

Hierzu benötigte ich lediglich geringe PHP- und CSS-Kenntnisse.

Der Trick: Das Kalenderblatt kommt ohne Grafik aus. :cool:

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>

Lesezeichen hinzufügen

2 Kommentare

  1. Name-gelöscht sagt:

    Cool, so was hab ich gesucht. Tolle Idee, und mit dem gepunkteten Rand wunderbar simpel umgesetzt. Danke!

Hinterlasse eine Antwort

Deine Mailadresse bleibt geheim. Pflichtfelder sind mit * gekennzeichnet.

Kommentare prüfe ich grundsätzlich vor einem Freischalten!
Ich bitte um Verständnis für diese Spamschutz-Maßnahme.

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Webseite veröffentlicht am Samstag, den 19. Januar 2008, um 21:14 Uhr,
zuletzt geändert am Sonntag, den 22. Mai 2011, um 16:22 Uhr.
Schlagworte: , , , ,


Statistik: 72 Seiten, 342 Blogartikel, 1.050 Schlagworte, 1.133 Kommentare, 52 Feedleser.
© 2002 - 2012 | WordPress - Mein Layout basiert auf YAML und wird durch Xtreme One angetrieben.