One thing I’ve often thought about—especially when working with Outbound Marketing—is how to integrate a marketing form in the easiest and most efficient way. For Outbound, I really liked using form captures. But when it comes to Real-Time Marketing, let’s be honest… I prefer creating my marketing form in Dynamics 365 and embedding them with the Javascript option on the website.
Most of my forms use a consistent set of fields, so duplicating them across websites is just extra work. My goal? One reusable form, embedded on multiple websites, that still lets me identify where each submission came from—so I can route leads into the right journey.
And yes, that’s totally possible—with one simple script. Let’s dive in!
Step 1: Create a marketing form
First things first:
Go to Feature switches and enable Custom unmapped fields. This allows you to add new custom fields to the form—which we’ll need later to pass dynamic campaign values.
Create a new simple form and add a custom field of type Short Text. Name it something like Campaign, and hide the field from the user (I will not hide it yet for this demo purpose). Use a logical name like campaignValue. We’ll fill this hidden field dynamically via a Javascript we will add in the next step and it will be populated automatically. This same field will also be used for branching in your journey.
You can also add more hidden fields and fill them dynamically in the same way, depending on your use case.
Step 2: Add Javascript to the Marketing Form
Now let’s add a Javascript snippet to your marketing form. This script reads the campaign value from the website and injects it into the hidden field we just created.
Check my article if you need to know how to add Javascript to a marketing form: Read more.
<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>
Step 3: Embed the Form on Your Website
Once your form is ready, publish it and go to the publish options. From there, simply copy the embed Javascript code. You’ll use this same script on any page where you want the form to appear.
Your embed code should look something like this:
<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=1744573451' data-rocket-defer defer></script>
Now here comes the magic:
Just add a <div> above your form script with a data-campaign attribute. This is where you define the campaign value for that specific page:
<div id="formContainer" data-campaign="SpringCampaign2025"></div>
Tip: You can extend this by adding more data-* attributes (e.g., data-website=”xyz”) and handle them with additional JavaScript in the marketing form if needed.
On my WordPress site, it looks exactly like this—and works seamlessly:
Step 4: Create a Journey with Attribute Branches
Now that your form submits a hidden campaign value, let’s create a journey that responds differently based on that field.
- Start with the Marketing Form Submitted trigger.
- Add an attribute branch.
- Set conditions based on the submitted Field Localized Name. You can find this name in the field submission table of the form submission record.
Use the Form Submission Field Snapshot to define the condition. Use the contains operator, and add the field name and value (e.g., campaignValue: SpringCampaign).
That way, the same form can drive different email journeys—depending on the website where it was embedded.
Summary
And that’s it!
Now you’ve got one marketing form you can embed across multiple websites—while still tracking where each contact comes from. This lets you personalize the journey and keep your form management clean and scalable.
You can use this method with any hidden field and value. The possibilities are endless—so get creative!
Final Thought
You might be wondering: why not just use UTM parameters?
While UTM parameters are great for tracking customer acquisition sources, this method focuses on form organization and experience personalization. Instead of managing multiple forms for each use case, you maintain just one—and inject dynamic behavior with Javascript.
