Forms 2.0 empowers Marketers to create beautiful, stable, and flexible web forms without programming knowledge. Forms can reside on Marketo landing pages and also be embedded on any page of your website. The core functionality of a Marketo web form can be extended using Forms 2.0 JavaScript API.
Getting Started
1. Create a form using Form Editor 2.0 from within Marketo Lead Management form designer. For additional information on Form creation, please see product documentation.
Note: The “Editor:” field in the panel above may not appear in your instance. In this case, the Form Editor 2.0 is automatically used.
2. Approve the form
3. Right click the form in the tree menu and select “Embed Code”
4. You will be given a script block like this one:
1 2 3 4 5 |
<script src="//app-xyz.marketo.com/js/forms2/js/forms2.js"></script> <form id="mktoForm_621"></form> <script> MktoForms2.loadForm("//app-xyz.marketo.com", "718-GIV-198", 621); </script> |
5. We’ll start by editing the loadForm function call and add a callback parameter that allows us to get access to the form object. All further forms examples shown will take place inside of this script block.
1 2 3 4 5 |
<script> MktoForms2.loadForm("//app-xyz.marketo.com", "718-GIV-198", 621, function(form) { // From here we have access to the form object and can call its methods }); </script> |
Using Forms 2.0 from Landing Pages
While all of the forms examples use embedded forms, the same APIs are available on Marketo Landing Pages as well.
Usually, you’ll want to add a script that gets some reference to the form object. To do this, first add your form to the landing page, then add a new HTML block to your landing page. Then you can add a script block to the page:
1 2 3 4 5 |
<script> MktoForms2.whenReady(function (form) { // Put your code that uses the form object here }); </script> |