Bitte stellt die Seite mit dem Einbau der Skripte von .html auf .php in den Seiteneinstellungen um.
Dieses PHP-Skript könnt Ihr mit Euren Sprüchen versehen und es gehört dann in die:
> Seiteneinstellungen > "Before <!DOCTYPE>"<?php
// Adventkalender
// Peter Ortner / Werner Zenk
// Monat
// Zum testen auf den aktuellen Monat stellen
$monat = 12;
// Sprüche zu Weihnachten
$spruch[1] = 'Spruch 1 ...';
$spruch[2] = 'Spruch 2 ...';
$spruch[3] = 'Spruch 3 ...';
$spruch[4] = 'Spruch 4 ...';
$spruch[5] = 'Spruch 5 ...';
$spruch[6] = 'Spruch 6 ...';
$spruch[7] = 'Spruch 7 ...';
$spruch[8] = 'Spruch 8 ...';
$spruch[9] = 'Spruch 9 ...';
$spruch[10] = 'Spruch 10 ...';
$spruch[11] = 'Spruch 11 ...';
$spruch[12] = 'Spruch 12 ...';
$spruch[13] = 'Spruch 13 ...';
$spruch[14] = 'Spruch 14 ...';
$spruch[15] = 'Spruch 15 ...';
$spruch[16] = 'Spruch 16 ...';
$spruch[17] = 'Spruch 17 ...';
$spruch[18] = 'Spruch 18 ...';
$spruch[19] = 'Spruch 19 ...';
$spruch[20] = 'Spruch 20 ...';
$spruch[21] = 'Spruch 21 ...';
$spruch[22] = 'Spruch 22 ...';
$spruch[23] = 'Spruch 23 ...';
$spruch[24] = 'Spruch 24 ...';
// Farben
$tag_nein = 'bg-rot';
$tag_ja = 'bg-gruen';
?>
Dieses JavaScript steht hier in die Seiteneinstellungen > "Inside <head> code", um nach dem Klick den Block mit dem Einbau aufzurufen. Dieser Block hat in meinem Fall die id="article6-3g" und mein Seitenname ist Adventskalender.php. Bitte passt das an.
<script>
function myPage(tag) {
window.location.href = 'Adventskalender.php?tuerchen=' + tag + '#article6-3g';
}
</script>
Das PHP-Skript für die Ausgabe, indem die Seite über die JavaScript-Funktion "myPage" (oben) aufgerufen wird. Dieses Skript habe ich hier in einen einfachen Textblock, anstelle des Beispieltextes, kopiert. Hier ohne das zufällige Blinken der Zahlen.<section class="content">
<?php
$tage = range(1, 24);
shuffle($tage);
$weihnachtsTag = false;
foreach ($tage as $tag) {
echo ' <a href="javascript:myPage(\'' . sprintf("%02d", $tag) . '\')" class="';
if (isset($_GET['tuerchen']) &&
($_GET['tuerchen'] . '.' . sprintf("%02d", $monat) . '.' . date('Y')) == date("d.m.Y") &&
$_GET['tuerchen'] == $tag) {
echo $tag_ja;
$weihnachtsTag = true;
}
else {
echo $tag_nein;
}
echo '">' . sprintf("%02d", $tag) . ' </a>';
}
if (isset($_GET['tuerchen'])) {
if ($weihnachtsTag) {
echo '<div class="ausgabe"><b>Heute ist der ' . (date('d') . '.' . sprintf("%02d", $monat) . '.' . date('Y')) .
'</b><br>„' . $spruch[floor($_GET['tuerchen'])] . '”</div>';
}
else {
echo '<div class="ausgabe">Du hast den falschen Tag gewählt, da heute nicht der ' . ($_GET['tuerchen'] . '.' . sprintf("%02d", $monat) . '.' . date('Y')) . ' ist.</div>';
}
}
?>
... und noch ein wenig CSS, die in den "Code Editor" in den Bereich "CSS Editor" gehört:
display: block;
text-align: center;
background: #149dcc;
width: 80%;
margin: 50px auto 0 auto;
padding: 50px;
border-radius: 30px;
border: 1px solid white;
}
.ausgabe {
margin-top: 50px;
}
.footer {
text-align: center;
margin-top: 50px;
}
a {
text-decoration: none;
}
.bg-rot {
background: #800;
color: #fff;
margin: 2px;
padding: 15px 25px;
line-height: 60px;
text-align: right;
}
.bg-rot:hover {
box-shadow: inset 0px 0px 15px rgba(255, 6, 6,0.9);
}
.bg-gruen {
background: #690;
border: 1px solid white;
color: #fff;
margin: 2px;
padding: 15px 25px;
line-height: 60px;
}
@media (max-width: 767px) {
.content {
width: 100%;
}
}
Schneefall und Feuerwerk Skripte
Ich habe dieses Script hier "snowflakes.js" genannt und in ein Verzeichnis "winter" kopiert und in den Seiteneinstellungen "End of <body> code:" darauf verlinkt:
<script type="text/javascript" src="winter/snowflakes.js"></script>
<script type="text/javascript" src="winter/fireworks.js"></script>
Der Aufruf findet in beiden Fällen automatisch statt.
Bitte beachtet, dass die Skripte zum Schneefall und Feuerwerk nur für den
privaten Gebrauch kostenfrei sind. Für den
gewerblichen Gebrauch muss eine geringe Lizenzgebühr entrichtet werden, wendet Euch dafür an den Autor von
go4u.de.