Praktische Beispiele für die Verwendung der Platzhalter im CF7 Event Tracker Plugin für WordPress
Gerade Firmen benötigen in vielen Fällen mehr dynamische Funktionen in Ihren Kontaktformularen als es Contact Form 7 anbietet.
Einige meiner Kunden erstellen für jedes ihrer Produkte und Dienstleistungen ein eigenes Formular, obwohl sich die geforderten Angaben vom Anfragenden nie unterscheiden.
Du kannst dir sicher vorstellen, dass es in der Formular-Übersicht im WordPress-Backend dieser Webseiten-Besitzer entsprechend chaotisch aussieht.
Ich zeige dir, wie du mit den neuen Platzhalter-Funktionen meines CF7 Event Tracker Plugin dynamische Felder erstellst, um nur ein einziges Formular für viele verschiedene Produkte oder Dienstleistungen zu verwalten.
Die Platzhalter des CF7 Event Tracker Plugin
In der neuen Version 2.1 des CF7 Event Tracker erhältst du eine breite Palette an Platzhaltern, mit denen du deine Kontaktformulare und das Tracking dynamisieren kannst.
Das erlaubt dir eine wesentlich strukturiertere Übersicht und eine effizientere Verwaltung deiner Contact Form 7 Anfrageformulare.
Wo können die Platzhalter verwendet werden?
Ob in den verschiedenen Tracking-Masken oder direkt im Contact Form 7 Formular - Die Platzhalter sind so gut wie überall verwendbar.
In diesen Bereichen kannst du die Platzhalter verwenden:
Formular
Das Formular ist das Herzstück von Contact Form 7. Natürlich musste ich die Platzhalter hier hinzufügen!
Mailing
Sobald der Interessent ein Formular absendet, erhältst du eine Nachricht. In den beiden Email-Körpern des CF7-Formulars kannst du die Platzhalter verwenden.
Google Analytics Event Tracking
Verwende die Platzhalter im Google Analytics Tracking, um verschiedene Angaben des Benutzers an dein Analytics-Konto zu senden.
Individuelles JavaScript
Durch die Verwendung der Platzhalter im individuellem JavaScript kannst du die Benutzer-Daten weiter verarbeiten oder für andere (individuelle) Tracking-Codes verwenden.
HubSpot-Anbindung
Sende alle Informationen, die du durch die Platzhalter erhalten hast auch an HubSpot.
Bitte beachte, dass einige Platzhalter nicht direkt in das HubSpot-Ticket unter "CF7 Event Tracker > Formulare" eingefügt werden können.
Für diese Platzhalter muss du ein Hidden-Feld in deinem Formular einfügen und diese im Reiter "HubSpot" mit dem Platzhalter "{FIELD(id)}" einfügen:
- {GET(parameter)}
- {POST(parameter)}
- {META(identifier)}
- {POSTID}
- {POSTNAME}
- {POSTDESC}
- {POSTURL}
Beispiele für die Verwendung der Platzhalter
Damit du einen Einblick erhältst, was du mit den Platzhaltern alles anstellen kannst, habe ich dir einige Beispiele vorbereitet.
Deiner Fantasie sind natürlich keine Grenzen gesetzt. Verwende die Platzhalter für alle möglichen Bereiche deiner Kontaktformulare.
Die URL der aktuellen Seite in der E-Mail hinzufügen
Nehmen wir an, du möchtest auf deiner Webseite mehrere Dienstleistung anbieten, die deine potentiellen Kunden über ein Kontaktformular anfragen können. Du erstellst für jedes deiner Dienstleistungen eine eigene Landingpage und möchtest auf jeder ein Anfrage-Formular einfügen.
Ohne die Platzhalter hast du 2 Möglichkeiten herauszufinden, für welches Produkt sich dein Besucher interessiert:
- Du erstellst für jedes deiner Dienstleistungen ein eigenes Formular mit den gleichen Feldern. Über die E-Mail kannst du angeben, um welche Anfrage es sich handelt.
Wie bereits am Anfang beschrieben bekommst du ein Chaos in deine Formulare, wenn du einige Dienstleistungen anbietest.
Versuche mal alle Formulare zu bearbeiten, wenn du vergessen hast überall ein Termin-Feld zu einzufügen... - Die noch schlechtere Variante: Du lässt den Benutzer den Namen der Dienstleistung eingeben oder in einer Dropdown-Liste auswählen.
Warum eine Dropdown-Liste, wenn du doch eigentlich eine Landingpage für eine bestimmte Dienstleistung erstellen möchtest? Der Kunde hat sich ja bereits durch die Landingpage entschieden, dass er eine bestimmte Dienstleistung anfragen möchte.
Der Kunde müsste also eine weitere Hürde nehmen, indem er das Dropdown der Dienstleistung auswählt. Das ist schlecht, da jede Hürde im Kontaktformular deinen Besucher zum Abbruch bewegen kann!
Mit den Platzhaltern des Plugins ist es sehr einfach zu identifizieren, welches Produkt der Interessent anfragen möchte.
Verwende dazu einfach einen der beiden Platzhalter {POSTURL} oder {POSTNAME}. Mit beiden kannst du eindeutig identifizieren, über welche Seite der Benutzer das Formular abgesendet hat.
Setze die Platzhalter in dein Formular
So fügst du den Post-Link in deinem Formular ein (Sidebar "Formulare" > Reiter "Formular" im Formular):
[hidden my-pageurl id:pageurl readonly "{POSTURL}"]
Und so kannst du den Titel hinzufügen:
[hidden my-pagename id:pagename readonly "{POSTNAME}"]
Die beiden Zeilen unterscheiden so gut wie gar nicht.
Achte darauf, dass du alle deine Felder im Formular mit einer ID ausstattest. Das wird später wichtig.
Denke auch daran, dass du die entsprechenden Felder in deiner E-Mail angeben solltest (Sidebar "Formulare" > Reiter "E-Mail" im Formular). Das ist ganz üblich in Contact Form 7.
[my-pageurl] [my-pagename]
Ohne diese Zeile in deinem Email-Körper erhältst du die Info nicht.
Das aktuelle Datum und die Zeit verwenden
In manchen Fällen muss der Interessent ein Datum angeben, denn eine Dienstleistung kann oft mit einem Termin verbunden sein. Der Kunde kann dann einen oder mehrere Wunsch-Termine im Kontaktformular auswählen und an dich versenden.
Mit dem Feld [date] kannst du eine Eingabe für ein Datum in deinem Formular hinzufügen. Für Laien sieht der Standard-Wert aber sehr kryptisch aus.
Es wäre doch besser, wenn das Feld bereits mit dem aktuellen Tag ausgefüllt wäre, damit gerade ein deutscher Besucher das besser versteht!
Dafür gibt es den Platzhalter {DATE()}, den du überall dort platzieren kannst, wo ein Datum in einem bestimmten Format benötigt wird.
Ein Beispiel:
[date your-date id:date "{DATE(Y-m-d)}"]
Mit der Verwendung dieses Felds wird dem Besucher das heute Datum im Formular ausgegeben, das er dann nach Belieben bearbeiten kann.
Auf php.net findest du alle Datum-Formate für die Verwendung des Date-Platzhalters.
Datum des Date-Platzhalters modifizieren
Manchmal möchte man aber nicht nur den aktuellen Tag ausgeben lassen. Du kannst nach dem Format noch einen weiteren Wert einfügen, um das Datum nach belieben auszutauschen.
[date your-date id:date "{DATE(Y-m-d;1.1.2021)}"]
Beachte, dass die beiden Werte mit einem Semikolon (;) getrennt werden. Der erste Wert muss immer das Datum-Format sein. Den zweiten Wert kannst du hinzufügen, um das Datum zu bearbeiten.
Eine Übersicht aller möglichen Formate findest du auch auf php.net.
Daten in der URL übergeben
Auch sehr beliebt sind Seiten, die mehrere verschiedene Produkt-Arten präsentieren und auf getrennten Kontaktformularen angefragt werden.
Angenommen wir haben die 3 Produkte "Hosting Small", "Hosting Medium" und "Hosting Large". In der Regel würde man 3 verschiedene Kontaktformulare erstellen.
Auf einer "Verteiler-Seite" bieten wir alle 3 Produkte in einer Gegenüberstellung an. Mit einem Klick auf einen der 3 "Jetzt Angebot anfordern"-Buttons wird der Besucher auf das Kontaktformular weitergeleitet.
Alle 3 Buttons leiten auf die gleiche Seite weiter - mit einem kleinen Unterschied: Jeder Link verwendet einen anderen Wert im Parameter "hosting":
https://example.com/hosting-anfragen?hosting=1 https://example.com/hosting-anfragen?hosting=2 https://example.com/hosting-anfragen?hosting=3
Der Wert 1 wird unser "Small"-Hosting, der Wert 2 das "Medium"-Hosting und der Wert 3 wird dann das "Large"-Hosting.
In unserem Formular fügen wir als nächstes ein Dropdown-Feld mit den entsprechenden Werten ein. Während des Ausfüllens könnte sich der Besucher dann vielleicht doch noch vom Small- zum Medium-Paket umentscheiden.
[select hosting id:hosting default:{GET(hosting)} "Small" "Medium" "Large"]
Durch den Platzhalter {GET(parameter)} wird der Wert aus einem "GET"-Parameter in der URL platziert. Beachte, dass du das Wort "parameter" zu dem entsprechenden Wert vor dem "=" austauschst.
Es gibt auch noch ganz andere Anwendungsfälle. Wenn du zum Beispiel eine Google AdWords Kampagne (UTM-Parameter) in dein Kontaktformular oder das Tracking aufnehmen möchtest. In diesem Fall könnest du ein Hidden-Feld im Formular einfügen oder den Platzhalter direkt in der E-Mail angeben.
Auf Benutzer-Daten zugreifen
Durch einen der vielen Platzhalter kannst du verschiedene Benutzer-Daten an das Formular übergeben, um festzustellen welcher deiner registrierten Benutzer die Anfrage sendet.
Verwende den Platzhalter {USER(parameter)}, um die Daten des aktuellen Benutzers zu erhalten. Sollte der Anfragende nicht auf deiner Webseite eingeloggt sein, wir ein Leerstring "" platziert. In diesem Fall müsste der Besucher z.B. seine Email-Adresse manuell in das Formular eintragen.
[text user-id id:user_id "{USER(user_email)}"]
Der Platzhalter testet zunächst, ob du ein Standart-Wert innerhalb der normalen Klammern "()" eingegeben hast. Sollte der Parameter kein Standard-Wert sein, überprüft das Plugin, ob es einen geeigneten Meta-Wert zum Benutzer gibt.
Auf der Entwickler-Seite von WordPress findest du eine Anleitung, wie du eigene Werte zu deinen Benutzern hinzufügen kannst.
Eine Liste aller Standard-Werte findest du im Hilfe-Tab des Plugins unter "Platzhalter".
Felder vom Formular ins Tracking übernehmen
Nun zu einem Thema, dass du für die HubSpot-Anbindung dringend benötigst: Die Verwendung der CF7-Feld-Platzhalter.
Der Platzhalter {FIELD(id)} lässt dich eine Eingabe des Benutzers im Formular für dein Tracking verwenden. Damit kannst du die E-Mail, den Namen, die Firma, die Nachricht an dich und weitere Informationen des Anfragenden an HubSpot senden.
Ohne die Verwendung dieser Felder wirst du keine ordentliche Anbindung an HubSpot erstellen können. Da jedes Formular anders ist, kann das CF7 Event Tracker Plugin leider nicht automatisch erkennen welches der Felder für den Namen und welches für die Firma verwendet wird.
Vor der Version 2.1 des CF7 Event Trackers konnten die entsprechenden Felder noch mit einer anderen Platzhalter-Struktur verwendet werden.
Solltest du noch Platzhalter wie "%BLOGNAME%" oder "[CF7-FIELD]" verwenden, musst du diese austauschen. Leider habe ich bemerkt, dass diese Struktur der Platzhalter in bestimmten Situationen nicht funktioniert. Deshalb habe ich diese Platzhalter in der Version 2.1 durch andere ersetzt.
In der Platzhalter-Übersicht findest du noch einmal alle Platzhalter, die du in deinen Formularen verwenden kannst.
ID's in Contact Form 7 Felder hinzufügen
Für den Platzhalter {FIELD(id)} benötigst du die ID des Felds. Im Standard-Formular sind diese ID's nicht enthalten. Achte also bitte darauf, wenn du alle Funktionen des CF7 Event Tracker verwenden möchtest!
Um dein Formular zu erweitern musst du nur nach dem Namen des Felds die Angabe "id:id-name" hinzufügen.
Ein paar Beispiele:
[text* your-name id:name] [email* your-email id:mail] [select my-dropdown id:dropdown "Value 1" "Value 2" "Value 3"]
Das ermöglicht es die Felder per ID anzusprechen. In den meisten Fällen (vor allem bei JavaScript) ist es dringend notwendig einen eindeutigen Identifier für das entsprechende Feld zu verwenden.
Alle Platzhalter in der Übersicht
Formular-Platzhalter
Blog-Platzhalter
Seiten-Platzhalter
Spezielle-Platzhalter
Hast du Fragen zum CF7 Event Tracker?
Feel Free - Ich helfe dir gerne bei Fragen, falls du Ideen und Wünsche hast oder wenn Hilfe mit dem CF7 Event Tracker benötigst. Kontaktiere mich gerne über das Kontaktformular. Gib bitte deine Webseite oder deine Purchase-Email-Adresse an, wenn du das CF7 Event Tracker Plugin bereits gekauft hast.
Du hast das WordPress-Plugin noch nicht, bist aber auf den Geschmack gekommen? Alle Funktionen und häufig gestellte Fragen des CF7 Event Tracker Plugin findest du auf der offiziellen Seite.
Das konnte dich auch interessieren
Kommentare
Sei der Erste, der einen Kommentar erstellt!