Skip to main content

On April 3rd, 2017 Vidyard will be switching to a new user interface. Click here to learn more.

Vidyard Knowledge Center

Place a MAP form in an Event

Most Marketing Automation Platforms (MAPs) and Customer Relationship Management (CRM) platforms allow you to create forms that can be embedded outside of MAP hosted pages. These forms can be embedded in Vidyard Events (which host Calls to Action, or CTA's), which allows you to provide a form to viewers while they are watching or when they complete a video. This allows you to generate leads when they are at peak interest and most likely to convert.

Create a form and embed it in a MAP landing page

To embed a MAP form within a CTA, the form should be embedded on a blank landing page. Once created, the page hosting the form can be loaded into an iframe from within the Vidyard event.

Note: If using a pop-out event, you may need to add a small portion of code to an HTML element on your landing page. The following is provided as an example. You can adjust the height and width to fit your needs.

    #innerWrapDiv { height: 440px; width: 295px !important; overflow: hidden;  }    

Create an Event (CTA)

Once you have a blank landing page with the form embedded, here are the steps to iframe the URL of the landing page into the Event. 

  1. First, create your desired event. You can learn how to create a pop-out, lead capture, or fullscreen event here.
  2. Once your event has been created, scroll to the text editor for your event and click the Source button in the editor options.
    The Event text editor. Source button is in the top left corner.
  3. Copy this code snippet and paste it into the Source area of your text editor:
  4. <div style="max-width:640px; max-height:360px; overflow: hidden; padding-top:10%; padding-left:25%;"><iframe frameborder="0" scrolling="no" width="640" height="360" src="" style="margin-left: -178px; margin-top: -131px;"></iframe></div>
  1. Then replace the src= value (the URL highlighted in red), with your own form or landing page URL. This will embed your landing page in an iframe within the event.
    The iframe embed code has been pasted into the Source area of the Editor. The URL is highlighted to be changed.
  2. Adjust the the padding-left and padding-top values (highlighted in red above) to reflect the positioning of the form on your landing page. 
    Note: You can adjust other values in this code if need be.
  3. Click Save

Data submitted in the Event will now flow directly to your MAP or CRM!  This means you can generate leads in real-time. With pop-out events, you can even have a Sales Rep ready to follow-up with the prospect before they are even done watching the video!

Note: Keep in mind that we don't load external content in the Vidyard app. If you would like to preview your event, take a look at it in your Sharing Page or embed the player on a webpage.

If you'd like a walkthrough, check out the video below!

  • Was this article helpful?