Motivations-Countdown einbauen

Ein zusätzlicher Anreiz für Deine Affiliates kann es sein, zum Beispiel einen zeitlich begrenzten Wettbewerb zu starten! Das heißt Deine Affiliates haben innerhalb eines bestimmten Zeitraumes Zeit, neue User für Dein Projekt zu werben. Nach Ablauf der von Dir festgesetzten Frist, bekommen dann z.B. die 5 fleißigsten Affiliates bestimmte Preise, abhängig von der Anzahl der von Ihnen geworbenen User! Dazu benötigst Du einen Countdown, um eben den Wettbewerb zeitlich zu begrenzen und Deine Affiliates zusätzlich zu motivieren! Wie Du einen Countdown in Dein Projekt einbaust, erfährst Du im folgenden Video:

Schritt 1:
Öffne die Datei Countdown_Skript.txt mit einem einfachen Texteditor und gleichzeitig jene Webseite (z.B. emailbestaetigt) mit dem html-Kompozer auf die der Countdown dann online erscheinen soll. Kopiere anschließend den kompletten Code unter Punkt 1 in der Datei Countdown_Skript.txt und füge diesen unterhalb des Title-Tags (unterhalb folgender Zeichen: <title> … </title>) in der entsprechenden Webseite ein.
Platzhalter

Schritt 2:
Suche jetzt im Quellcode der Webseite, in welcher der Countdown erscheinen soll, das Body-Tag <body> und ersetze dieses mit <body onload=”countdown()”> (Punkt 2 in der Datei Countdown_Skript.txt). <body onload=”countdown()” bewirkt, dass beim Aufruf der Webseite der Code unter Schritt 1 ausgeführt wird.
Platzhalter

Schritt 3:
Kopiere nun abschließend jenen Code, der in der Datei Countdown_Skript.txt unter Punkt 3 zu finden ist. Dieser Code lautet:

<form name=”countdownform”>
<p>
<input style=”border:none; height:auto; font:Tahoma; color:#77060F; text-align:center; font-size:18px; font-weight:bold” size=”75″ name=”countdowninput”>
</p>
</form>

Und füge diesen Code exakt an jener Stelle im Quellcode Deiner Webseite ein, an der der Countdown dann online erscheinen bzw. runter zählen soll. In dem soeben kopierten Code ist auch folgende Zeile vorhanden, die dazu dient die Countdown-Ausgabe zu formatieren:

<input style=”border:none; height:auto; font:Tahoma; color:#77060F; text-align:center; font-size:18px; font-weight:bold” size=”75″ name=”countdowninput”>

=> border:none; … bedeutet, dass hier kein Rahmen um den Countdown verwendet wird. Stellst Du hier auf 1px, erscheint ein Rahmen mit einem Pixel Stärke.

=> height: auto; … ist die Höhe des Countdown-Feldes, nicht der Schrift. Hast Du zum Beispiel einen Rahmen von einem Pixel eingestellt und stellst hier eine bestimmte Höhe ein (nicht auto), dann verändert sich die Höhe des Rahmens.

=> font: Tahoma; … bestimmt, welche Schriftart Du verwenden möchtest. Hier kannst Du zum Beispiel auch Arial oder Verdana,… eingeben.

=> color: #77060F; … bestimmt, welche Farbe Deine Schrift hat, als Hexadezimal-Code – im html-Kompozer kannst Du dann auch direkt die RGB-Werte angeben, siehe Video oben.

=> text-align:center; … bestimmt die Ausrichtung der Schrift innerhalb des Countdown-Feldes. Center bedeutet mittig, right = rechts und left = links.

=> font-size:18px; … bestimmt die Größe der Schrift in Pixel.

=> font-weight:bold … bestimmt die Schriftdarstellung. bold bedeutet zum Beispiel Fett-Schrift.

=> size=”75″ … ist die Breite des Countdown-Feldes. Wenn Du einen Rahmen eingestellt hast, kannst Du die Veränderung sehen, wenn Du unter Size eine andere Zahl einfügst.

Folgende Code-Zeile kann verwendet werden, um das Enddatum des Countdowns einzustellen:

var jahr=2012, monat=7, tag=31, stunde=23, minute=59, sekunde=59;

Die restlichen Codezeilen sollten bitte unbedingt unverändert bleiben!