<aside> 💡 About the following steps: This tutorial explains how to save the registrant’s session ID on Livestorm as a custom field and then to store this session ID from Livestorm to Marketo in the program member.



If you're using Marketo as your Marketing Automation Tool, it is possible for you to connect it to Livestorm. You can send data from Livestorm to Marketo using our native integration. But if you have an event with several sessions, you may also want to store the registrant’s session ID from Livestorm to Marketo in the Program Member.

In this article, we'll show you how to store the session ID on Livestorm as a custom people attribute. Then we’ll show you how to store this session ID from Livestorm to Marketo in the program member.

How to:

💭 Step 1 : Save the Session ID as a custom field on Livestorm when someone registers to an Event on Livestorm.

⚠️ NB: This code works for the detailed registration page. The custom field won’t be visible to the registrant on the registration form.

  1. On your workspace, create a new people attribute in order to save the session ID.

For this, go to your workspace > Account Settings > People Attributes

Screenshot 2022-12-06 at 11.01.07.png

Name your custom attribute (Session ID in the example below)

Screenshot 2022-12-06 at 12.00.35.png

  1. Once this is done, we are going to add some custom code to the registration pages.

Copy the script below and replace the value of sessionIdSlugName by the slug of your custom attribute. 👇


const sessionIdSlugName = "ADD SLUG HERE";


const sessionIdSlugName = "**session_id**"; (or by whatever your slug is)


window.addEventListener("load", function () {
  // Declaring variables
  const sessionIdSlugName = "ADD SLUG HERE"; // Update by the slug of the custom session ID field
  let urlSessionVal = "";

  //Function to wait for the session ID Block to appear/exist in the DOM
  function waitForSessionBlock(selector) {
    return new Promise((resolve) => {
      if (document.querySelector(selector)) {
        return resolve(document.querySelector(selector));

      const sessionBlockObserver = new MutationObserver((mutations) => {
        if (document.querySelector(selector)) {

      sessionBlockObserver.observe(document.body, {
        childList: true,
        subtree: true,

  // Function to update the value of Session ID Input
  const changeSessionIdValue = (input, value) => {
    var nativeInputValueSetter = Object.getOwnPropertyDescriptor(
    nativeInputValueSetter.call(input, value);

    var inputEvent = new Event("input", { bubbles: true });

  // Function to observe Modal mutation and set value to the Session ID input field

  async function modalMutationObserved(mutationList, observer) {
    for (const mutation of mutationList) {
      if (mutation.type === "childList") {
        const sessionBlock = await waitForSessionBlock(

        if (sessionBlock) {
          sessionBlock.style.display = "none";
          let queryString = window.location.search;
          let urlParams = new URLSearchParams(queryString);
          urlSessionVal = urlParams.get("s");
          const sessions = window.event_type.sessions;

          //declaring the session ID input
          const sessionIdInput = document.querySelector(

          if (urlSessionVal === null) {
            changeSessionIdValue(sessionIdInput, sessions[0].id);
          } else {
            changeSessionIdValue(sessionIdInput, urlSessionVal);

          //Declaring the session Date field to observe changes (new session selected)
          const sessionDate = document.querySelector(
            "div[data-testid='form-input-sessions'] span.content.truncate"

          // Listening for changes on the session Date
          sessionDate.addEventListener("DOMSubtreeModified", function () {
            queryString = window.location.search;
            urlParams = new URLSearchParams(queryString);
            urlSessionVal = urlParams.get("s");

            changeSessionIdValue(sessionIdInput, urlSessionVal);

  const config = { childList: true, subtree: true };
  const modalNode = document.querySelector("#teleport-end");
  const modalObserver = new MutationObserver(modalMutationObserved);

  modalObserver.observe(modalNode, config);

  1. Enable this custom code on the registration pages.

  2. In your event > Registration settings, add the previously created custom attribute as a registration field.

Screenshot 2022-12-06 at 12.13.33.png

Now, when a participant registers to your event, the session ID should be saved as a custom registration field.

💭 Step 2 : Configure Marketo to store the Session ID in the program member.

⚠️ NB: For the next steps - Marketo and Livestorm should already be configured in order to send Data from Livestorm to Marketo. See related documentation: https://support.livestorm.co/article/231-connect-marketo-livestorm

Create a custom field Livestorm_eventid for your leads

On Marketo:

  1. In Admin > Data Management > Field Management, click on New Custom Field.
  2. Fil in the form with the following information and click on Create:

Screenshot 2022-12-08 at 17.45.10.png

  1. If you haven’t already, please also create custom fields to store the session ID for your leads, one as a Person and one as a Program Member:

For example :

Object ⇒ Person

Object ⇒ Program Member

On Marketo, create a Livestorm Webhook:

On Marketo:

  1. In Admin > Integration > Webhooks, click on New Webhook.
  2. Fill in the form with the following information and click on Save.

Screenshot 2022-12-08 at 18.16.53.png

  1. Click on Webhook actions > Set Customer Header and add the following properties to your header

Screenshot 2022-12-06 at 15.33.40.png

  1. Edit Response Mapping and add the following properties:

⚠️ [n] needs to be replaced by the index where the value of the session ID is found on the “fields” array, in the response of the API call.

Screenshot 2022-12-08 at 17.36.11.png

As an example, in the following response, the value of the session ID is found at Index 3 so [n] should be replaced by [3] in the webhook.

  "data": [
      "id": "9d16b12f-44de-4af5-b6b3-aca94765baza",
      "type": "people",
      "attributes": {
        "role": "participant",
        "created_at": 1670342127,
        "updated_at": 1670342188,
        "timezone": "Europe/Paris",
        "first_name": "Hello",
        "last_name": "Marketo",
        "email": "[email protected]",
        "avatar_link": null,
        "registrant_detail": {
          "event_id": "d6a8f5f5-63da-4841-b314-7032fb7d1f98",
          "created_at": 1670342127,
          "updated_at": 1670342188,
          "fields": [
            { // INDEX 0
              "id": "email",
              "type": "text",
              "value": "[email protected]",
              "required": true
            { // INDEX 1
              "id": "first_name",
              "type": "text",
              "value": "Hello",
              "required": true
            { // // INDEX 2
              "id": "last_name",
              "type": "text",
              "value": "Marketo",
              "required": true
            { // INDEX 3 ==> SESSION ID. That's the index we're looking for
              "id": "session_id",
              "type": "text",
              "value": "8227eabf-4762-4aa5-83b9-f65109d2d01d",
              "required": false,
              "custom": true

Create a Smart Campaign Triggered by “Program Status is changed”

  1. In Marketing Activities, select your program and click on New > New Smart Campaign

  2. In your new Smart Campaign, under Smart List, select the trigger “Program Status is Changed” and select your program.

Screenshot 2022-12-06 at 16.06.06.png

Update the Flow in your Smart Campaign

1️⃣ Change the Data Value

  1. In your smart campaign, in Flow, add an action Change Data Value with the following information:

Screenshot 2022-12-06 at 16.19.44.png

2️⃣ Call the Webhook previously created

In your flow, add the action Call Webhook

Screenshot 2022-12-08 at 18.24.28.png

3️⃣ Change Program Member Data

The last step consists in changing the Program Member Data in order to store the session ID at the program member level.

In your flow, select the action Change Program Member Data and add the following information:

Screenshot 2022-12-06 at 16.38.00.png

<aside> 🎉 Et voilà. If you connect your Livestorm event to your Marketo program, the session ID should now be stored on Marketo at the program member level. (Don’t forget to enable the custom code on Livestorm and to add the Session ID as a registration field, as explained on Step 1).


Screenshot 2022-12-08 at 17.48.42.png


Screenshot 2022-12-06 at 16.59.47.png

For future events…

In your new program, just clone the same settings as your smart campaign.

In Flow > Change Data Value, you will need update the new value for the “Livestorm_eventid” attribute by the new Livestorm event ID.