Embed a Siv form

Use the embed code generated by Siv to place a responsive form on your website. The parent-page script keeps the iframe at the correct height, captures advertising attribution, handles configured redirects, and dispatches an event after Siv accepts a submission.

Copy the generated embed code

In Siv's form builder, copy the embed code. Paste it where you want the form to appear. The generated code has the following structure:

Keep the script as a classic script tag. Do not add type="module". The script initializes automatically after the document loads.

If a page contains several Siv forms, add an iframe for each form and load the script once after the iframes.

What the script does

For each iframe[data-siv-form-id], the script:

  1. Adds resizing support so the form grows and shrinks with its content.
  2. Captures supported attribution values from the parent page.
  3. Sends those values only to the http or https origin in the iframe's src.
  4. Listens for trusted redirect and submission messages from the form.

The script does not install an advertising pixel and does not set consent preferences on your behalf.

Initialize a form added later

Most sites need no JavaScript beyond the generated snippet. If your application adds a form iframe after the embed script has already loaded, initialize it after inserting the iframe:

init() discovers all current iframe[data-siv-form-id] elements. Calling it again is safe; an iframe that is already initialized is not wired twice. Each call re-reads the current page address and referrer, so forms on a new route are attributed to that route.

Content security policy

If your website uses a restrictive content security policy (CSP), allow the generated iframe origin in frame-src. Also allow the embed bundle in script-src. Use the exact hosts in the embed code generated for your environment.

Next step

Listen for the siv:form:submitted event when you need to run browser analytics or custom behavior after Siv accepts a form.