Embed your form

Publish a form anywhere by pasting an embed snippet into your site, or by sharing its hosted link. Submissions flow straight into Customers and any connected automations.

Before you begin

• Create and publish a form. See Create a form.
• To use the snippet embed: have edit access to your website’s HTML, or a page builder that supports custom code blocks.

Hosted link

Every published form has a hosted link at https://app.caramelme.com/f/{slug}. Share it in an email, bio link, QR code, or anywhere you can paste a URL — no code needed.

To find your form’s link:

1. Go to /business/:id/forms and open your form.
2. Select the Embed tab.
3. Click Preview to open the hosted link in a new window, or copy the URL directly from your browser’s address bar.

Embed snippet

For a form embedded directly in a web page, use the embed snippet. The Embed tab generates the correct code based on the embed type you choose.

Choose an embed type

Type	Behavior
Inline	The form appears in place, inside your page content
Popup	A modal overlay that appears based on a trigger
Slide-in	A corner widget that slides in based on a trigger
Iframe	A plain iframe — no triggers, works in any environment

Configure trigger settings (Popup and Slide-in only)

For Popup and Slide-in, choose when the form appears:

Trigger	When it fires
Delay	After a set number of seconds (0–300)
Scroll	When the visitor scrolls past a percentage of the page (0–100%)
Exit intent	When the visitor moves to leave the page
Click	When the visitor clicks a specific element on your page

Additional options for Popup:

• Show once per session — prevents the popup from appearing again during the same browser session (default: on).
• Dismiss duration — hours before the popup re-shows after being dismissed (default: 24).

Set a default language

Choose the language for UI strings (button labels, error messages) from the Default language dropdown. Options: Auto-detect (uses the visitor’s browser language), English, Español, Français, Deutsch, Italiano.

Get the snippet

1. Open your form and select the Embed tab.
2. Choose an embed type.
3. Configure any trigger or language settings.
4. Click Copy to copy the generated snippet.

Add the snippet to your site

Paste the snippet into your site’s HTML at the location where you want the form to appear. For a page builder, use a custom HTML or code block.

Inline example snippet:

<div data-caramel-form="your-form-slug"></div>
<script src="https://app.caramelme.com/widget/caramel-forms.js"
  data-form-id="your-form-slug"
  data-type="inline">
</script>

Popup example snippet:

<script src="https://app.caramelme.com/widget/caramel-forms.js"
  data-form-id="your-form-slug"
  data-type="popup"
  data-trigger="delay"
  data-delay="30"
  data-show-once="true"
  data-dismiss-hours="24">
</script>

Note For a click-triggered popup, the snippet includes a sample <button> element. Replace it with any element on your page and update the data-trigger-selector attribute to match your element’s CSS selector.

Restrict which domains can embed your form

By default, your form can be embedded on any domain. To limit it:

1. In the Embed tab, find the Domain Allowlist card.
2. Add each domain that’s allowed to embed the form (for example, yourdomain.com).
3. Click Save Changes.

Requests from unlisted domains are blocked.

Test a submission

1. Visit the hosted link or open a page where you embedded the form.
2. Fill in the form and submit it.
3. Go to /business/:id/forms, select your form, and open the Submissions tab to confirm the test submission appeared.

Tip URL query parameters matching field IDs pre-fill those fields automatically. For example, ?email=hello@example.com pre-fills an email field with the id email. Useful for passing known data from your site into the form.

Next steps

• Where submissions go — See how submissions route to Customers and automations.
• Spam protection — Enable spam protection to block bot submissions.
• Form analytics — Track views and conversion after going live.