jsCards - Elektronische Grusskarten

Installation und Konfiguration von jsCards

• 1. Allgemeines
  • 1.1. Produktbeschreibung in Kürze
  • 1.2. Was kann jsCards?
  • 1.3. Voraussetzungen
  • 1.4. Lizenzbestimmungen
• 2. Installation
  • 2.1. Dateien kopieren und Berechtigungen setzen
  • 2.2. Fehlendes GD-Modul auf meinem Webserver
  • 2.3. Update
  • 2.4. Wichtige URLs
• 3. Konfiguration
  • 3.1. Erster Login
  • 3.2. Administrationsoberfläche
    • 3.2.1. Login-Daten ändern
    • 3.2.2. System Einstellungen ändern
    • 3.2.3. Grusskarten Einstellungen ändern
    • 3.2.4. Grusskarten verwalten
    • 3.2.5. Blacklist verwalten
    • 3.2.6. Bilder verwalten
    • 3.2.7. MIDI/WAVE verwalten
    • 3.2.8. Fallende Bilder verwalten
    • 3.2.9. Templates editieren
    • 3.2.10. Statistik
  • 3.3. Dateisperre
  • 3.4. Online Versions-Check
  • 3.5. Neue Bilder hinzufügen
• 4. Templates
  • 4.1. <!--catlinks:--> - Tag (Template "Grusskarten-Auswahl")
  • 4.2. Spezielle Tags für Thumbnails
  • 4.3. Spezielle Tags für Multi-Empfänger / Multi-Empfänger-Fähigkeit in eigenes Template einbauen
  • 4.4. Kalender in eigenes Template einbinden
  • 4.5. Dateiupload in eigenem Template erlauben
  • 4.6. Secure-Code in Template einbinden
  • 4.7. Wenn-Abfrage / Text nur in bestimmter Rubrik
    • 4.7.1. Text nur in einer bestimmten Kategorie anzeigen
    • 4.7.2. Select-Felder
  • 4.8. Benutzerdefinierte Felder
  • 4.9. Smileys in eigenem Template
  • 4.10. Adressbuch in eigenes Template einbauen
  • 4.11. manuelle Effektvorschau in Auswahl-Template
  • 4.12. Bildvorschau als Mouse-Over-Effekt
• 5. Weitere Informationen
  • 5.1. Aufruf der Scripts
  • 5.2. Zeitversetztes senden
    • 5.2.1. Transparentes GIF auf einer anderen Seite
    • 5.2.2. CRON-Job
  • 5.3. Quellenangabe Demo-Bilder

1. Allgemeines

1.1. Produktbeschreibung in Kürze

jsCards ist ein frei konfigurierbares elektronisches Grusskartensystem. Die Grusskarten können zusätzlich wahlweise mit Hintergrundmusik und/oder vom Bildschirm fallenden Bildern versehen werden. Das komplette Aussehen kann via Templates gesteuert werden. Die gesamte Verwaltung kann via webbasierter Administrations-Oberfläche vorgenommen werden. Die Grusskarten können in verschiedene Rubriken unterteilt werden. Mit installiertem GD-Modul können die Thumbnails automatisch erstellt werden. Unix/(Windows), deutsch, kostenlos.

Die Informationsseite zum Script inkl. Downloadmöglichkeit und Online-Demo finden Sie hier!

1.2. Was kann jsCards?

jsCards ist ein elektronisches Grusskartensystem, wie es auf vielen Homepages eingesetzt wird. Einige interessante Features machen jsCards jedoch besonders interessant:

• jsCards kommt ohne Datenbank aus. Die Grusskarten werden in einer Textdatei gespeichert.
• Die gesamte Administration kann über eine übersichtliche Weboberfläche vorgenommen werden
• Mit installiertem GD-Grafikmodul können Thumbnails von JPG-Dateien völlig automatisch erstellt werden
• Das komplette Layout ist via Templates konfigurierbar
• Zu grosse Thumbnails können auch ohne GD-Modul via HTML-Tags verkleinert werden (Achtung: Dateigrösse bleibt gleich)
• Die Bilder der Grusskarten können in verschiedene Rubriken (z.B. Geburtstag, Weihnachten, lustig, Urlaub etc.) unterteilt werden
• Hintergrundmusiken können nur in bestimmten Kategorien, bzw. in allen Kategorien ausser den angegebenen zur Verfügung gestellt werden.
• Jede Grusskarte kann mit einer kurzen Beschreibung versehen werden
• Der Grusskartentext an in Text oder wahlweise auch in HTML erfasst werden. Zudem existiert ein separates Titelfeld
• Wahlweise kann der Grusskarte eine Hintergrundmusik hinterlegt werden.
• Ebenfalls ist es möglich, eine Grafik über den Bildschirm nach unten fallen zu lassen
• Smileys im Grusskarten-Text können durch Grafiken ersetzt werden.
• Die Karte kann auch zu einem späteren Zeitpunkt versendet werden
• Auf Wunsch kann eine Lesebestätigung angefordert werden, wenn der Empfänger die Karte angesehen hat
• Wahlweise kann eine Kopie der Grusskarte an den Absender geschickt werden.
• Der gleichzeitige Versand einer Grusskarte an mehrere Empfänger ist möglich.
• Statistik-Funktion, damit schnell erkannt werden kann, wie viele Karten versendet werden und welches die beliebtesten Motive/Sounds/Effekte sind.
• Blacklist: Auf Wunsch kann sich ein Benutzer der Blacklist hinzufügen um keine Grusskarten mehr von diesem Server zu erhalten
• Secure-Code Missbrauchschutz verhindert automatisierten Versand von Grusskarten (benötigt GD-Modul)
• Die Benutzer können ihre eigenen Motive versenden (entweder Angabe einer URL oder Upload eines Bildes), sofern der Administrator diese Funktion erlaubt hat.
• Es kann automatisch eine Top XX Kategorie mit den XX meistversendeten Karten erstellt werden
• Fünf benutzerdefinierte Felder erlauben es, jsCards noch um weitere Funktionen zu erweitern, z.B. wählbare Hintergrundfarbe, wählbare Briefmarke, zusätzliches Textfeld etc.
• Jeder Besucher hat die Möglichkeit, Grusskarten-Empfänger sowie Absender in seinem persönlichen Adressbuch zu verwalten (Cookies; keine Registrierung erforderlich)
• Unterstützt nebst Bild-Grusskarten (JPG, GIF, PNG) auch Flash-Grusskarten (SWF) und IFRAME-HTML-Seiten (z.B. für Java-Applets, Java-Script etc.)

1.3. Voraussetzungen

Der Server muss natürlich CGI's verarbeiten können. Nebst CGI-Unterstützung gelten noch folgende Voraussetzungen:

• sendmail
• Modul "Time::Local" muss installiert sein (wird mit allen Perl-Distributionen standardmässig installiert)
• Modul "GD" muss installiert sein, wenn die Thumbnails automatisch erstellt werden sollen (kann deaktiviert werden, so dass dieses Modul nicht notwendig ist)

1.4. Lizenzbestimmungen

Dieses Skript basiert auf den STANDARD-Lizenzbedinungen, die Sie unter http://www.cgicorner.ch/download/info.shtml oder in der Datei cgicorner.txt im ZIP-Archiv finden.

2. Installation

2.1. Dateien kopieren und Berechtigungen setzen

Folgende Dateien müssen kopiert und mit den entsprechenden Berechtigungen versehen werden:

Anmerkung: Die mit (*) gekennzeichneten Dateien befinden sich nicht im ZIP-Archiv und werden erst im Betrieb erstellt.

Je nach Konfiguration des Webservers werden keine Bilder aus dem cgi-bin Verzeichnis angezeigt. Deshalb wird empfohlen, die Bilder in ein Verzeichnis ausserhalb von cgi-bin zu kopieren und die entsprechenden Bildpfade im Adminbereich anzupassen. Die Standard-Konfiguration des Scripts geht davon aus, dass Bilder im cgi-bin Verzeichnis angezeigt werden können und auch dort abgespeichert sind. Bei einer Änderung der Installations-Verzeichnisse ist zwingend eine Anpassung im Adminbereich notwendig.

jscards.cgi benötigt Schreibzugriff auf das Script-Verzeichnis. Dazu ist - je nach Konfiguration des Webservers - ein chmod 777 für das Verzeichnis notwendig. Möglicherweise meldet das Script nach dem chmod 777 jedoch einen "Internal Server Error". Zuerst sollte also immer chmod 755 versucht werden.

2.2. Fehlendes GD-Modul auf meinem Webserver

jsCards setzt das GD-Modul voraus, um alle Funktionen nutzen zu können.

Auf Webservern, auf denen das GD-Modul nicht installiert ist wird jsCards ebenfalls funktionieren, die automatische Erstellung von Thumbnails wird jedoch nicht zur Verfügung stehen.

Falls das GD-Modul nachträglich installiert wird, muss die Datei subs.pl im Scriptverzeichnis gelöscht werden. Dies führt dazu, dass beim nächten Aufruf von jsCards erneut geprüft wird, ob das GD-Modul installiert ist.

2.3. Update

Alle notwendigen Schritte für den Update sowie alle Neuerungen finden Sie in der Datei update.txt. Es müssen immer alle TODO-Einträge zwischen der eingesetzten und neuen Version beachtet werden.

• Uploaden Sie die Datei update.cgi ins jsCards-Verzeichnis. Aktualisieren Sie auf keinen Fall die Datei jscards.cgi!
• Setzen Sie die Rechte für die Datei: chmod 755 update.cgi
• Rufen Sie das Script update.cgi via Webbrowser auf
• Nehmen Sie die Konfigurationseinstellungen vor. Alle Parameter sind erklärt.
• Beachten Sie ggf. die weiteren Schritte, welche aufgelistet werden
• Ersetzen Sie die Datei jscards.cgi
• Löschen Sie die Datei update.cgi vom Server, um Manipulationen durch Drittpersonen zu verhindern

2.4. Wichtige URLs

Die wichtigsten URLs zu jsCards lauten:

• Administrationsoberfläche: http://www.meinserver.ch/cgi-bin/jscards/jscards.cgi?action=admin
• Grusskarten-Auswahl (für Benutzer): http://www.meinserver.ch/cgi-bin/jscards/jscards.cgi?action=select

3. Konfiguration

3.1. Erster Login

Die Administrationsoberfläche finden Sie unter: http://www.meinserver.ch/cgi-bin/jscards/jscards.cgi?action=admin

Beim ersten Login werden - je nach Konfiguration - die Bilder noch nicht geladen. Dies ist normal und muss Sie nicht weiter stören.

Loggen Sie sich nun mit dem Benutzername admin, ohne Passwort ein.

Sie gelangen nun ins Hauptmenü. Klicken Sie auf den Link "System-Einstellungen ändern". Hier können Sie verschiedene Einstellungen vornehmen. Kontrollieren Sie den Pfad zu sendmail und passen Sie ggf. die Dateipfade für die Konfigurationsdateien sowie Templates an.

Passen Sie danach noch die Einstellungen der Grusskarten unter "Grusskarten Einstellungen ändern" an.

3.2. Administrationsoberfläche

3.2.1. Login-Daten ändern

Unter "Login-Daten ändern" können Sie den Benutzername sowie das Passwort für die Administrationsoberfläche festlegen.

3.2.2. System Einstellungen ändern

Unter "System Einstellungen ändern" können Sie den Pfad zu sendmail sowie die Pfade und Dateinamen der einzelnen Templates, Datenbanken und Bildern für die Adminoberfläche konfigurieren.

Die Einstellungen im Detail:

3.2.3. Grusskarten Einstellungen ändern

Hier können die Pfade zu den Verzeichnissen mit Bildern, Audio-Dateien etc., die Kategorien, sowie einige variable Texte konfiguriert werden.

Die Einstellungen im Detail:

3.2.4. Grusskarten verwalten

Unter "Grusskarten verwalten" können Sie den Inhalt der Datenbanken ansehen und einzelne Grusskarten löschen. Dabei werden Ihnen jedoch nur die Rohdaten (Sendezeit, Absender und Empfänger sowie Titel angezeigt. Der Nachrichtentext ist nicht sichtbar.

Wichtig: Aus Datenschutzrechtlichen Gründen ist es weder möglich, Grusskarten anzusehen, noch zu editieren.

3.2.5. Blacklist verwalten

3.2.6. Bilder verwalten

Unter dem Menüpunkt "Bilder verwalten" werden alle Bilder aufgelistet (bei mehr als 15 Grusskarten ist eine Navigation mittels vor- und zurück Buttons vorhanden).

Jedes Bild kann hier mit einer kurzen Beschreibung versehen und einer Kategorie zugeordnet werden. Ebenfalls ist es möglich, das Thumbnails auf eine bestimmte Grösse zu verkleinern (Achtung: Resize erfolgt via HTML-Tags width=/HEIGHT=. Die Dateigrösse verringert sich deshalb nicht!), oder das Bild zu löschen. Bei installiertem GD-Modul und JPG-Dateien kann auch automatisch ein Thumbnail erstellt werden.

Am Ende der Seite hat es noch fünf weitere Menüpunkte:

• Neues Bild hinzufügen: Bild via Browser uploaden.
• Zu grosse Thumbnails via HTTP-Tags (WIDTH=/HEIGHT=) in Grösse anpassen: Passt die Thumbnails in der Grösse so an, dass die in den Grusskarten-Einstellungen definierte Grösse nicht überschritten wird. Auch hier wird die Grössenänderung via HTML-Tags gemacht, was dazu führt, dass die Dateigrösse nicht verringert wird. Automatisch verkleinerte Thumbnails sind in der Admin-Oberfläche mit einem [auto] neben der Grössenangabe gekennzeichnet.
• Überflüssige Thumbnails entfernen: löscht Thumbnails aus dem System, für die kein grosses Bild mehr existiert.
• Thumbnails für alle JPG-Dateien erstellen: Erstellt für jede JPG-Datei ein Thumbnail. Vorhandene Thumbnails werden überschrieben (GD Modul wird vorausgesetzt).
• Überflüssige Beschreibungen löschen: löscht Beschreibungen und Kategorien von Karten, für die kein Bild mehr existiert

Flash- und IFRAME-Grusskarten können wie normale Bildergrusskarten verwaltet werden. Auch ein Upload via Browser ist problemlos möglich. Wichtig im Zusammenhang mit diesen Spezial-Grusskarten sind folgende Punkte:

• Die Thumbnails müssen von Hand als Grafik (JPG/GIF) erstellt werden und gleich heissen, wie die Flash-/IFRAME-Grusskarte (abgesehen von der Dateiendung). Beispiel: Flash-Grusskarte heisst myflash.swf. Thumbnail muss nun myflash.jpg oder myflash.gif heissen.
  Die gleichzeitige Verwendung eines Dateinamens für eine Spezial- und normale Grusskarte ist nicht gestattet (z.B. Grusskarte mycard.jpg und mycard.swf), da dies zu Problemen bei der Thumbnail-Zuordnung führt.
• Bei Flash-/IFRAME-Grusskarten sollte unter Bilder-Verwalten die Grösse der Flash-Karte bzw. der IFRAME HTML-Seite angegeben werden, da Flash-Animationen in der Regel beliebig vergrössert werden und auch HTML-Seiten eine beliebige Grösse haben können. Die Grössenangabe erfolgt an der Stelle, an der sonst die Grösse des Thumbnails definiert wird und wird dringend empfohlen.

3.2.7. MIDI/WAVE verwalten

Hier kann zu jeder Audio-Datei ein kurzer Titel erfasst werden. Ebenfalls ist es möglich, diese Dateien anzuhören oder zu löschen. Zudem kann via "Filter hinzufügen" für jede Datei ein Filter erstellt werden, in welchen Kategorien die Datei zur Auswahl angeboten werden soll.

Midi's können auch mit einem Zwischentitel versehen werden. Dazu muss die Beschreibung im Format "Zwischentitel~Beschreibung" erfasst werden. Wenn sich der Zwischentitel ändert, wird der automatisch dargestellt. Dateien mit den gleichen Zwischentitel müssen natürlich auch untereinander stehen (Sortierung erfolgt anhand des Dateinamens).

Am Ende der Seite gibt es noch zwei Menüpunkte:

• Neue MIDI/WAVE Datei hinzufügen: MIDI/WAVE Datei via Browser uploaden
• Überflüssige Beschreibungen löschen: Damit wird der Titel aus der Beschreibungsdatei gelöscht, wenn die Audio-Datei nicht mehr vorhanden ist

3.2.8. Fallende Bilder verwalten

Hier kann zu jedem fallenden Bild ein kurzer Titel erfasst werden. Wie schon bei den MIDI-Dateien ist das setzen von Filtern möglich. Zudem können einzelne Bilder gelöscht werden.

Am Ende der Seite gibt es noch zwei weitere Menüpunkte:

• Neues fallendes Bild hinzufügen: Fallendes Bild via Browser uploaden
• Überflüssige Beschreibungen löschen: Damit wird der Titel aus der Beschreibungsdatei gelöscht, wenn das Bild nicht mehr vorhanden ist.

Es ist auch möglich, mehrere Bilder zu gruppieren. Dazu wählt man einfach die gewünschten Bilder aus (Checkbox links neben dem Bild) und wählt am unteren Ende einen Gruppenname (wird angezeigt) sowie einen Dateinamen (keine Dateiendung; relevant für Sortierung) und klickt auf "Gruppe erstellen". Gruppen können dann nachträglich editiert werden, indem der entsprechende Link angeklickt, die GIFs editieren und die Gruppe neu speichern.

Sollte ein Bild nur in der Gruppe und nicht einzeln angezeigt werden, so muss das Beschreibungsfeld bei den entsprechenden Bildern einfach leer gelassen werden. Bilder ohne Beschreibung werden nicht angezeigt.

3.2.9. Templates editieren

Unter diesem Menüpunkt können die verschiedenen Templates editiert werden. Mehr über die speziellen Tags findet man weiter unten in dieser Anleitung. Für umfangreiche Anpassungen ist es möglicherweise einfacher, direkt die Template-Dateien in einem Texteditor zu editieren.

3.2.10. Statistik

Im Menü Statistik befindet sich eine graphische Auswertung, wie viele Karten bereits versendet wurden sowie welche Motive, Effekte und Hintergrundsounds am beliebtesten sind. In diesem Menü können die Daten auch aus der Statistik gelöscht werden.

3.3. Dateisperre

Jeder Schreibzugriff auf eine Datei wird mit einer betriebssystem-unabhängigen Dateisperre versehen. Diese Dateisperre sollte in der Regel wieder aufgehoben werden, kann aber in Ausnahmefällen (z.B. Script-Absturz) erhalten bleiben.

In der Regel kann die Datei wieder via Adminoberfläche entsperrt werden. Falls dies nicht geht, muss die entsprechende lock-Datei gelöscht werden (Beispiel: Lock-Datei für config.pl heisst config.pl.lock).

3.4. Online Versions-Check

Der Online Versions-Check ist eine einfache Möglichkeit, zu überprüfen, ob die eingesetzte Version noch aktuell ist.

Um den Versions-Check zu starten, muss man auf den Link bei der Versions-Nummer unten rechts klicken. Danach wird eine Verbindung mit dem Server von cgicorner.ch hergestellt. Dazu ist eine Internet-Verbindung notwendig.

Es wird nur die Versionsnummer sowie das letzte Änderungsdatum an den Server von cgicorner.ch übermittelt. cgicorner.ch garantiert, dass keine weiteren Konfigurationseinstellungen oder Benutzerdaten gesendet werden. Der Browser übermittelt möglicherweise noch den Referer, der mögliche Informationen über den Einsatzort liefert. Wenn Sie dies nicht möchten, installieren Sie eine Personal-Firewall, welcher die Referer-Informationen blockiert oder kopieren Sie den Link in die Zwischenablage und fügen Sie ihn manuell in die Browser-Adressleiste ein.

Als zweite Möglichkeit steht unter http://www.cgicorner.ch/cgi-bin/jsnews/jsnews.cgi ein Newsletter zur Verfügung. Nach der Anmeldung werden Sie über neue Versionen ihrer gewählten jsStyle-Produkte bequem per Mail informiert.

3.5. Neue Bilder hinzufügen

Das Hinzufügen von zusätzlichen Grusskarten ist sehr einfach: die Grusskarte muss einfach in das definierte Verzeichnis kopiert werden (cards). Wenn es sich nicht um eine JPG-Datei handelt, oder das GD-Modul auf dem Server nicht installiert ist, muss noch ein Thumbnail erstellt und in das Verzeichnis "thumbs" kopiert werden.

Nun kann man in dem Administrationsbereich unter "Bilder verwalten" das Bild einer Kategorie zuordnen und mit einem kurzen Kommentar versehen.

Fertig! Das Bild steht ab sofort zur Auswahl bereit.

4. Templates

Innerhalb der Templates sind einige Steuertags vorhanden. Diese sind immer nach dem Prinzip <!--Steuertag--> aufgebaut. Es stehen nicht alle Tags für jedes Template zur Verfügung. Nachfolgend nun die Auflistung:

Auswahl	Vorschau	Mail		Ansicht				Blacklist	Blacklist Mail	<!--CGIURL--> Vollständige URL zum Grusskarten-Script
Auswahl										<!--cat--> Ausgewählte Kategorie
Auswahl										<!--cat=KATEGORIE:TEXT--> Fügt den Text "TEXT" ein, wenn Kategorie "KATEGORIE" gewählt ist.
Auswahl										<!--catlinks:[Trennzeichen]--> Links zu allen Kategorien, getrennt durch [Trennzeichen]
Auswahl										<!--catlinks:[select]--> Links zu allen Kategorien in einer SELECT-Box
Auswahl										<!--calendar--> Header-Informationen für Kalender
Auswahl	Vorschau	Mail	Sende-best.	Ansicht		Lese-best.				<!--title--> Titel der Grusskarte
Auswahl	Vorschau			Ansicht						<!--message--> Text der Grusskarte
Auswahl										<!--LinkBack--> Link für "Zurück zur vorherigen Seite". Link wird nur angezeigt, wenn mehrere Seiten mit Grusskarten der selben Kategorie vorhanden sind und der Benutzer nicht auf der ersten Seite ist.
Auswahl										<!--LinkForward--> Link für "Weiter zur nächsten Seite". Link wird nur angezeigt, wenn mehrere Seiten mit Grusskarten der selben Kategorie vorhanden sind und der Benutzer nicht auf der Letzten Seite ist.
Auswahl	Vorschau			Ansicht						<!--sendtime--> Eingegebenes Versanddatum, bzw. aktuelles Datum, wenn leer.
Auswahl										<!--notify--> Hat den Wert CHECKED, wenn das Feld Lesebestätigung angekreuzt wurde.
Auswahl										<!--sendcopy--> Hat den Wert CHECKED, wenn das Feld "Kopie an Absender" angekreuzt wurde.
Auswahl	Vorschau			Ansicht						<!--smiley--> Browserpfad zum Smiley-Verzeichnis
Auswahl										<!--userfile--> URL für eigenes Bild
Auswahl										<!--userfileHTML--> HTML-Code für eigenes Bild in Auswahl-Template (inkl. IMG/EMBED-Tag)
Auswahl										<!--userfile_selected--> Hat den Wert CHECKED, wenn eine eigene URL für das Grusskarten-Bild angegeben wurde.
Auswahl										<!--start--> Beginne bei Eintrag X
Auswahl										<!--messagetypehtml--> CHECKED, wenn HTML als Nachrichten-Typ gewählt wurde.
Auswahl										<!--messagetypetext--> CHECKED, wenn Text als Nachrichten-Typ gewählt wurde.
Auswahl	Vorschau	Mail	Sende-best.	Ansicht		Lese-best.			Blacklist Mail	<!--rcptmail--> Mail-Adresse des Empfängers
Auswahl	Vorschau	Mail	Sende-best.	Ansicht		Lese-best.				<!--rcptname--> Name des Empfängers
			Sende-best.							<!--rcpts--> Alle Empfänger, verlinkt mit Mailadresse (Komma-getrennt)
Auswahl	Vorschau	Mail	Sende-best.	Ansicht		Lese-best.				<!--sendermail--> Mail-Adresse des Absenders
Auswahl	Vorschau	Mail	Sende-best.	Ansicht		Lese-best.				<!--sendername--> Name des Absenders
Auswahl										<!--rcptmail_error--> Fehlertext bei falscher/fehlender Empfänger Mail-Adresse
Auswahl										<!--rcptname_error--> Fehlertext bei fehlendem Empfänger Name
Auswahl										<!--sendermail_error--> Fehlertext bei falscher/fehlender Absender Mail-Adresse
Auswahl										<!--sendername_error--> Fehlertext bei fehlendem Absender Name
Auswahl										<!--file_error--> Fehler-Text wenn keine Grusskarte ausgewählt wurde
Auswahl										<!--message_error--> Fehler-Text wenn kein Nachrichtentext eingegeben wurde
Auswahl										<!--sendtime_error--> Fehler-Text bei ungültigem Versandsdatum
Auswahl										<!--maxrcpt_error--> Fehler-Text bei zu vielen Empfängern
Auswahl										<!--SelectMIDI--> Fügt eine Drop-Down Box mit allen Hintergrundmusiken ein. Optional kann eine CSS-Class übergeben werden: <!--SelectMIDI:css_style_name-->
Auswahl										<!--SelectFall--> Fügt eine Drop-Down Box mit den fallenden Bildern ein. Optional kann eine CSS-Class übergeben werden: <!--SelectFall:css_style_name-->
	Vorschau			Ansicht						<!--effects--> HTML-Code für fallende Bilder
	Vorschau			Ansicht						<!--file--> URL zum Grusskarten-Bild
	Vorschau	Mail		Ansicht	Fehler	Lese-best.				<!--id--> Grusskarten ID
Auswahl	Vorschau			Ansicht						<!--midi--> HTML-Code für Hintergrundmusik
Auswahl	Vorschau			Ansicht						<!--userdef1--> - <!--userdef5--> Benutzerdefinierte Felder 1-5
		Mail	Sende-best.		Fehler					<!--cardTTL--> Dauer in Tagen, wie lange die Grusskarte auf dem System gespeichert bleibt
			Sende-best.							<!--notify:[text]--> Text, der angezeigt werden soll, wenn eine Lesebestätigung angekreuzt wurde.
			Sende-best.							<!--sendlater:[text]--> Text, der angezeigt werden soll, wenn die Grusskarte zu einem späteren Zeitpunkt versendet wird.
			Sende-best.							<!--sendnow:[text]--> Text, der angezeigt werden soll, wenn die Grusskarte sofort versendet wird.
		Mail							Blacklist Mail	<!--cardLink--> Link zur Grusskarte/Blacklist
		Mail				Lese-best.			Blacklist Mail	<!--date--> Aktuelles Datum im Mailformat (für Mailheader)
Auswahl	Vorschau		Sende-best.	Ansicht	Fehler		DB-Error	Blacklist		<!--includeFile:[Dateiname]--> Fügt [Dateiname] 1:1 in das Template ein (UNIX-Pfad)
	Vorschau									<!--backLink:[Text]--> Erstellt einen Link, um die Karte nochmals zu bearbeiten. [Text] wird als Linktext verwendet
	Vorschau									<!--backButton:[CSS-Class]:[Text]--> Erstellt einen Button mit der CSS-Klasse [CSS-Class], um die Karte nochmals zu bearbeiten. [Text] wird als Button-Beschriftung verwendet
								Blacklist		<!--SystemMessage--> Benutzerdefinierter Fehler-/Info-Text
Auswahl	Vorschau		Sende-best.	Ansicht	Fehler		DB-Error	Blacklist		<!--imgDir--> Allgemeines Bildverzeichnis, z.B. Poststempel und Kalender-GIF

4.1. <!--catlinks:--> - Tag (Template "Grusskarten-Auswahl")

Für das Grusskarten-Auswahl-Template existiert ein spezieller Tag <!--catlinks:-->, welcher Links zu allen verfügbaren Kategorien darstellt. Das Aussehen dabei ist frei definierbar. Nachfolgend nun einige Beispiele:

Stellt alle Kategorien in einer SELECT-Box dar, welche nach der Auswahl einer Kategorie sofort dorthin wechselt.

Stellt alle Kategorien mit Textlinks nebeneinander dar, getrennt durch " - "

Stellt alle Kategorien mit Textlinks untereinander dar.

Stellt alle Kategorien mit Textlinks untereinander dar (in einer unnummerierten Aufzählung).

4.2. Spezielle Tags für Thumbnails

Für die Auflistung der Thumbnails sind spezielle Tags vorhanden.

Alle Zeilen zwischen <!--SelectStart--> und <!--SelectEnd--> werden für jedes Thumbnail wiederholt.

4.3. Spezielle Tags für Multi-Empfänger / Multi-Empfänger-Fähigkeit in eigenes Template einbauen

Diese Anpassungen sind seit jsCards 1.10 Bestandteil der Standard-Templates. Manuelle Anpassungen sind nur notwendig, wenn ältere Templates mit einer neuen Version eingesetzt werden oder die Templates von Grund auf neu aufgebaut werden.

jsCards erlaubt es, Grusskarten gleichzeitig an mehrere Empfänger zu verschicken. Um nicht von Anfang an jede Menge Eingabefelder für den Empfänger auf der Auswahl-Seite zu haben, hat der Benutzer die Möglichkeit, via Links neue Zeilen hinzuzufügen. Dazu existieren spezielle Tags:

Das Ergebnis könnte dann so aussehen:

<!--MoreRCPTStart-->
<tr>
  <td>Empfänger Name / Mail</TD>
  <td><input type="text" name="rcptXname" value="<!--rcptXname-->" class="input148"/>
      <input type="text" name="rcptXmail" value="<!--rcptXmail-->" class="input148"/></td>
  <td><!--rcptXname_error--> <!--rcptXmail_error--></td>
</tr>
<!--MoreRCPTEnd-->

Nun muss es natürlich noch möglich sein, zusätzliche Empfänger hinzuzufügen. Dafür muss in einem Feld addrcpt die Anzahl zusätzlicher Felder übergeben werden. Ebenfalls muss das Formular an die action "select" übermittelt werden. Dies lässt sich am einfachsten mit etwas Java-Script bewerkstelligen und könnte so aussehen:

<tr>
  <td>mehr Empfänger <input type="hidden" name="addrcpt" value=""/></td>
  <td>
    <a href="javascript:document.select.addrcpt.value='1'; document.select.action.value='select'; document.select.submit();">+1</a>
    <a href="javascript:document.select.addrcpt.value='3'; document.select.action.value='select'; document.select.submit();">+3</a>
    <a href="javascript:document.select.addrcpt.value='6'; document.select.action.value='select'; document.select.submit();">+6</a>
  </td>
  <td>&nbsp;</td>
</tr>

Zudem ist noch ein zusätzliches, verstecktes Feld notwendig:

Ebenfalls sollte das send.template noch angepasst werden, damit in der Sendebestätigung alle Namen angezeigt werden. Dieses müsste neu wie folgt aussehen:

4.4. Kalender in eigenes Template einbinden

Diese Anpassungen sind seit jsCards 1.06 Bestandteil der Standard-Templates. Manuelle Anpassungen sind nur notwendig, wenn ältere Templates mit einer neuen Version eingesetzt werden oder die Templates von Grund auf neu aufgebaut werden.

Nach erfolgter Konfiguration der Pfade im Admin-Bereich müssen noch ein paar Eingriffe im Grusskarten-Auswahl-Template (select.template) vorgenommen werden:

Im HEAD-Bereich muss noch folgende-Zeile eingefügt werden:

Diese Zeile bindet das CSS-Stylesheet sowie den JavaScript-Code für den Kalender ein. Danach muss noch die Zeile mit dem Eingabefeld ersetzt werden:

Der Pfad zum Kalender-Image muss ggf. noch angepasst werden. Das Bild kann natürlich auch durch einen Text-Link oder ein anderes Bild ersetzt werden.

4.5. Dateiupload in eigenem Template erlauben

Diese Anpassungen sind seit jsCards 1.00 Bestandteil der Standard-Templates. Manuelle Anpassungen sind nur notwendig, wenn ältere Templates mit einer neuen Version eingesetzt werden oder die Templates von Grund auf neu aufgebaut werden.

Damit ein Datei-Upload überhaupt möglich ist, muss das Formular mit einem speziellen Encoding-Type versehen werden. Dies wird mit einem zusätzlichen Attibut im FORM-Tag gemacht:

Damit ein hochgeladenes Bild verwendet wird, muss das Feld "file" den Wert "[upload]" haben und das Bild im Feld "uploadfile" sein. Dies wird durch folgenden Code erreicht:

<input type="radio" name="file" value="[upload]"/>
<input type="file" name="uploadfile"/>

4.6. Secure-Code in Template einbinden

Diese Anpassungen sind seit jsCards 1.22 Bestandteil der Standard-Templates. Manuelle Anpassungen sind nur notwendig, wenn ältere Templates mit einer neuen Version eingesetzt werden oder die Templates von Grund auf neu aufgebaut werden.

Der Secure-Code Missbrauchsschutz setzt das GD-Modul voraus. Damit dieser angezeigt werden kann, muss eine ID generiert und ein Eingabefeld für den Secure-Code eingebunden werden. Für die ID ist ein verstecktes Feld notwendig:

Damit das Eingabefeld für den Secure-Code nur bei aktivierter Funktion angezeigt wird, müssen die entsprechenden Zeilen den Tag <!--scyes--> beinhalten. Dies bewirkt, dass die Zeile bei deaktiviertem Secure-Code komplett unterdrückt wird. Diese Zeilen stellen ein Eingabefeld für den Secure-Code dar ("seccode") und bindet eine Grafik ein ("scid" wird als Parameter übergeben).

<!--scyes--><tr><td colspan="3" </td></tr>
<!--scyes--><tr valign="top">
<!--scyes-->  <td>Secure-Code</td>
<!--scyes-->  <td colspan="2"><input type="text" name="seccode" value="<!--seccode-->" class="input300">
<!--scyes-->    <img src="<!--CGIURL-->?action=seccode&amp;id=<!--scid-->"/> <!--code_error--></td>
<!--scyes--></tr>

4.7. Wenn-Abfrage / Text nur in bestimmter Rubrik

Im Auswahl-Template gibt es die Möglichkeit, einen Text nur dann anzuzeigen, wenn eine bestimmte Bedingung erfüllt ist. Dies kann u.a. bei benutzerdefinierten Auswahlfeldern oder bei einem Kategorieabhängigen Text der Fall sein.

4.7.1. Text nur in einer bestimmten Kategorie anzeigen

Falls im Auswahl-Template ein Text nur bei einer bestimmten Kategorie angezeigt werden soll (z.B. Beschreibung einer Kategorie etc.), kann dies mit einer IF-Abfrage gelöst werden:

"Kategoriename" entspricht dem Namen der Kategorie in korrekter Gross-/Kleinschreibung. Das §-Zeichen dient als Trennzeichen. "Text" ist der anzuzeigende Text. Dieser darf auch HTML-Tages (fett, Bilder etc.) beinhalten.

Werden mehrere solche Wenn-Abfragen verwendet, muss jede auf einer eigenen Zeile stehen, z.B.

<!--if:cat=Reisen§Hier findet man Grusskarten rund ums Thema Reisen-->
<!--if:cat=Feiertage§Grusskarte für einen besonderen Anlass gesucht? Hier sind sie richtig!-->
<!--if:cat=Comic§Alles was lustig ist <img src="smiley.gif"/>-->

4.7.2. Select-Felder

Wenn ein benutzerdefiniertes Feld (siehe unten) in einem Auwahlfenster zur Verfügung gestellt wird, muss wieder der richtige Wert ausgewählt werden, wenn die Karte editiert wird. Dazu ist ebenfalls eine IF-Abfrage notwendig:

<select name="userdef1" class="var300">
 <option value="#FFFFFF"<!--if:userdef1=#FFFFFF§ selected-->>weiss</option>
 <option value="#EEEEEE"<!--if:userdef1=#EEEEEE§ selected-->>grau</option>
 <option value="#FFFFAA"<!--if:userdef1=#FFFFAA§ selected-->>gelb</option>
 <option value="#FFCCCC"<!--if:userdef1=#FFCCCC§ selected-->>rot</option>
 <option value="#AAFFAA"<!--if:userdef1=#AAFFAA§ selected-->>grün</option>
 <option value="#AAAAFF"<!--if:userdef1=#AAAAFF§ selected-->>violett</option>
</select>

4.8. Benutzerdefinierte Felder

jsCards stellt fünf benutzerdefinierte Felder zur Verfügung, welche für beliebige Zwecke verwendet werden können. Wird in der Eingabemaske (select.template) ein Feld "userdef1" definiert, wird dessen Wert in der Auswahl, in der Vorschau und in der Kartenansicht angezeigt, wenn der Text <!--userdef1--> eingefügt wird.

Im Beispieltemplate ist dies mit der benutzerdefinierten Hintergrundfarbe demonstriert: Im Auswahl-Template wird das Feld "userdef1" definiert (mittels Auswahl-Box), in der Vorschau und Kartenansicht im CSS-Stylesheet mit "<!--userdef1-->" wieder darauf zugegriffen.

4.9. Smileys in eigenem Template

Diese Anpassungen sind seit jsCards 1.20 Bestandteil der Standard-Templates. Manuelle Anpassungen sind nur notwendig, wenn ältere Templates mit einer neuen Version eingesetzt werden oder die Templates von Grund auf neu aufgebaut werden.

Um Smileys in ein eigenes Template einzubauen, muss wie folgt vorgegangen werden:

• Smileys in einen Ordner hochladen. Die Dateinamen dürfen nicht verändert werden.
• Im Administrationsbereich unter "Grusskarten Einstellungen ändern" den Punkt "Smileys in Text-Beitrag" auswählen und unten den Browserpfad zum Verzeichnis mit den Smileys eintragen.
• Folgender Java-Script-Code in den HEAD-Bereich des Templates einfügen:

  <script language="javascript" type="text/javascript">
  <!--
  function addText(text) {
    textField=document.select.message;
    var caretPos;
    var TFbefore;
    var TFafter;
    var TFselect;
    if (textField.createTextRange) {      // Microsoft Internet Explorer
      theSelection = false;
      // selektierten Text einlesen
      theSelection = document.selection.createRange().text;
      if (theSelection) {          // Markierung vorhanden --> Abbruch (Schutz vor Überschreiben)
        return;
      }
      caretPos = textField.caretPos;    // Cursorposition bestimmen und Text einfügen
      caretPos.text = text;
      textField.focus();          // Feld aktivieren
    } else if (textField.selectionStart != null) {  // Mozilla
      // Text vor und nach Cursorposition in Variable speichern
      TFbefore=(textField.value.substring(0,textField.selectionEnd));
      TFafter=(textField.value.substring(textField.selectionEnd,textField.value.length));
      // Text in Textfeld schreiben
      textField.value=TFbefore+text+TFafter;
      // Cursorposition setzen
      textField.setSelectionRange(TFbefore.length+text.length,TFbefore.length+text.length);
      textField.focus();
    } else {                  // anderer Browser
      textField.value += text;
      textField.focus();
    }
    storeCaret(this);
  }
  function storeCaret(text) {
    if (text.createTextRange) {
      text.caretPos = document.selection.createRange().duplicate();
    }
  }
  //-->
  </script>
  

• Textfeld für Nachrichtentext wie folgt anpassen:
  <textarea name="message" rows="5" onSelect="storeCaret(this);" onClick="storeCaret(this);" onKeyUp="storeCaret(this);" onChange="storeCaret(this);"><!--message--></textarea>
• Buttons für Smileys an beliebiger Stelle platzieren.

  <a onClick="addText(':-)')"><img src="<!--smiley-->/smly_smile.gif" alt=":-)" border="0"/></a>  
  <a onClick="addText(':-D')"><img src="<!--smiley-->/smly_bigsmile.gif" alt=":-D" border="0"/></a>  
  <a onClick="addText(';)')"><img src="<!--smiley-->/smly_wink.gif" alt=";)" border="0"/></a>  
  <a onClick="addText('8-)')"><img src="<!--smiley-->/smly_cool.gif" alt="8-)" border="0"/></a>  
  <a onClick="addText(':-x')"><img src="<!--smiley-->/smly_kiss.gif" alt=":-x" border="0"/></a><br>
  <a onClick="addText(':-O')"><img src="<!--smiley-->/smly_shock.gif" alt=":-O" border="0"/></a>  
  <a onClick="addText(':-(')"><img src="<!--smiley-->/smly_frown.gif" alt=":-(" border="0"/></a>  
  <a onClick="addText(':-[')"><img src="<!--smiley-->/smly_angry.gif" alt=":-[" border="0"/></a>  
  <a onClick="addText(':-X')"><img src="<!--smiley-->/smly_nothingsay.gif" alt=":-X" border="0"/></a>  
  <a onClick="addText(':-p')"><img src="<!--smiley-->/smly_tongue.gif" alt=":-p" border="0"/></a><br>
  <a onClick="addText('???')"><img src="<!--smiley-->/smly_question.gif" alt="???" border="0"/></a>  
  <a onClick="addText(':o)')"><img src="<!--smiley-->/smly_clown.gif" alt=":o)" border="0"/></a>  
  <a onClick="addText('B(')"><img src="<!--smiley-->/smly_blackeye.gif" alt="B(" border="0"/></a>  
  <a onClick="addText('|(')"><img src="<!--smiley-->/smly_sleepy.gif" alt="|(" border="0"/></a>  
  <a onClick="addText('xx(')"><img src="<!--smiley-->/smly_dead.gif" alt="xx(" border="0"/></a>  <br>
  	

4.10. Adressbuch in eigenes Template einbauen

Diese Anpassungen sind seit jsCards 1.20 Bestandteil der Standard-Templates. Manuelle Anpassungen sind nur notwendig, wenn ältere Templates mit einer neuen Version eingesetzt werden oder die Templates von Grund auf neu aufgebaut werden.

Um das Adressbuch in ein eigenes Template einzubauen muss folgender Link an beliebiger Stelle eingefügt werden:

Um das Adressbuch auch noch bei den zusätzlichen Empfängern einzufügen, muss zwischen den Zeilen <!--MoreRCPTStart--> und <!--MoreRCPTEnd--> der Link nochmals eingefügt werden, jedoch muss "rcptname" durch "rcptXname" und "rcptmail" durch "rcptXmail" ersetzt werden.

Um das Adressbuch für den Absender einzubinden, ist die folgende Zeile notwendig. Die Adressbücher für Absender und Empfänger sind unabhängig und können auch getrennt voneinander aktiviert oder deaktiviert werden.

4.11. manuelle Effektvorschau in Auswahl-Template

Bei deaktivierter automatischer Vorschau von fallenden Effekten kann es unter Umständen trotzdem wünschenswert sein, dass der Besucher sich manuell eine Vorschau des Effektes anzeigen kann (bei der Kartenvorschau sieht es den Effekt ja sowieso). Dies kann mit folgendem Link im select.template erreicht werden.

4.12. Bildvorschau als Mouse-Over-Effekt

Diese Anpassungen sind seit jsCards 1.23 Bestandteil der Standard-Templates. Manuelle Anpassungen sind nur notwendig, wenn ältere Templates mit einer neuen Version eingesetzt werden oder die Templates von Grund auf neu aufgebaut werden.

Für die Mouse-Over-Effekte der Grusskartenvorschau sind nur wenige Anpassungen der Templates notwendig. Diese können auch im Template belassen werden, wenn Pop-Up als Vorschauvariante gewählt wurde.

Im CSS-Bereich (<style type="text/css">) müssen folgende Zeilen eingefügt werden:

.ajaxwindow {
  background-color: #ffffff;
  color: #000000;
  border: 1px solid #1155aa;
  font-size: 10pt;
  font-family: Verdana, Tahoma, Arial, Helvetica, Univers, sans-serif;
}
.ajaxframe {
  position: absolute;
  visibility: hidden;
  z-index: 100;
}

Diese dienen dazu, den Layer für die Bildvorschau zu generieren. Der notwendige AJAX-JavaScript-Code wird von jsCards automatisch generiert. Dazu muss an beliebiger Stelle des Templates (vorzugsweise unmittelbar vor </body>) folgender Code eingefügt werden:

5. Weitere Informationen

5.1. Aufruf der Scripts

Für alle Seiten ist immer das gleiche Skript zuständig, welches ja nach übergebener Parameter andere Seiten darstellt.

5.2. Zeitversetztes senden

Damit das zeitversetzte Versenden von Grusskarten klappt, muss das Script mindestens einmal pro Tag aufgerufen werden. Wird nicht täglich eine Grusskarte versendet, so kann das Script noch auf zwei weitere Arten aufgerufen werden. Wichtig: wird das Script an einem Tag nicht aufgerufen, so werden die an diesem Tag zu versendenden Grusskarten nicht versendet, auch wenn das Script zu einem späteren Zeitpunkt aufgerufen wird.

5.2.1. Transparentes GIF auf einer anderen Seite

Auf irgendeiner Seite der restlichen Homepage, welche garantiert einmal pro Tag aufgerufen wird, kann das Script als transparentes GIF eingefunden werden. Dazu muss lediglich ein Image-Tag eingebunden werden: <img src=".../jscards.cgi?action=clear" width="1" height="1"/>.

5.2.2. CRON-Job

Auf UNIX-Systemen kann auch ein Cron-Job eingerichtet werden, der das Script einmal pro Tag aufruft:
0 15 * * * /var/www/cgi-bin/jscards/jscards.cgi > /dev/null

Damit bei versendeten Grusskarten die korrekt URL im Mail erscheint, muss in der jscards.cgi die Zeile

durch die URL ersetzt werden, also z.B.

Tip am Rande: Unter http://www.cronjob.de können Sie ebenfalls Ihre eigenen, kostenlosen Cron-Jobs erfassen. Damit ist sichergestellt, dass die Grusskarten täglich versendet werden. Als aufzurufende URL tragen Sie die komplette URL mit action=clear ein, also beispielsweise "http://www.meinserver.ch/cgi-bin/jscards/jscards.cgi?action=clear".

5.3. Quellenangabe Demo-Bilder

Ganz klar: eigene Motive geben Ihrem Grusskarten-Service eine persönliche Note. Erfahrungsgemäss wandern aber immer wieder einige oder gar alle Beispielmotive in die eigene Homepage (was natürlich nicht verboten ist). cgicorner.ch verwendet deshalb ausschliesslich Bilder, welche zur Weiterverwendung (privat sowie kommerziell) freigegeben sind. Die nachfolgende Tabelle listet zur Transparenz die Herkunft aller Demo-Bilder auf:

(*) Die Genehmigung von Bildern umfasst jeweils folgendes:

• Nutzung der Bilder als Grusskarte auf allen jsCards Installationen (unabhängig von der Domain)
• Weiterverbreitung der Bilder im jsCards-Download-Archiv

Jede Verwendung oder Weiterverbreitung dieser Grafiken ausserhalb von jsCards (entweder in anderen Grusskartensystemen und/oder Bildergallerien etc.) ist in diesen Nutzungsrichtlinien nicht gestattet und bedarf der Einwilligung des Rechte-Inhabers.