vCards mit TYPO3 erstellen. Wie lassen sich vCards im TYPO3 CMS erstellen, damit Besucher sie direkt herunterladen und in ihren Kontakten abspeichern können?
Was sind vCards?
Eine vCard ist eine Art elektrische Visitenkarte. Typischer Weise wird auf der Unternehmenswebsite auf der Profilseite eines Mitarbeiters ein Download-Link für seine vCard angeboten. Der Besucher kann dann durch Anklicken des Links die vCard herunterladen oder direkt in sein Adressbuch übernehmen.
vCards mit TYPO3 erstellen: Einsatz von Extensions
Haben sich vCards vor einigen Jahren noch größter Beliebtheit erfreut, so ist es um sie mittlerweile etwas still geworden. Vielleicht, weil sich die Unternehmensmitarbeiter zunehmend über Portale wie beispielsweise LinkedIn oder Xing vorstellen.
Früher gab es für TYPO3 eine Reihe von Extensions für die Erstellung von vCards. Manche auch mit Anbindung an tt_addresses oder tt_news. Die wohl bekanntesten waren:
- vcard
- simplevcard
- neeg_vcard
- wt_directory
Diese Extensions wurden jedoch nicht weiterentwickelt und die Kompatibilität endet mit TYPO3 in Version 4.x oder 6.0.99. vCard-Extensions, die mit TYPO3 in Version 7 oder gar höher kompatibel sind, sucht man vergeblich. Aktuell (Stand 07.2018) gibt es keine Extension mehr, mit der sich auf einfachem Wege vCards mit TYPO3 erstellen lassen.
Dabei haben vCards nach wie vor ihre Existenzberechtigung. Kunden und Geschäftspartnern wird die Möglichkeit gegeben, per Klick und sich daran anschließenden Import einfach und komfortabel alle relevanten Daten zum Ansprechpartner abzuspeichern und jederzeit verfügbar zu haben. Dies trägt nicht zuletzt zur Kundenbindung bei.
Eigene vCards mit TYPO3 erstellen
Mit entsprechenden Kenntnissen ist es auch ohne Einsatz von Extensions möglich, in TYPO3 vCards zu erstellen.
Folgende Voraussetzungen sind erforderlich:
vCard-Standards
Um vCards zu erstellen, sollten Sie über entsprechende Kenntnisse und Hintergrundinformationen zum vCard-Format verfügen. Auf Wikipedia stehen umfangreiche Informationen zu den vCard-Standards 2.1, 3.0 sowie 4.0 bereit.
Eine typische vCard im Standard 3.0 sieht folgendermaßen aus:
BEGIN:VCARD VERSION:3.0 N:Mustermann;Erika;;Dr.; FN:Dr. Erika Mustermann ORG:Wikimedia ROLE:Kommunikation TITLE:Redaktion & Gestaltung PHOTO;VALUE=URL;TYPE=JPEG:http://commons.wikimedia.org/wiki/File:Erika_Mustermann_2010.jpg TEL;TYPE=WORK,VOICE:+49 221 9999123 TEL;TYPE=HOME,VOICE:+49 221 1234567 ADR;TYPE=HOME:;;Heidestraße 17;Köln;;51147;Germany EMAIL;TYPE=PREF,INTERNET: URL:http://de.wikipedia.org/ REV:2014-03-01T22:11:10Z END:VCARD
Integration eines Mitarbeiterbildes in die vCard
Nicht zwingend erforderlich aber oft gewünscht ist, dass bei der vCard auch ein Bild des Mitarbeiters dabei ist. Der unter Wikipedia vorgestellte Ansatz für die Integration eines Bildes Mittels Angabe einer URL sieht so aus:
PHOTO;TYPE=JPEG:http://example.org/photo.jpg
Dieses Vorgehen funktioniert unserer Erfahrung nach in keinem der vCard-Standards – zumindest nicht für Adressbücher wie die von Outlook oder Android.
Einen Ausweg bietet eine Base64-Codierung des Bildes. Die Konvertierung lässt sich über Base64 Image Encoder realisieren – beispielsweise mit: https://www.base64-image.de/
Erstellung der vCard in TYPO3 Mittels TypoScript
In TYPO3 können Sie eine vCard ohne Extension und ausschließlich mit Hilfe von TypoScript erstellen.
In der Regel möchten Sie nicht nur für einen, sondern für eine Vielzahl von Mitarbeitern vCards erstellen. Dann ist folgendes Vorgehen empfehlenswert:
- Sie erstellen eine eigene Inhaltsseite – beispielsweise mit dem URL-Pfadsegement /vcard
und integrieren dort ein Extension-Template. - Auf der Profilseite des Mitarbeiters wird ein Link eingerichtet, dem über die URL die Zielseite, die ID der Profilseite sowie die typeNum mitgegeben wird. Zum Beispiel:/vcard?id=123&type=5000
Klickt der Benutzer den vCard-Link an, so wird er zur vCard-Inhaltsseite weitergeleitet und die erforderlichen Parameter werden über die URL bereitgestellt. - CONSTANTS
Auf der vCard-Inhaltsseite wird in den CONSTANTS des Extension-Templates der Wert der ID aus der URL ausgelesen. Für jeden Mitarbeiter (identifizierbar über die ID) wird mittels einer Condition [globalVar = GP: id = 123] geprüft, um welchen Mitarbeiter es sich handelt und entsprechende globale Variablen mit den zugehörigen Werten befüllt (Name der vCard, Vorname, Nachname des Ansprechpartners, Adresse, Telefonnummer usw.). - SETUP
Im SETUP erstellen Sie ein eigenes PAGE-Object, in diesem Fall mit typeNum = 5000.
Nun schalten Sie den Standard-Headercode ab und integrieren einen eigenen vCard-Header, der die Ausgabe der vCard initiiert. Das Page-Object wird jetzt noch mit den globalen Variablen befüllt, die vorher in den CONSTANTS definiert wurden. Je nach dem Wert der ID, welcher über die Variable in der URL übergeben wird, werden somit die Daten des gewünschten Mitarbeiters in die vCard geschrieben und seine individuelle vCard erstellt.
vCards in TYPO3: ergänzende Informationen
- Da die Einpflege der Mitarbeiterdaten bei einer größeren Anzahl von Mitarbeitern aufwendig – und aufgrund der Datenstruktur der vCards auch fehleranfällig – ist, haben wir noch eine kleine PHP-Datei geschrieben. Dort lassen sich die Einträge zu jedem Mitarbeiter übersichtlich über Variablen vornehmen, die in ein Array gefüllt werden. Das Array wird anschließend über eine Schleife ausgelesen und komfortabel die fertige Ausgabe erstellt, die nur noch per Copy & Paste in die CONSTANTS im TYPO3 Extension-Template zu übernehmen ist.
- Werden Base64-codierte Bilder eingesetzt, so ist bei ca. 5 Mitarbeitern Schluss. Denn die Base64-Codes sind sehr lang und die Anzahl der in den CONSTANTS eintragbaren (und in der Datenbank abspeicherbaren) Zeichen begrenzt. Ein Ausweg ist, für jedes Mitarbeiterbild ein eigenes Extension Templates zu erstellen und dieses dann in das Haupttemplate zu laden (Basis-Template einschließen:).
Stichwörter: vCards mit TYPO3 erstellen
Hallo.
Danke für den Artikel. Das Grundsätzliche zu vCards ist interessant und der Ansatz, ohne Plugin auszukommen auch.
Aber eine Condition pro Mitarbeiter??? Conditions sind ein Performance-Killer… Warum nicht ein CASE-cObject nutzen?
Und via PHP-Script für die einzelnen Mitarbeiter TypoScript erzeugen? Zuvor wurde schon die Fehleranfälligkeiten der Daten erwähnt – warum dann nicht die Daten in die Datenbank verfrachten (samt TCA mit passender Validierung) und im TypoScript auf die Tabelle zurückgreifen (egal, ob via RECORDS-cObject oder via DataProcessor)?
Viele Grüße
Julian
Hallo Julian,
vielen Dank für die Anregungen. Auf dem Mini-Profilbild ist nicht so viel zu erkennen. Aber wenn ich mich nicht täusche, bist Du einer von den TOP-TYPO3-Profis aus dem T3-Forum? 🙂 Dann habe auch ich schon von Deinen Tipps profitiert – vielen Dank an dieser Stelle!
Ich bin sicher, dass man vCards wesentlich eleganter lösen kann, am besten gleich mit einer eigenen, neuen Extension. Anders bekommt der „Otto-Normal-User“ gar nicht – wie vorgeschlagen – die Infos in die Datenbank, um sie dann wieder auszulesen.
Nun sind wir hier keine Extension-Entwickler und brauchten vor 3 Jahren schnell eine funktionierende Lösung. Die damals existierenden Extensions waren leider alle outdated. Daher haben wir auf die Schnelle etwas zusammengestrickt, was zumindest funktioniert hat und haben den Ansatz im Blog vorgestellt. In der Hoffnung, dass vielleicht der eine oder andere, der vor derselben Herausforderung steht, von den Ansätzen profitiert. Was du da beschreibst klingt definitiv professioneller – keine Frage! Aber ich befürchte, ohne eine ausgearbeitete Anleitung oder eine fertige Extension werden die meisten das nicht selbst umsetzen können. Es ist ja auch nicht jeder ein Georg Ringer, der so was noch im Halbschlaf professionell realisieren kann.
Falls du vorhaben solltest, den Lösungsweg auf deiner Website, deinem Blog oder wo auch immer in einer Anleitung vorzustellen, verlinken wir gerne darauf! Oder stellen auch gerne eine neue vCard-Extension vor.
P.S.: und, ja, auch uns wurde es zu aufwendig, neue vCard-Einträge auf diesem Wege zu erstellen. Daher haben wir das Verfahren zwischenzeitlich geändert und so funktioniert es für uns jetzt besser. Eignet sich allerdings nur dann, wenn man nur ab und an eine neue vCard benötigt / einzupflegen hat.
Viele Grüße
Stefan