Add the Attry Code to Your Website

You’ll need to place the following code inside the <head> section of your site or landing page where the form is embedded.

This ensures the attribution script loads before the form and can prefill the hidden fields correctly.

Make sure the hidden fields in your form provider (e.g., Jotform, Typeform, Fillout) use the exact names listed (channel, channeldrilldown1, etc.). This way Attry knows how to match and prefill the data.

Important

The Attry code shown below is an example only. Your unique snippet must be copied from your Attry Dashboard and added to your site. Do not use the example script verbatim.

Go to Dashboard – Get Started

<head>
  <!-- Attry Main Script -->
  <script src="https://cdn.attry.app/cdn/snippet/v1.js"></script>

  <!-- Attry iFrame Adapter (for Jotform, Typeform, Fillout, etc.) -->
  <script src="https://cdn.attry.app/cdn/adapters/iframe-prefill/v1.js"></script>

  <!-- Configure Attry -->
  <script>
    window.Attry.setConfig({
      debug: true, // Set to false in production
      iframeTagging: {
        enabled: true,
        paramMap: {
          channel: "channel",
          channeldrilldown1: "channeldrilldown1",
          channeldrilldown2: "channeldrilldown2",
          channeldrilldown3: "channeldrilldown3",
          channeldrilldown4: "channeldrilldown4",
          landing_page: "landing_page",
          landing_page_group: "landing_page_group"
        },
        preserveExisting: false
      }
    });
  </script>
</head>

1. Main Attry Script

<script src="https://cdn.attry.app/cdn/snippet/v1.js"></script>

2. iFrame Adapter Script

<script src="https://cdn.attry.app/cdn/adapters/iframe-prefill/v1.js"></script>

3. Configure the Script

<script>
// Set up Attry configuration
window.Attry.setConfig({
  debug: true,
  iframeTagging: {
    enabled: true,
    paramMap: {
      channel: "channel",
      channeldrilldown1: "channeldrilldown1",
      channeldrilldown2: "channeldrilldown2",
      channeldrilldown3: "channeldrilldown3",
      channeldrilldown4: "channeldrilldown4",
      landing_page: "landing_page",
      landing_page_group: "landing_page_group"
    },
    preserveExisting: false
  }
});
</script>

4. How It Works

The script finds iframes with data-attry-iframe
It reads UTM parameters from the URL
It adds these parameters to the iframe URL
The iframe form gets the attribution data

Complete Example

<!DOCTYPE html>
<html>

<head>
  <!-- Attry Main Script -->
  <script src="https://cdn.attry.app/cdn/snippet/v1.js"></script>

  <!-- Attry iFrame Adapter (for Jotform, Typeform, Fillout, etc.) -->
  <script src="https://cdn.attry.app/cdn/adapters/iframe-prefill/v1.js"></script>

  <!-- Configure Attry -->
  <script>
    window.Attry.setConfig({
      debug: true, // Set to false in production
      iframeTagging: {
        enabled: true,
        paramMap: {
          channel: "channel",
          channeldrilldown1: "channeldrilldown1",
          channeldrilldown2: "channeldrilldown2",
          channeldrilldown3: "channeldrilldown3",
          channeldrilldown4: "channeldrilldown4",
          landing_page: "landing_page",
          landing_page_group: "landing_page_group"
        },
        preserveExisting: false
      }
    });
  </script>
</head>

<body>
  <iframe 
    src="https://form.jotform.com/123456789"
    data-attry-iframe
    width="100%" 
    height="400"
    frameborder="0">
  </iframe>

  <script>
    window.Attry.setConfig({
      debug: true,
      iframeTagging: {
        enabled: true,
        paramMap: {
          channel: "channel",
          channeldrilldown1: "channeldrilldown1",
          channeldrilldown2: "channeldrilldown2",
          channeldrilldown3: "channeldrilldown3",
          channeldrilldown4: "channeldrilldown4",
          landing_page: "landing_page",
          landing_page_group: "landing_page_group"
        }
      }
    });
  </script>
</body>
</html>