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!

CF7 Event Tracker - Platzhalter im Formular
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.

CF7 Event Tracker - Platzhalter im Mailing
Google Analytics Event Tracking

Verwende die Platzhalter im Google Analytics Tracking, um verschiedene Angaben des Benutzers an dein Analytics-Konto zu senden.

CF7 Event Tracker - Platzhalter Google Analytics Tracking
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.

CF7 Event Tracker - Platzhalter im individuellen JavaScript
HubSpot-Anbindung

Sende alle Informationen, die du durch die Platzhalter erhalten hast auch an HubSpot.

CF7 Event Tracker - Platzhalter im HubSpot-Ticket

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:

  1. 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...
  2. 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}"]
 
CF7 Event Tracker - Platzhalter Produkte identifizieren

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.

CF7 Event Tracker - Platzhalter Ausgabe der Produkt-Identifizierung

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.

CF7 Event Tracker - Platzhalter Wunschtermin

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.

CF7 Event Tracker - Platzhalter Wunschtermin ausgef├╝llt

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.

Format Beschreibung
1.1.2021 Damit kannst du einen eindeuten Tag festlegen. In diesem Beispiel der erste Januar 2021.
+1 day Mit dieser Angabe erh├Ąltst du das morgige Datum. Alternativ kannst du auch "tomorrow" eintragen.
-1 day Du erh├Ąltst das gestrige Datum. Alternativ kannst du auch "yesterday" eintragen.
+1 month Das gleiche wie "+1 day" nur mit dem Monat. Das gleiche gilt auch f├╝r das Jahr "+1 year".
+1 day +1 year Morgen in einem Jahr. Die Angaben wie oben beschrieben lassen sich nach belieben kombinieren.
Monday Du erh├Ąltst das Datum des n├Ąchsten Wochentags. In diesem Fall "Montag".

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

Platzhalter Beschreibung
{FORMID} Die ID des aktuellen Formulars ├╝ber die eine Anfrage versendet wird.
{FORMTITLE} Der Titel des Formulars ├╝ber die eine Anfrage versendet wird.

Blog-Platzhalter

Platzhalter Beschreibung
{BLOGID} Die ID deines Blogs. Diese kann interessant sein, wenn du ein WordPress-Multisystem besitzt.
{BLOGNAME} Der Titel deiner WordPress-Webseite. Zu finden in "Einstellungen > Allgemein".
{BLOGDESC} Die Beschreibung deiner WordPress-Webseite. Ebenfalls zu finden unter "Einstellungen > Allgemein".
{BLOGURL} Die Basis-URL zu deiner Webseite. In der Regel ist das deine Startseite.
{BLOGVERSION} Die Version deines WordPress-Systems.
{BLOGLANG} Die Sprache deines WordPress-Systems.

Seiten-Platzhalter

Platzhalter Beschreibung
{POSTID} Die ID deines Blogbeitrags oder deiner Seite.
{POSTNAME} Der Titel deiner Seite. Das ist entweder der Seitentitel oder Beitragstitel. Solltest du YOAST auf deiner WordPress-Webseite installiert haben, wird stattdessen dieser Titel verwendet.
{POSTDESC} Die Beschreibung deiner Seite. Die Beschreibung wird automatisch von WordPress erstellt. Alternativ kannst du diese auch unter "Textauszug" angeben, wenn du eine individuelle Beschreibung m├Âchtest. Solltest du YOAST installiert haben, wird die Beschreibung des Search-Snippets verwendet.
{POSTURL} Der Link zu deiner Seite auf der das Kontaktformular abgesendet wurde.

Spezielle-Platzhalter

Platzhalter Beschreibung
{DATE(format;modifier)} Mit diesem Shortcode kannst du das aktuelle Datum oder die aktuelle Zeit zum Zeitpunkt des Aufrufs des Kontaktformulars platzieren. Durch den Wert "modifier" kannst du das heutige Datum ├Ąndern. Eine genaue Erkl├Ąrung findest du im Thema Das aktuelle Datum die Zeit verwenden. Achte darauf, dass die beiden Werte mit einem Semikolon (;) getrennt sind.
{GET(parameter)} Erhalte einen Parameter aus dem aktuellen Link mit der Angabe des "parameter". Sollte der Parameter nicht gesetzt sein, wird ein Leerstring "" ausgegeben.
{POST(parameter)} Mit diesem Platzhalter kannst du die Werte ├╝ber die $_POST-Variable auslesen. Das ist hilfreich, falls du vor dem CF7-Formular ein weiteres Formular erstellen m├Âchtest, dessen Werte du an das Anfrageformular weitergeben m├Âchtest.
{FIELD(id)} Verwende diesen Platzhalter um Zugriff auf die Eingaben des Benutzers zu erhalten. Achte darauf, dass die ID des Felds angegeben wird, nicht der Feldname! In JavaScript kann auf den Namen des Felds nicht zuverl├Ąssig zugegriffen werden.
{USER(parameter)} Dieser Platzhalter wird dazu verwendet, um Daten vom registrierten Benutzer zu erhalten. Der Benutzer muss dazu eingeloggt sein, ansonten wird der Platzhalter durch einen Leerstring ersetzt.
{META(parameter)} Erstelle Meta-Variablen auf der Seite, die das CF7-Formular enth├Ąlt. Vielleicht kennst du diese Meta-Variablen auch unter dem Namen "Eigene Felder". In diese Felder kannst du einen "Namen" (entspricht dem "parameter" im Platzhalter) und einen Wert eingeben. An der Stelle des Platzhalters wird dann der Wert des Meta-Felds eingef├╝gt.

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.

 

Codepalm
Platzhalter in Contact Form 7 Formulare verwenden