Eine Sache, über die ich – besonders im Zusammenhang mit Outbound Marketing – oft nachgedacht habe: Wie kann man ein Marketingformular möglichst einfach und effizient integrieren?
Im Outbound Marketing mochte ich die Form Captures wirklich gern. Aber wenn wir ehrlich sind… im Real-Time Marketing erstelle ich meine Formulare lieber direkt in Dynamics 365 und binde sie per Javascript auf der Website ein.
Die meisten meiner Formulare verwenden immer wieder die gleichen Felder. Diese für jede Website zu duplizieren, ist reine Fleißarbeit.
Mein Ziel? Ein wiederverwendbares Formular, das ich auf mehreren Websites einbetten kann – und trotzdem weiß, von welcher Seite die Einsendung stammt, um die Leads in die richtige Journey zu schicken.
Und ja, das geht! Mit einem ganz einfachen Script.
Schritt 1: Marketingformular erstellen
Los geht’s:
Wechsle zu den Feature Switches und aktiviere Custom unmapped fields. Damit kannst du neue benutzerdefinierte Felder zum Formular hinzufügen – genau das brauchen wir, um dynamische Kampagnenwerte zu übergeben.
Erstelle nun ein einfaches Formular und füge ein benutzerdefiniertes Feld vom Typ Short Text hinzu. Gib dem Feld zum Beispiel den Namen Campaign und verstecke es (für diese Demo lasse ich es sichtbar). Als logischen Namen verwende ich campaignValue.
Dieses versteckte Feld werden wir später automatisch per Javascript befüllen – es dient auch als Grundlage für die Verzweigungen in deiner Journey.
Du kannst natürlich auch mehrere versteckte Felder einfügen und auf dieselbe Weise dynamisch befüllen – je nach Use Case.
Schritt 2: Javascript zum Marketingformular hinzufügen
Jetzt kommt der Javascript-Teil. Dieses Snippet liest den Kampagnenwert von der Website aus und fügt ihn automatisch in das versteckte Feld campaignValue ein.
Falls du noch nicht weißt, wie man Javascript in ein Marketingformular integriert, schau dir diesen Artikel an: Hier mehr lesen.
<script>
(function () {
/**
* Retrieves the value of a the attribute from the form container.
* Falls back to <body> if #formContainer is not found.
*/
function getAttributeFromPage(attribute) {
const container = document.querySelector('#formContainer') || document.body;
return container.getAttribute(attribute) || null;
}
/**
* Finds the campaign input field in the form and sets its value from the attribute.
*/
function injectFieldValues() {
const campaign = getAttributeFromPage('data-campaign');
const campaignInput = document.querySelector('[name="campaignValue"]');
if (campaign && campaignInput) {
campaignInput.value = campaign;
}
}
/**
* Uses MutationObserver to wait for the form to become available in the DOM.
* Once the form is detected, it injects the campaign value.
*/
function watchForFormLoad() {
const observer = new MutationObserver((mutations, obs) => {
const formReady = document.querySelector('[data-targetproperty]') && document.querySelector('.submitButton span');
if (formReady) {
injectFieldValues();
obs.disconnect(); // Stop watching once we're done
}
});
observer.observe(document.body, {
childList: true,
subtree: true
});
}
/**
* Waits for Marketing form load event before starting.
*/
document.addEventListener('d365mkt-afterformload', function () {
watchForFormLoad();
});
})();
</script>
Schritt 3: Formular auf deiner Website einbetten
Sobald dein Formular fertig ist, veröffentliche es und öffne die Publish Options.
Dort kopierst du einfach den Javascript Embed Code. Diesen kannst du auf allen Seiten verwenden, auf denen du das Formular einbetten willst.
Der Code zum Einbetten sieht in etwa so aus:
<div
data-form-id='4fe1d6e7...46c848'
data-form-api-url='https://public-eur.mkt.dynamics.com/api/v1.0/orgs/f3be5b81-...248550/landingpageforms'
data-cached-form-url='https://assets1-eur.mkt.dynamics.com/f3be5b81-06a3-ef11-8a66-000d3a248550/digitalassets/forms/4...46c848' ></div>
<script data-minify="1" src = 'https://paulinekolde.info/wp-content/cache/min/1/eur/FormLoade/FormLoader.bundle.js?ver=1758722236' data-rocket-defer defer></script>
Füge über dem Script ein weiteres <div> mit dem Attribut data-campaign ein. Damit übergibst du die Kampagnenkennung für diese bestimmte Seite:
<div id="formContainer" data-campaign="SpringCampaign2025"></div>
Tipp: Du kannst auch weitere data-*-Attribute wie data-website=“xyz“ hinzufügen und diese bei Bedarf mit zusätzlichem JavaScript auslesen.
Auf meiner WordPress-Seite sieht das dann zum Beispiel so aus:
Schritt 4: Journey mit Attribut-Verzweigungen erstellen
Da das Formular jetzt einen versteckten Kampagnenwert überträgt, erstellen wir eine Journey, die dynamisch darauf reagiert.
So geht’s:
- Starte mit dem Trigger Marketingformular übermittelt
- Füge eine Attribut-Verzweigung hinzu.
- Definiere die Bedingung basierend auf dem übergebenen Feldnamen (Field Localized Name).
Den Field Localized Name findest du im Formular-Einreichungsdatensatz (Submission Table).
Verwende dann Form Submission Field Snapshot als Bedingung. Stelle den Operator auf enthält und füge das Feld mit dem gewünschten Wert ein, z. B. campaignValue: SpringCampaign.
So kannst du mit einem Formular unterschiedliche Journeyverzweigungen auslösen, je nachdem, wo es eingebettet war.
Zusammenfassung
That’s it!
Jetzt hast du ein einziges Marketingformular, das du auf mehreren Seiten einbinden kannst – und trotzdem weißt du, woher jeder Kontakt kommt.
Das macht deine Journey zielgerichteter und dein Formularmanagement wesentlich einfacher.
Du kannst dieses Prinzip mit beliebigen Feldern und Werten nutzen – also sei kreativ!
Noch ein Gedanke…
Vielleicht fragst du dich: Warum nicht einfach UTM-Parameter verwenden?
Ganz einfach:
UTM-Parameter sind super zur Analyse der Herkunft eines Leads. Aber diese Methode hier dient einem anderen Zweck: Formulare organisieren und die Benutzererfahrung personalisieren. Statt für jeden Anwendungsfall ein neues Formular zu bauen, nutzt du eins – und steuerst dynamisches Verhalten per JavaScript.
Eine Antwort
URL Parameter funktionieren genauso gut und sind unter Umständen sogar eleganter.
Eventformulare das auch genauso.
Für deinen Fall würde man an die URL ?campaignValue=myCampaign“ anhängen und könnte die Personalisierung auf per Seitenaufruf mit einem entsprechenden Link erzeugen und sogar durch einen personalisierten Link ohne UTM-Parameter in einer Email.
Auslesen des Parameters dann mit
var cV = new URLSearchParams(window.location.search).get(‚campaignValue‘);
Kein zusätzliches HTML was eingebunden werden muss. So kann sogar die gleiche Seite mit dem Formular unterschiedlich personalisiert werden