Manage Customer Insights - Journeys forms

This article explains how to edit, unpublish, and manage forms in Customer Insights - Journeys.

Edit a live form

If your form is already published and you need to update it, select the Edit button on the top ribbon. Continue editing your live form. All changes are automatically published when you select the Save button.

The form is stored on a content delivery network (CDN), which caches data to provide the fastest loading times for your webpage visitors. It can take up to 10 minutes for the cache to refresh and for you to see changes on your webpage. To check your changes immediately, add the #d365mkt-nocache parameter to your webpage URL. Don't share links with this parameter with your customers, because it bypasses the CDN cache and slows down page loading.

Unpublish a form

To unpublish a live form, select the Stop button. The form is removed from the CDN, so your web page visitors can't submit it. The form might still appear because of the browser cache, but it can't be submitted. The form status changes to Draft.

Form field properties

When you select a field on the canvas, its properties appear in the right pane.

• Placeholder text: The placeholder inside the field. The placeholder disappears when the user starts typing in the field.
• Default value: Set the default value for this field. The placeholder isn't visible if the default value is set.
• Required: If enabled, the user can't submit the form if this field is empty.
• Validation: Set a rule that checks the content of the field. If the validation rule isn't met, the user can't submit the form. It's important to set the right validation for email, phone number, and similar fields.
• Hide field: If enabled, the field isn't visible in the form. Use hidden fields to store extra metadata with the form submission.

Custom validation

To create custom validation, turn on the Validation option and select Custom. A pop-up dialog appears where you enter a regular expression (RegExp). For example, use a RegExp to check if the entered value matches a specific phone number format.

Style your forms using Theme

Open the Theme section by selecting the brush icon in the right pane. Theme controls the style of all types of fields, buttons, and text. When you set the theme of a field, it affects all fields of the same type in your form.

The theme feature lets you edit CSS class definitions in the form HTML through a user-friendly interface. It works only with out-of-the-box form styles. Custom CSS classes aren't visualized, but you can edit your custom CSS classes using the HTML code editor.

The Theme section lets you configure:

• Background: Set the inner background color and border style for the whole form.
• Text styles: Set Heading 1, Heading 2, Heading 3, paragraph, and field label styles. The field label style doesn't affect checkbox and radio button labels because you set these labels separately. The text style definition includes font family, font size, font color, text style, and line height. You can also set the inner and outer spacing, width, and alignment. In addition to these text styles, you can set the label position (top, left, right) and the required color for your field labels.
• Input fields are grouped into three categories:
  1. Text input, dropdown, and lookup fields: These three field types share the same style definition. Set the font family, size, color, and style for placeholder and input text styles. You can also set the field background color, menu background color, rounded corners, border, size alignment, and inner and outer spacing. Set the field label in text styles.
  2. Radio button: The radio button has its own label configuration, so you set the font family and size. Set the text color, styles, and background color for all options and for the selected option. You can also set rounded corners, width, and inner and outer spacing of your radio buttons.
  3. Checkbox: The checkbox field has its own label configuration, so you set the font family and size. Set different text color, styles, and background color for all options and for the selected option. You can also set rounded corners, width, and inner and outer spacing of your checkboxes.
• Buttons and links: Set the font family, size, color, text styles, button color, border alignment, and inner and outer spacing for buttons. Set the font family, size, color, and text styles for hyperlinks.

Custom fonts

Use custom fonts in your form in two ways:

1. Set the font to "inherit": This option is best for forms embedded into your own page. The form inherits the font from your page.
2. Add your own custom font: This option is best for forms hosted as a standalone page. Upload your custom font using the theme feature in the custom fonts section. You can use your uploaded custom fonts in all text style definitions.

Parent contact for lead

The Lead & Contact audience lets you update a lead and contact entity with a single form submission. Change the audience by using the picker in the top right corner of the form editor.

To use a combined Lead & Contact audience, define how the attributes are mapped to each other. For example, link the contact First Name attribute to the lead First Name attribute, so the form field First Name updates attributes for both entities.

After you select the Lead & Contact audience, you see three sections of fields in the right pane.

Fields in the Contact section update only the corresponding contact attributes. Fields in the Lead section update only the corresponding lead attributes. To update both lead and contact attributes, use a field from the Lead & Contact section. If the Lead & Contact section is empty, define attribute mapping.

When you submit a form using the Lead & Contact audience, two interactions are produced: one for a contact and one for a lead. You see the form submission on both the lead timeline and the contact timeline.

When you create a new journey using the Marketing form submitted trigger, choose whether the journey runs for a lead or a contact. The journey uses the interaction you choose for the trigger (contact or lead). The journey can have only a single audience: contact or lead.

Form settings

Form settings let you set advanced properties for your form and define what happens after form submission.

• Form template: Select a template for your form. Selecting a template deletes all content in your form.
• Prefill: Form Prefill fills all fields in the form.
• Web tracking: Web tracking adds a tracking cookie with the form submission ID to the user's browser when they submit the form. If enabled, the form loader script automatically includes the web tracking script, which creates the tracking cookie. Let users know about cookie usage according to your privacy regulations.
• Audience: Set how to handle duplicate records by selecting the matching rule. Choose whether form submission creates new records or updates existing records. If Update matched contact with submitted data and Create a new contact if there was no match to an existing one? are set to No, the form submission doesn't update or create any record. The form submission can link to an existing record identified by the matching rule. To make sure existing values aren't overwritten by submitted empty values, turn on the Ignore empty values toggle.
• Post submission action: Choose whether to show the Thank you notification or redirect the user to a different page after form submission. The Thank you notification shows for a few seconds, even if Redirect after submission is selected.
• Thank you notification: This message shows when the user submits the form successfully.
• Error notification: This message shows if an error occurs during form submission.
• Double opt-in: If enabled, the double opt-in email is sent after form submission. To use double opt-in for the form, you need a compliance profile with double opt-in turned on.
• Ignore opt-outs: If enabled, the form doesn't create opt-out records, even if the user tries to unsubscribe through the form. Learn more: Ignore opt-outs.

How to handle duplicate records

The default way to handle duplicate records is different for contact and lead entities.

• Contact (default: Update contact using email): When a user submits a form with an existing email address, the form updates the existing record and doesn't create a new record.
• Lead (default: Always create a new record): When a user submits a form with an existing email address, the form creates a new record with the same email address.
• Lead & Contact (default: Update contact using email and always create a new lead): When a user submits a form with an existing email address, the form updates the existing contact and creates a new lead.

Change the default matching rule by using the Duplicate records drop-down in the Forms settings. To learn how to create a custom rule, see custom matching rule.

Create a custom matching rule

A custom matching rule lets you set criteria for identifying existing leads or contacts. This approach helps prevent duplicate records. For more information, see Create custom matching rules.

Ignore empty values

Use the Ignore empty values toggle to control whether empty form fields overwrite existing data. If a form is submitted with an empty field, like phone number, this setting controls whether the existing value stays or is cleared.

• Toggle off (disabled): The existing value is overwritten by the empty input.
• Toggle on (enabled): The existing value stays and isn't replaced by the empty input.

Example: A contact has a phone number saved. When a form is submitted with the phone number field left blank:

• If the toggle is disabled, the phone number is erased.
• If the toggle is enabled, the phone number stays the same.

Manage consent in forms

You can add purposes and topics to your form to let users subscribe to specific types of communication. Each form can only be linked to one compliance profile, so you can't include purposes from multiple compliance profiles in the same form. Learn more: Stay compliant with privacy regulations.

If you need to include purposes from different compliance profiles in one form, you can create a new compliance profile that reuses existing purposes from those profiles.

Example:

• Compliance profile A contains the purpose Commercial A.
• Compliance profile B contains the purpose Commercial B.
• To combine both purposes into one form, create Compliance Profile C and enable the option to use previously captured consent.
• Compliance profile C now includes Commercial A and Commercial B, giving you a single profile linked to all required purposes.

Ignore opt-outs

A form can include multiple purposes and topics. For example, suppose a form has topic A and topic B. A user first subscribes to topic A. Later, the user submits the form again, selecting only topic B and leaving topic A unchecked. This action unintentionally creates an opt-out for topic A.

To prevent these accidental opt-outs, newly created forms enable the Ignore opt-outs toggle by default.

If you want to use the form for consent management, allowing users to unsubscribe from specific topics or purposes, you should turn off the Ignore opt-outs toggle.

Field types

Attribute metadata defines field types and formats. You can't change field types or formats, but you can change the rendering control for field types when the format isn't defined.

Phone number field

For the best results with Customer Insight - Journeys, use the international phone number format starting with a "+" sign. This format lets you collect consent to send text messages. To improve your customer's experience, use the phone number label or placeholder to explain the expected phone number format.

Set the phone number field validation to Phone number. This built-in validation checks if the phone number format meets the requirements for contact point consent creation. The expected format is international, starting with a "+" sign. If your customer enters an invalid phone number, the browser shows the default error message. The forms use the browser's default validation to show error messages if the entered value doesn't match the expected pattern. You can override the default browser validation with custom JavaScript to show your own error messages.

If you don't plan to use the phone number for sending text messages, collect the phone number in any format. In this case, avoid adding consent for the "Text" channel to the form. Contact point consent requires the international phone number format. If the format isn't compatible, the form submission is processed with a warning about the failure to create contact point consent for the entered phone number.

Preset phone number country/region code

If your business is in a single region with the same phone number country/region code, preset the Country/region code parameter of the phone number field.

If the country/region code is preset, the correct phone number country/region code is automatically added when the form is submitted. If the customer enters a phone number that includes the country/region code, the preset country/region code is ignored.

Lookup fields

A lookup field links to a particular entity and lets you add a drop-down list of options to your form that you create in advance. For example, use a lookup field called "Currency" to show a drop-down list of all currencies in your form. Set the default value of the lookup field if needed.

Improperly configured field-level security can prevent lookup fields from working correctly. Make sure field-level security is set up appropriately.

You can set a default value for your lookup field. The default value of a lookup field is determined by its display name. Make sure each display name is unique; duplicate names can cause the system to select a default value at random. If a lookup field has a default value, users must clear it to view the complete list of available values.

Filter a lookup field values based on an answer in a previous lookup field (cascading lookup fields)

The Filter value feature lets you filter the choices in a lookup field based on the user's selection in a previous lookup field, creating a more intuitive and efficient form experience. This dynamic filtering reduces clutter and confusion by showing only relevant options, helping users complete forms faster and with fewer errors. For example, when selecting a city, users only see cities that match the country/region they previously selected, eliminating the need to scroll through irrelevant entries. This leads to higher quality submissions and lowers the risk of form abandonment.

Set up value filtering for a lookup field

A lookup field represents data from an existing table. Filtering between lookup fields relies on a defined relationship between those tables. If no relationship exists, filtering options aren't available. When multiple relationships are defined between the same tables, the form editor allows you to select the appropriate relationship to use for filtering. This ensures that the dependent field displays only relevant values based on the user's selection in the preceding field.

When your form includes two lookup fields, a Filter values button becomes available in the form editor.

Selecting the Filter values button opens a pop-up window where you can configure how the filtering works between lookup fields. In this window, you can specify which lookup field serves as the input for filtering and select the appropriate relationship between the underlying data tables. Once the filtering rule is configured, the field in the form editor changes its highlight from blue to purple, indicating that a filtering relationship has been successfully applied. If the filtering lookup field's value is updated, the dependent lookup field's value is reset to ensure that only valid combinations are submitted.

The lookup fields for country/region and city aren't included by default. To add them to your form, refer to this step-by-step guide that shows how to create a filtered list of cities based on the selected country/region. The guide also offers general guidance on how to define custom lookup fields (entities) and establish relationships between them. This approach can be applied to any scenario where field options need to be dynamically filtered based on prior selections.

Lookup fields also support a JavaScript API, enabling developers to programmatically set a lookup field value or apply dynamic filters based on user input. This allows for advanced customization and seamless integration with other form logic.

Custom mapped fields

The form editor lets you use all attributes of lead or contact entities as form fields. If you create a new custom attribute for a contact or lead entity, it's automatically available as a form field in the editor. This approach lets you easily create reusable form fields.

Form validation

The validation process starts automatically when you publish a draft form or save a live, editing form. Validation checks the form's content and stops publishing if it finds blocking errors, or shows warnings for possible issues.

To start validation manually, select Check content.

Errors that block form publishing

These conditions prevent the form from being published and show an error message:

• The form includes a Submit button.
• All form fields are linked to an editable attribute.
• The form doesn't have any duplicated fields.
• The form includes all attributes required by the matching rule (email field by default).
• The target audience is set.

Warnings that don't stop form publishing

These conditions don't prevent the form from being published, but a warning message appears:

• Make sure the form includes all fields linked to attributes of a selected entity that are required to create or update a record.
• Make sure all required attributes are labeled as required="required" in HTML.

Form submission processing

After you submit the form, you see the submitted values in the Submissions section of the form editor. It can take a few minutes for the entities targeted by the form to update, and for the submission to move from a Pending to a Success state.

The following contact or lead attributes update automatically when the form creates a new record.

• msdynmkt_emailid
• msdynmkt_customerjourneyid
• msdynmkt_marketingformid
• ownerid
• owningbusinessunit (if the business units feature is enabled)
• subject (only for leads — the form name is used as the value)

These attributes don't update when a form submission updates an existing record.

Use submitted values in email personalization and journey branching

You can create a trigger-based journey that starts when a form is submitted. From there, you have two options:

1. Branch the journey using the submitted values: Adjust the path based on answers provided in the form (for example, favorite product, event preferences).
2. Personalize emails using the submitted values: Insert dynamic text or show a summary of what the customer submitted, even when the journey doesn’t reference a contact or lead record (ideal for double opt-in scenarios).

Advanced form customization

To open the HTML editor and show the source code of a form, select the HTML button in the top right corner.

• Customer Insights - Journeys forms can be rendered using JavaScript API, so you can load the form dynamically.
• Inject a marketing form into a react application.
• Extend form events like formLoad, formSubmit, and more.
• Find other ways to customize your forms. Learn more

Customize form CSS

You can change the CSS class definitions in the HTML editor. Editing CSS allows you to achieve more advanced design customizations on top of the possibilities in the form editor.

Add custom JavaScript to your form

All onEvent HTML attributes that trigger JavaScript code, like onClick or onChange, are automatically sanitized (removed from the code).

The following example isn't supported:

<button onClick="runMyFunction()">

As shown in the examples below, place the EventListeners inside the JavaScript code to trigger JavaScript functions.

Example 1: Update the value of a form field using values from other form fields

This example shows a script that combines the first name and last name field values into the full name.

<script>
    const firstName = document.getElementById("firstname-1679394382894"); // The field ID is unique in each form, make sure you replace it with the correct value.
    const lastName = document.getElementById("lastname-1679335991544"); // The field ID is unique in each form, make sure you replace it with the correct value.
    const fullName = document.getElementById("fullname-1679394390062"); // The field ID is unique in each form, make sure you replace it with the correct value.

    firstName.addEventListener('change', updateFullName);
    lastName.addEventListener('change', updateFullName);

    function updateFullName() {
    fullName.value = firstName.value + ' ' + lastName.value;
    }
</script>

Example 2: Populate a hidden field with a UTM parameter value from the URL

UTM sources give important information about where your new leads come from. This example script extracts the UTM source parameter from a URL and puts it in a hidden field.

1. Create a new custom attribute of your lead entity called "UTM source" with the logical name utmsource.
2. Create a new form with "lead" as the target audience. The custom attribute "UTM source" appears in the list of fields.
3. Add the UTM source field to the canvas and set it as hidden in the field properties.
4. Open the HTML editor.
5. Add the following script in the body section. Replace the field ID with the correct value for your form.

<script>
    document.addEventListener("d365mkt-afterformload", updateUTMSourceField());
            
    function updateUTMSourceField() {
        const formField = document.getElementById("utmsource-1679335998029"); // The field ID is unique in each form, make sure you replace it with the correct value.        
        const urlParams = new URLSearchParams(window.location.search);
        const utmSource = urlParams.get('utm_source');
        formField.value = utmSource;
        console.log(utmSource); // for debug only, can be removed
    }
</script>

Reuse this example to enrich your leads with more UTM parameters, like utm_campaign, utm_medium, utm_term, and utm_content.

Customize the form and form submission entities

Add custom attributes to the form or form submission entities to enhance your experience with the form editor.

Integrate a custom captcha into the form

You can integrate custom captcha bot protection services like Google reCAPTCHA into your form.

Custom back-end validation of form submission

It's possible to build custom back-end form submission validation that prevents or extends form submission processing.