Content:

• Overview and Key Notes
• Configure Your Marketo Form
  • • Add a Hidden Field to Capture the Log ID
• Add the BookIt Script to Your Form Page
  • • Default Marketo Form Submission Snippet
    • Custom Form Submission Snippet
• Configure Your Trigger Node
  • • Set Your Trigger Node Name
    • Add Your Field Mappings
    • Configure the Rest of Your Router Graph

 

Overview and Key Notes 

This guide walks through how to configure BookIt to display a calendar as a modal on the same page as your Marketo form.

There are two possible submission behaviors for Marketo forms:

• Default Behavior: The form refreshes the page and appends an aliId query parameter to the URL.
• Custom Behavior: The form does not refresh the page (i.e., your team opted out of Marketo's default submission behavior).

This guide supports both cases. We’ll walk you through identifying your setup and applying the right configuration.

Configure Your Marketo Form 

Add a Hidden Field to Capture the Log ID 

First, make sure your Marketo form includes a hidden field to store the BookIt Log ID. If you haven't already done this, follow our guide on Adding a Hidden Field in Marketo. This value will later be used to update the associated Lead or Contact in Salesforce.

Add the BookIt Script to Your Form Page 

You’ll need to add the BookIt script to the footer or end of the

of your form page. There are two versions of the script, depending on how your Marketo form submits:

• Use the Default Submission snippet if your form refreshes the page and appends an aliId to the URL on submit.

• Use the Custom Submission snippet if your form does not refresh the page or add aliId—in other words, your team opted out of Marketo's default form behavior.

Within the snippet, you will need to update the placeholder values (highlighted in yellow) in the LDBookItV2.initialize() function. 

Replace the placeholders with your values:

• <Org ID> — Your 18-digit Salesforce Org ID. This should match the org where your live BookIt router graph resides (or the sandbox you’re testing in).

• <Trigger Node Name> — The name of the trigger node in your BookIt router graph. Use something descriptive like "Demo Request". You’ll configure this in a later step.

• <Hidden Field Name> — The Field name of the hidden field you created earlier to store the BookIt log ID.

Default Marketo Form Submission Snippet (page refresh) 

Use this snippet if your form uses Marketo’s default behavior.

<script>
  var _ld_scriptEl = document.createElement('script');
  _ld_scriptEl.src = 'https://cdn.leandata.com/js-snippet/ld-book-v2.js';;
  _ld_scriptEl.addEventListener('load', function () {
    const urlParams = new URLSearchParams(window.location.search);
    if (urlParams.has("aliId")) {
      LDBookItV2.initialize('<Org ID>', '<Trigger Node>', true);
      LDBookItV2.submit();
    }
    else {
      LDBookItV2.initialize('<Org ID>', '<Trigger Node>', '<Hidden Field>');
      LDBookItV2.setFormProvider('marketo');
    }
  });
  
document.body.appendChild(_ld_scriptEl);
</script>

Custom Form Submission Snippet (no page refresh) 

Use this snippet if you've opted out of Marketo's refresh upon form submission.

<script>
  var _ld_scriptEl = document.createElement('script');
  _ld_scriptEl.src = 'https://cdn.leandata.com/js-snippet/ld-book-v2.js';;
  _ld_scriptEl.addEventListener('load', function () {
    LDBookItV2.initialize('<Org Id>', '<Trigger Node Name>', '<Hidden Field Name>', { autoSubmit: true });
    LDBookItV2.setFormProvider('marketo');
  });

  document.body.appendChild(_ld_scriptEl);
</script>

Configure Your Trigger Node 

Set Your Trigger Node Name 

In your LeanData BookIt for Forms routing graph:

• Double-click on the Trigger Node to open the editor

• Update the Node Name to match the <Trigger Node Name> you defined earlier in your embed script.

 

Add Your Field Mappings 

To map values from your form into variables used in the routing logic, follow the steps in Setting Up Form Field Mappings in Marketo. This will ensure that data entered into the form can be referenced and routed appropriately in your graph.

Configure the Rest of Your Routing Graph 

Now that your trigger node and form field mappings are in place, you can continue building and customizing your routing logic.

Need help? Our LeanData Professional Services team is happy to assist with advanced configuration, best practices, or validation of your setup.