Creating Custom Lead Forms for Marketo

In this topic you will learn how to use a Marketo form to capture lead data inside of a Brightcove Player.

The Campaign module provides the ability to create lead forms which allow you to capture viewer information as videos are played inside of Brightcove players. This gives you the ability to include whatever fields you need (visible or hidden) and also give you the ability to take advantage of features like progressive profiling (if available). The lead data is sent to, and processed by, Marketo.

To create a custom lead form, the following steps must be performed.

  1. Create a form
  2. Optional - Style the form using CSS
  3. Copy the form embed code
  4. Create a custom lead form in the Campaign module
  5. Assign the lead form to a player
  6. Validate the form data in Marketo

Creating a form

Marketo provides the ability to create forms to capture viewer information. These forms can be displayed inside of Campaign-enabled Brightcove players. The data that is captured can then be used in customizing future communications. The steps below will create a simple form to capture first name, last name and email address. For complete details on Marketo Forms, see the Marketo documentation.

  1. Login to your Marketo account.
  2. Navigate to Design Studio > Forms and then click New > New Form. The New Form dialog opens.
  3. Enter a Name for the form and click CREATE.
  4. The form designer will open. By default, First Name, Last Name and Email Address fields will be on the form. Edit the field properties and behavior as needed. Click NEXT.
  5. Click the arrow icons to select a form theme. The form theme controls the styling of the form. Click Preview Draft to see a preview of the form. In this example, the Dark theme was selected.
  6. Click Edit Draft to return to the form editor.
  7. Click NEXT.
  8. Configure any additional form settings and click FINISH.
  9. Click APPROVE AND CLOSE.

Optional - Styling the form using CSS

When creating a form, Marketo provides the ability to select a form theme to provide some basic form styling. You can also customize the form using your own custom CSS. In this section, we will customize the Dark theme and make the label text white and bold. For complete details on Marketo Forms, see the Marketo documentation.

  1. Navigate to Design Studio > Forms and then click on your form.
  2. Click Edit Form.
  3. Click Form Settings and then click the gear icon.
  4. Clicking View Theme CSS will display the current theme CSS. Click Edit Custom CSS. Paste in the following CSS code to make the label text white and bold.
      .mktoForm label {
          font-weight: bold;
          color: #FFF;
      }
  5. Click SAVE.
  6. Click Preview Draft to see a preview of the form. The label text should be white and bolded.
  7. Click Edit Draft to return to the form editor.
  8. Click FINISH and then APPROVE AND CLOSE.

Copying the form embed code

To use the form inside of the Campaign module, you will need to copy the form embed code.

  1. In the left navigation, right-click the form and click Embed Code.
  2. Set the Code Type to Normal and then copy the Code to the clipboard. Click Close.

Creating a custom lead form in the Campaign module

Once the form has been created and styled, create a custom lead form in the Campaign module and associate the lead form with a Campaign-enabled player.

  1. Open the Campaign module.
  2. Click Lead Forms in the left navigation. If any lead forms have been created, they will be displayed.
  3. Click Create Lead Form.
  4. Give the lead form a descriptive Name.
  5. Select a Form Language.
  6. Select the Form Timing. The form timing determines when the lead form will be displayed.
    edit lead form (1)
  7. Set the form type to Custom Lead Form.
  8. Paste in the Form HTML from Marketo.
  9. (Optional) Paste in the Confirmation HTML. The confirmation view will be display for 5 seconds and then the video will resume playing. If no confirmation HTML is included, the video will resume playing after the form submission.
    edit lead form (2)
  10. (Optional) Click Preview Form to open a preview of the form.
  11. Click Save to save the lead form.

Assigning a lead form to a player

Once the lead form has been created, it needs to be assigned to a player. Follow these steps to assign a lead form to a player.

  1. Click Campaign Players in the left navigation.
  2. Locate your player and use the Lead Form dropdown list to select the lead form.

The setup is now complete and you are ready to capture lead information. When a video is published using a Campaign-enabled player, the lead form will appear according to the form timing settings.

Validating the form data in Marketo

There are several ways to validate that the form data has been passed to Marketo. Follow these steps to view the form data in Marketo.

  1. Login to your Marketo account.
  2. Click Lead Database.
  3. In the left navigation, expand Group Smart Lists and then click Form Capture SL.
  4. Click the Smart List tab.
  5. In the list of Filters on the right side of the page, locate the Filled Out Form filter. Click and drag the filter to the page.
  6. Enter the name of your form. You can also click the + to browse for your form.
  7. Click Leads at the top of the page to see the filtered lead data.
    lead form data
  8. Click an Id to open the lead detail.
  9. Click the Activity Log tab. Confirm that the form was filled out.
    lead form data