Kundenfang mit Online-Adventskalender

Beispiele

Bisher noch keine Bewertungen für diesen Artikel.

Beispiele

Funktionsweise des Adventskalender

Hinter jeder Zahl verbirgt sich eine HTML-Datei, die beliebig mit Inhalten gefüllt werden kann.

Beispiele dafür können sein:

  • Text: Rezept, Rätsel

  • Audio: eigenes Musiksample

  • Video: Filmsequenz zu einem Ereignis

  • Grafik/Text: Bild/Text zum Angebot des Tages

  • Link: zum Angebot im eigenen Shop

  • Flashanimation (Plugin erforderlich): Funktionsweise eines neuen Produkts

Auch weniger erfahrenen Webmastern dürfte es keine Probleme bereiten, die Seiten zu modifizieren. Störend wirken lediglich die CSS-Anweisungen in jeder Datei, die man in eine zentrale Datei auslagern könnte, sofern bestimmte Elemente in ihrem Aussehen bestehen bleiben sollen. Die Referenz für zentrale Formate wird im Head einer jeden HTML-Datei platziert:

<head>
...
<link rel="stylesheet" type="text/css" href="ggf.unterverzeichnis/formate.css" />
...
</head>

Beispiel 1: Aussehen der Popup-Box verändern

52481_hapkemedia.jpg
  • vorher:

  • nachher:

So wird's gemacht

  • vorsichtshalber die Originaldatei unter einem anderen Namen, z.B. kalender05-v01_original.htm, speichern

  • die Startseite des Kalenders 05, hier kalender05-v01.htm, in einem Editor öffnen (z.B. Windows: Start - Programme - Zubehör - Editor)

Zur Bearbeitung der HTML-Dateien können auch Programme, wie Dreamweaver, Frontpage (nicht empfohlen), namo Webeditor usw. verwendet werden.

  • Zeile suchen:

    <!-- Edit-Marker 03 -->
    desc = "<table cellspacing=0 ... border="+bord+" bgcolor=#DF0000 ...

  • farbig hervorgehobenen Farbcode durch den gewünschten ersetzen

  • Datei speichern und per FTP auf den Webspace übertragen, dabei die vorhandene Datei überschreiben

Farbcodes

Falls Sie sich mit Farbcodes nicht auskennen, wird Ihnen hier und hier geholfen.

Hinweis: Der rote Hintergrund im o.g. Beispiel wurde in einem Grafikprogramm anders eingefärbt.

Beispiel 2: Aussehen der Scrollbalken verändern

Wer darauf Wert legt, das Aussehen des Scrollbalkens zu verändern, kann die betreffenden Codezeilen bearbeiten. Andernfalls löscht man sie einfach heraus, und der Browser liefert die Standardversion aus.

So wird's gemacht

  • vorsichtshalber die Originaldateien (z.B. kalender05-v01_original.htm, 1.htm, 2.htm usw.) unter einem anderen Namen speichern

  • die zu bearbeitende Datei in einem Editor öffnen (z.B. Windows: Start -Programme - Zubehör - Editor)

  • Codezeilen suchen und farbig hervorgehobenen Farbcode durch den gewünschten ersetzen

  scrollbar-face-color: #3E4F6D;
  scrollbar-shadow-color: #5171B2;
  scrollbar-highlight-color: #5171B2;
  scrollbar-3dlight-color: #5171B2;
  scrollbar-darkshadow-color: #3E4F6D;
  scrollbar-track-color: #3E4F6D;
  scrollbar-arrow-color: #FFFFFF;
  • Datei speichern und per FTP auf den Webspace übertragen, dabei die vorhandene Datei überschreiben

Nicht jeder Browser interpretiert die Farbanweisungen.

Die Bezeichnungen bedeuten ...

scrollbar-face-color: Farbe für Oberfläche

scrollbar-shadow-color: Farbe für unteren und rechten Rand

scrollbar-highlight-color: Farbe für oberen und linken Rand

scrollbar-3dlight-color: Farbe für 3D-Effekte

scrollbar-darkshadow-color: Farbe für Schatten

scrollbar-track-color: Farbe für freibleibenden Verschiebeweg

scrollbar-arrow-color: Farbe für Verschiebepfeile