> For the complete documentation index, see [llms.txt](https://docs.satisfilabs.com/resource-center/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.satisfilabs.com/resource-center/marketing-engine/templates-and-landing-pages/landing-page-template-with-a-form/embedding-customizable-form-tracking-script-in-marketing-engine-landing-page.md).

# Embedding Customizable Form Tracking Script in Marketing Engine Landing Page

## Overview:

This article shows how to embed a JavaScript snippet in a **Marketing Engine landing page** to send form submissions to a dynamic webhook URL.

#### Use Case <a href="#use-case" id="use-case"></a>

You want to track submissions of different forms across various landing pages, sending the collected data to different webhook endpoints. This script is **configurable for each page** by simply changing two variables.

#### Customizable Script <a href="#customizable-script" id="customizable-script"></a>

Paste the following code into an **HTML block** on your landing page:

<figure><img src="/files/IPSap5HvX6vncdlIcTKu" alt=""><figcaption></figcaption></figure>

```
<script>
  document.addEventListener("DOMContentLoaded", function () {
    const form = document.getElementById("landingpage_form_{landing_form_id}");
    const webhookURL = "{webhookURL}";

    // List of fields to exclude from webhook
    const excludeFields = [
      "Landing Page Token"
    ];

    if (form) {
      form.addEventListener("submit", function () {
        const formData = new FormData(form);
        const payload = {};

        for (const [key, value] of formData.entries()) {
          if (!excludeFields.includes(key)) {
            if (payload[key]) {
              payload[key] = Array.isArray(payload[key])
                ? [...payload[key], value]
                : [payload[key], value];
            } else {
              payload[key] = value;
            }
          }
        }

        const json = JSON.stringify(payload);
        console.log("Filtered Payload:", json);

        try {
          const blob = new Blob([json], { type: "text/plain" });
          navigator.sendBeacon(webhookURL, blob);
        } catch (err) {
          console.error("Beacon send error:", err);
        }
      });
    }
  });
</script>
```

#### How to Use It <a href="#how-to-use" id="how-to-use"></a>

1. **Set** `landing_form_id`**:**\
   Replace the value of `landing_form_id` with the **actual form ID** for the landing page you're working on.
2. **Set** `webhookURL`**:**\
   Replace the placeholder webhook URL with your **actual endpoint** (e.g., Zapier, webhook.site, internal server).
3. **Paste the Script:**\
   Add the complete `<script>` block into an HTML section of the landing page using the **editor’s embed block**.