Embed a form on your website
Summary
Section titled “Summary”You get the embed code in the form editor in the KonversAI console. Select Forms in the left sidebar, select All forms, then open a published form. The Share & embed section holds two things: a Public link to the form, and an Embed code snippet you paste into the HTML of your own website. The snippet puts the form inside your page. You need somebody who can edit your website HTML, because KonversAI cannot install the form for you.
Who can do this
Section titled “Who can do this”A team member whose role includes tenant settings access in the KonversAI console. A Tenant Admin always has this access. A Tenant Operator does not have it by default, so a Tenant Operator does not see Forms in the left sidebar at all. Ask an administrator to change your role.
On your website, you also need a person who can edit the HTML, or who can paste a snippet into your content management system. The two jobs can be two different people.
Before you start
Section titled “Before you start”Make sure your tenant has the forms feature. Forms is a per-tenant feature flag. When the feature is off, the whole Forms item is missing from the left sidebar of the KonversAI console. Contact KonversAI support to switch the feature on.
Publish the form first. Only a published form has a public page, so Share & embed appears only on a published form. Open the form, set Status to Published in Basics, then select Save form. A form in Draft or Archived shows no Share & embed section and no Public link. See Build a form.
Decide where on your page the form belongs. The form renders in place, exactly where you paste the snippet, so the position in your HTML is the position on the page.
- Select Forms in the left sidebar of the KonversAI console, then select All forms. The screen opens with the heading All forms.
- Select the form’s name in the Name column, or select Edit on its row. The editor opens with the heading Edit form.
- Select Share & embed under On this page at the left of the editor. The section carries the heading Share & embed and the line Put this form on your own website, or share the link.
- Copy the snippet. Select Copy code under the Embed code box. The help text above the box says: Copy this snippet and paste it into the HTML of your own website. You can also select the snippet in the box; one select highlights the whole snippet.
- Paste the snippet into the HTML of your page, at the point where the form
should appear. Paste the whole snippet, both the
<iframe>and the<script>that follows it. - Publish your website, then open the page in a browser. The form appears inside your page, and it grows taller as a visitor moves through the steps.
- Test the form by filling it in yourself. Then select Conversations in the left sidebar of the console, select Form submissions, and check that your test submission is there.
To share the form as a link instead of embedding it, copy the address next to Public link in the same Share & embed section. Select Copy link. Put that address behind a button, in an email, or in a QR code. The link opens the form as a page of its own.
The snippet has this shape. The console fills in your real address and the real reference for your form, so always copy the snippet from Embed code instead of typing the snippet by hand.
<iframe id="konversai-form-YOUR_FORM_REFERENCE" src="https://your-chat-service.example.com/form/YOUR_FORM_REFERENCE/" title="Contact us" style="width:100%;height:800px;border:0" loading="lazy"></iframe><script> /* resizes the form to fit its content */</script>The <iframe> shows the form. The <script> after it listens for the height the
form reports, and resizes the frame to match, so your visitor never gets a
scrollbar inside the form. The height:800px in the <iframe> is the height the
form uses before the script resizes the frame.
Why is there no Share & embed section on my form?
Section titled “Why is there no Share & embed section on my form?”The form is not published. Share & embed appears in the form editor in the KonversAI console only on a published form, because only a published form has a public page. Open the form under Forms > All forms, set Status to Published in Basics, then select Save form. Reopen the form, and Share & embed is there, in the editor and in the On this page list at the left. A second cause is the forms feature itself: when your tenant does not have it, the whole Forms item is missing from the left sidebar. Contact KonversAI support to switch the feature on.
Where in my HTML does the snippet go?
Section titled “Where in my HTML does the snippet go?”Paste the snippet at the exact point in your page HTML where the form should
appear. The form renders in place, so the position in your HTML is the position
on the page. This is different from the KonversAI chat widget, whose snippet goes
just before the closing </body> tag because the chat draws a floating button.
Paste the whole snippet you copied from Share & embed, both the <iframe>
and the <script> that follows it, once per page.
My website builder removed part of the code, and the form has its own scrollbar
Section titled “My website builder removed part of the code, and the form has its own scrollbar”Your website builder stripped the <script> from the snippet. Many builders
remove script tags from a content block. The <iframe> still works, so the form
still loads and still collects answers, but nothing resizes the frame, so a long
form gets a scrollbar inside it. Two fixes. Paste the snippet into a field meant
for custom HTML or embed code, which most builders have, rather than a normal
text block. Or keep the <iframe> alone and raise the height value in it, for
example from height:800px to height:1400px, until the whole form fits.
A visitor who comes back has to start the form again. Why?
Section titled “A visitor who comes back has to start the form again. Why?”The form remembers an unfinished submission in the visitor’s browser. When the form runs inside your page, many browsers keep that memory separate per website, and some clear it, so a returning visitor often gets a fresh form instead of the answers they left. Nothing is lost on the KonversAI side: the part they did finish is already on the Form submissions screen, under Conversations in the left sidebar of the console. When it matters that a visitor can pick a long form back up, send them to the Public link from Share & embed instead of embedding the form.
Does the form load anything from outside my site?
Section titled “Does the form load anything from outside my site?”Yes, two things. The form loads from your KonversAI address, the one in the
src of the <iframe> in the snippet. The form also loads a small
text-formatting library from cdn.jsdelivr.net. If your website has a strict
Content Security Policy, allow your KonversAI address in frame-src, or the
browser blocks the whole form. Your policy does not govern what the form itself
loads, so cdn.jsdelivr.net only matters on a network that blocks outside
addresses; there, an AI answer inside the form shows as plain text instead of
formatted text.
Can I put the same form on more than one page or more than one site?
Section titled “Can I put the same form on more than one page or more than one site?”Yes. Paste the same snippet on as many pages as you want, and on as many sites as you want. Every submission arrives on the same Form submissions screen, under Conversations in the left sidebar of the KonversAI console. To tell the sources apart, build a second form under Forms > All forms and give each site its own form; each form has its own Embed code in its own Share & embed section. You can also put two different forms on one page.
Do I need to change the snippet after I edit the form?
Section titled “Do I need to change the snippet after I edit the form?”No. Add a step, rename a field or change a completion action in the form editor, select Save form, and your website shows the new version the next time a visitor loads the page. Leave the snippet on your website exactly as you pasted it. One change does matter: setting Status back to Draft or Archived takes the public page down, and the embedded form stops loading on your site.
Where do the answers go?
Section titled “Where do the answers go?”Select Conversations in the left sidebar of the KonversAI console, then select Form submissions. Every submission from your embedded form lands there, with each answer in order and the result of each completion action. It makes no difference whether the visitor used the embedded form or the Public link. See Read form submissions.
Last reviewed . Tell us when a step no longer matches the product.