Marketo Forms - Redirect and Lead Passthrough

How to use your own Marketo form for lead collection, and then redirect viewers to a Consensus Demo.

How to setup Marketo Lead Passthrough 

If you are setting up the Marketo integration for the first time, you have an option to select a workflow URL for "Redirect Marketo Form Leads" as shown below.  
Copy it and save it temporarily somewhere (it will be used later during Marketo Form setup).

If you've already connected to Marketo, before we added the form lead redirect feature, then please contact your CSM and they can have the Consensus product team re-send the connection link. When you open the link, you can skip all first pages of the config wizard. On the last page you will receive your Consensus Redirect URL for the Marketo Form.

Copy it and save it temporary somewhere (it will be used later during Marketo Form setup).


 


 

Setting up the Marketo form and custom fields

1. In Marketo UI navigate to AdminField Management

Check if you have already Consensus Redirect Url and Consensus Demo Uuid custom form fields. I

If one of both of them are missing,  then click New Custom Field.

2. Create consensusRedirectUrl as shown below and click Create.
NOTE: Its allowed to set API name as consensusRedirectUrl or consensus_redirect_url. Both ways are supported.


3. Create consensusDemoUuid as shown below and click Create.
NOTE: Its allowed to set API name as consensusDemoUuid or consensus_demo_uuid. Both ways are supported.


4. Navigate to Design Studio-> FormsGlobal Forms.
Create new form (right click on Global Forms folder -> New form) or use existing one (on the screen below MN-GoConsensus-TestForm).


5. In order to edit/set form click Create draft.


6. Create form with a following recommended fields.
!!!NOTE: Only Email Address field is required in this form (should be marked as required in form.
!!!NOTE: Other fields are optional and any additional fields are also optionally can be added.


7. Add additional Consensus Redirect Field.


8. Change field type to Hidden and click edit Autofill.


 

9. In Default value insert Consensus Redirect URL (from the step 3 above) and click Save.


10. Similarly add additional Consensus Demo UUID field and set default value as any Demo UUID that you need to use. Click Save.


11. Click FinishApprove And Close.


12. Click Embed code.


13. Copy formKey and formId as shown on the screen below.


14. Here is prepared JS Marketo Form snippet that is adapted/modified to be ready to handle redirection form successfully submitted Marketo form.


Before you copy this snippet, on line 3 and 4 update the formKey and formId with values that you saved from the previous step.

 
 <form id="mktoForm"></form>
<script>
    const formKey = '<<FORM_KEY>>'; // Example: '029-GWM-072'
    const formId = <<FORM_ID>>; // Example: 1003

    let mktoForm = document.getElementById("mktoForm");
    mktoForm.id = 'mktoForm_' + formId;
    let marketoScript = document.createElement('script');
    marketoScript.src = '//' + formKey + '.mktoweb.com/js/forms2/js/forms2.min.js';
    document.head.appendChild(marketoScript);
    marketoScript.addEventListener('load', () => {
        function openPostPage(data) {
            let form = document.createElement('form');
            document.body.appendChild(form);
            //form.target= '_blank';
            form.method = 'post';
            const actionUrl = ('consensusRedirectUrl' in data) ? data.consensusRedirectUrl :
                (('consensus_redirect_url' in data) ? data.consensus_redirect_url : null);

            if (actionUrl === null) {
                console.error('Redirect url is missing.');
                return;
            }

            form.action = actionUrl;
            for (let name in data) {
                let input = document.createElement('input');
                input.type = 'hidden';
                input.name = name;
                input.value = data[name];
                form.appendChild(input);
            }
            form.submit();
            document.body.removeChild(form);
        }

        MktoForms2.loadForm("//" + formKey + ".mktoweb.com", formKey, formId, function (form) {
            form.onSuccess(function (values) {
                openPostPage(values)
                return false;
            });
        });
    });
    marketoScript.addEventListener('error', (ev) => {
        console.log('Error on loading Marketo form file', ev);
    });
</script>

 

Testing the Form Redirect (before using on your website)

1. Now this JS snippet can be used/inserted in any html page.
For the testing purposes and avoiding CORS issue on localhost it would be easier to test this snippet via an available JS playground (For example: JSFiddle - Code Playground ).
Navigate to JSFiddle - Code Playground → Insert your JS form code snippet → click Run.


2. After it you will see a Marketo Form. Fill in form data and click Submit.


 

3. After successful submission form will be redirected to an appropriate demo player link with the newly created lead uuid to allow for demolytics 


 

Summary of Lead Creation and Redirect Workflow

After Submit button is clicked on the form, [FORM REDIRECT] Redirect Marketo form leads workflow workflow is triggered.


This workflow will:

  • validate incoming data (check if email is not empty)

  • create new marketing public link in Consensus with the provided Demo UUID by making request to POST api/integr/v1.0/marketing/createlink

  • create new lead  in Consensus by making request to POST api/integr/v1.0/marketing/createlead

  • and after it will redirect the viewer tohttps://<<DEMO_PLAYER_URL>>.goconsensus.com/<<LINK_HASH>> ?p1=<<LEAD_UUID>>

 

Finally, in Marketo UI it’s possible to verify that new Lead was also created after successful form submission.