The Marketo Form component is quick and easy way to add a Marketo form to a page without using the embed code. The form update enables the ability to overide the Marketo stylesheet and provides options to control the form design to better suite the various design layouts without having to involve the Marketo team. In order to take advantage of all the new component features, existing form components must have the authoring templates updated to the latest version.

View instructions to update the Marketo UTA form authoring template to existing form components and enable the new formatting features.

Component fields

1) Add the Marketo form ID.

2) Add an H2 title -- optional

The title appears above the form eliminating the need to embed the form UTA component to add a title.

3) Add a description -- optional

Add a description that will display between the title and the form, add additional html formatting if needed.

4) Select desired text color

The text color default is black and applies to the description, field labels, and thank you message

5) Enter descriptive button text

The CTA field provides the ability to use better descriptive copy and enhancing analytics

6) Select desired CTA button color

This applies to the CTA button background color, the default is green and can be changed to black or white depending on the form background. For EBV, the green color will automatically be switched to EBV blue by the site's stylesheet.

7) Select desired form background color

The background default is transparent, but can be changed to solid black, grey, or white depending on the page background color

8) Select desired label display

The label display options are left align (label and field side by side on the same row) by default, top (label and entry field wrapped on a single column), and placeholder hybrid (label appears in the entry field until the cursor is placed in the entry field and then the label moves to display above the entry field)

9) Add custom thank you message

The default text color is black but can be changed using HTML inline styling

10) Dowload

This line will appear immediately following the thank you message. It will notify the user of the download time in seconds. If this form does not involve a download document, this copy can be removed.

11) Enter the desired download time (download time is in seconds)

12) Add download document URL

This eliminates the need to involve the Marketo team

13) Select desired download target

All downloads should open in a new window

14) Enter a maximum form width

The form width default is 100%, this feature will affect all UTA forms already in use and will cause the form and button to expand full with of the it is placed in. The new authoring template must be implemented in order to get the max width field option.

15) Enter label width a maximum form width

the default field label and field columns are at 50/50

15) Enter bottom margin

Sometimes the form can display too close to the footer, this allows the option to add a margin with additional spacing below the form

16) Save and Close your changes.

Update the Marketo UTM Ready authoring template

A UTM ready form will display slightly different as some of the default features will display but not all new features will display in the form. It will be obvious as the below form will display the button for and button at full with off it's container and no longer abide by the Marketo stylesheet width defaults. The below is an example how an active UTM ready form will display:

1) Open the form in edit mode, select Apply Authoring Template

2) Select libraries to navigate to the Global Design Library

3) Navigate to the Design Library to find the Marketo UTM Ready authoring template

4) Select the template as well as the following options:

Add new elements
Remove existing elements
Replace elements that have changed type (without auto data conversion)

5) CLICK OK, SAVE and CLOSE the form. Reopen the form to see your new formatting features.

Complementary Content

${loading}