Kontakt-Komponente (Contact)

Die Kontakt-Komponente stellt eine digitale Visitenkarte auf den Stand: Foto, Name, Funktion, Telefonnummern, E-Mail-Adressen und Anschrift, dazu ein QR-Code und ein Knopf zum Herunterladen der Kontaktdaten. Besucher können die Karte also nicht nur lesen, sondern den Kontakt mit einem Klick oder einem Scan in ihr Adressbuch übernehmen.

Im Auswahlfeld „Komponententyp" heißt die Komponente Contact.

Anlegen, Platzieren, Größe ändern, Verzerren und Speichern funktionieren wie bei allen Komponenten. Die Schritte sind am Beispiel der Bild-Komponente (Image) beschrieben. Die Reiter „Layout", „Sichtbarkeit" und „Generiert" beschreibt die Seite Einstellung von Layout und Sichtbarkeit.

Die Kontakt-Komponente im Stand-Editor, Reiter „Inhalt"

Die Felder

Abschnitt	Feld	Bedeutung
Person	Name	Vor- und Nachname der Person.
	Funktion / Rolle	Steht klein unter dem Namen, zum Beispiel „Vertrieb Süd" oder „Geschäftsführung".
	Anrede	Auswahl zwischen „Herr", „Frau" und „Divers". Siehe den Hinweis unten.
	Foto (Pfad oder URL)	Das Bild der Person. Über „Durchsuchen" wählen Sie es im Medienmanager aus. Es erscheint rund zugeschnitten.
	E-Mail (Person)	Persönliche Adresse, wird als anklickbarer Link dargestellt.
	Telefon (Festnetz), Telefon (Mobil)	Nummern der Person, ebenfalls anklickbar.
	Fax	Faxnummer. Sie erscheint nicht auf der Karte, wird aber in die Kontaktdatei übernommen.
Organisation	Firmenname	Steht in der farbigen Kopfzeile der Karte.
	E-Mail (Organisation)	Allgemeine Adresse, zum Beispiel info@….
	Webseite	Vollständige Adresse mit https://. Auf der Karte erscheint sie ohne diesen Vorspann.
Adresse	Straße und Hausnummer, PLZ, Ort, Land	Die Anschrift. Sie erscheint als eine Zeile, die Teile durch Mittelpunkte getrennt.
	Adresszusatz	Zusatz wie „Gebäude C". Er erscheint nicht auf der Karte, wird aber in die Kontaktdatei übernommen.
Darstellung	Header Hintergrund (CSS-Farbe)	Farbe der Kopfzeile, zum Beispiel #1b2a4a oder darkred. Ohne Eintrag ein dunkles Blau.
	Header Schriftfarbe (CSS-Farbe)	Farbe der Schrift in der Kopfzeile. Ohne Eintrag ein gebrochenes Weiß.

Kein Feld ist Pflicht. Ausgefüllte Felder erscheinen, leere werden weggelassen: Ohne Firmenname fehlt die Kopfzeile, ohne Foto rückt der QR-Code nach oben.

Die Anrede wirkt derzeit nicht. Das Feld lässt sich ausfüllen und wird gespeichert, aber weder auf der Karte noch in der heruntergeladenen Kontaktdatei taucht es auf. Sie können es also ausfüllen, müssen aber nicht. Soll eine Anrede sichtbar sein, schreiben Sie sie vorerst in das Feld „Funktion / Rolle" oder in den Namen.

Wie die Karte auf dem Stand aussieht

Oben steht die farbige Kopfzeile mit dem Firmennamen und darunter der Webadresse. Links folgen das runde Foto und der QR-Code, rechts Name, Funktion und die Kontaktzeilen, jede mit einem kleinen Symbol. Ganz unten sitzt der Knopf zum Herunterladen.

Die Kontaktzeilen sind aktiv: Ein Klick auf die E-Mail-Adresse öffnet das Mailprogramm des Besuchers, ein Klick auf eine Telefonnummer startet am Handy den Anruf, und die Webadresse öffnet sich in einem neuen Tab.

Expandieren empfiehlt sich hier besonders

Eine Visitenkarte enthält viel Text auf wenig Fläche. Steht sie in der Szene klein neben anderen Komponenten, sind Telefonnummer und QR-Code kaum zu entziffern. Deshalb lohnt es sich gerade bei dieser Komponente, im Reiter Sichtbarkeit den Haken Expandieren erlauben (Popup) zu setzen. Besucher klicken die Karte dann an und sehen sie groß in der Bildschirmmitte.

Im Beispiel unten sind dort eingestellt: 800 Pixel Breite, 600 Pixel Höhe, Hintergrund abdunkeln und Ganze Fläche löst Expand aus, damit ein Klick irgendwo auf die Karte genügt. Wie diese Felder zusammenwirken, beschreibt die Seite Einstellung von Layout und Sichtbarkeit im Abschnitt „Expandieren & Teaser".

Die aufgeklappte Kontaktkarte in der Vorschau: der Stand dahinter ist abgedunkelt, oben rechts schließt das × die Karte wieder

QR-Code und Kontaktdatei

Beide enthalten dasselbe: die Kontaktdaten im Format vCard, das alle gängigen Adressbücher verstehen.

• Der QR-Code wird beim Bearbeiten der Komponente erzeugt und steckt direkt in der Karte. Besucher scannen ihn mit der Kamera ihres Telefons und bekommen den Kontakt zum Speichern angeboten, ohne etwas abzutippen. Erscheint statt des Musters nur ein graues Feld mit der Aufschrift „QR", konnte der Code nicht erzeugt werden; laden Sie die Seite dann neu.
• Der Knopf ⬇ vCard herunterladen legt eine Datei mit der Endung .vcf auf dem Gerät des Besuchers ab. Der Dateiname entsteht aus dem Namen der Person, ersatzweise aus dem Firmennamen, mit Bindestrichen statt Leerzeichen.

Übernommen werden Name, Funktion, Firma, beide E-Mail-Adressen, Festnetz, Mobil, Fax, Webseite und die vollständige Anschrift einschließlich Adresszusatz. Fax und Adresszusatz stehen also in der Datei, obwohl sie auf der Karte nicht zu sehen sind.

Ein Detail beim Namen: Für die Kontaktdatei wird der Name automatisch geteilt, und dabei gilt das letzte Wort als Nachname, der Rest als Vorname. Bei „Ada Fuchs" stimmt das. Bei „Anna von Muster" würde „Muster" als Nachname und „Anna von" als Vorname eingetragen, und bei „Dr. Peter Klein" landet der Titel im Vornamen. Wenn es genau stimmen soll, schreiben Sie akademische Titel besser in das Feld „Funktion / Rolle".

Ausprobieren

Im Editor-Modus ist die Karte sichtbar, aber nicht bedienbar: Der Knopf lädt nichts herunter, und die Links reagieren nicht. Zum Ausprobieren wechseln Sie in die Vorschau, wie auf der Seite Video-Komponente (Video) im Abschnitt „Editor-Modus und Vorschau" beschrieben. Dort können Sie auch das Aufklappen testen.

In der Liste unter dem Stand erscheint eine Kontakt-Komponente automatisch, unter der Überschrift „Kontakt". Das ist meist erwünscht, denn so finden Besucher den Ansprechpartner auch dann, wenn sie die Karte in der Szene übersehen.

Daten von Menschen: Alles, was Sie hier eintragen, ist für jeden Besucher der Messe sichtbar und maschinell auslesbar. Verwenden Sie dienstliche Kontaktdaten und holen Sie die Zustimmung der Person ein, deren Foto und Durchwahl dort stehen.