Help
Create & Embed Forms
Helper guide to using Spreeflo marketing automation platform.
Learn everything from setup to advanced features.
Overview
Spreeflo Forms let you build beautiful, conversational forms and surveys — then collect responses on a standalone Spreeflo page or embedded anywhere on your own website. You can ask any of a wide range of question types, map answers straight onto contacts in your audience, and show forms inline or as a popup, slider, popover, or side tab.
Forms are part of the free plan and include unlimited responses — there's no cap on how many people can submit. Every submission is saved in the form's Results tab, where you can review responses individually and download them all as a CSV for use in a spreadsheet or another tool. This guide covers the question types you can use, how to map responses to contacts, every way to embed and trigger a form, and the optional add-on to remove Spreeflo branding.
Question types
Add questions to your form from the Add content panel. Questions are grouped into categories so you can quickly find the right field. Most questions support a Required toggle, an optional description and image, and field-level settings (such as choice layout, character limits, or rating icons).
| Category | Question type | What the respondent does |
|---|---|---|
| Contact info | Contact Info | Enters first name, last name, email, phone, and company in one step (each field can be shown, hidden, or required). |
| Enters a single email address. | ||
| Phone | Enters a phone number with a country-code selector. | |
| Address | Enters a full postal address (street, city, state, zip, country). | |
| Company | Enters a company name. | |
| Website | Enters a website URL. | |
| Choice | Multiple Choice | Picks one or several options; supports an "Other" field, randomized order, and a selection limit. |
| Dropdown | Selects one option from a dropdown list. | |
| Picture Choice | Selects one or several image options. | |
| Yes / No | Picks a binary answer with customizable labels. | |
| Legal | Accepts or declines a consent / agreement statement. | |
| Checkbox | Ticks a single checkbox (e.g. opt-in confirmation). | |
| Rating & ranking | Opinion Scale | Rates on a numeric scale with labels for the low, middle, and high ends. |
| Rating | Rates using star, heart, thumb, or smiley icons. | |
| Ranking | Drags options into a preferred order. | |
| Matrix | Answers several rows against shared columns in a grid. | |
| Text, number & date | Short Text | Types a single line of text. |
| Long Text | Types a longer, multi-line response. | |
| Number | Enters a number, with optional min/max limits. | |
| Date | Picks a date in your chosen format. | |
| Other | Video & Audio | Records a video or audio reply. |
| File Upload | Uploads one or more files. | |
| Custom Design | Displays a free-form designed block instead of a question. | |
| Flow & structure | Welcome Screen | Opens the form with an intro splash (one per form). |
| Statement | Shows a text-only screen with no input. | |
| Question Group | Groups related questions under a shared heading. | |
| Multi-Question Page | Shows several questions together on one page. | |
| End Screen | Closes the form with a thank-you screen, optional share buttons, and a button. | |
| Redirect to URL | Sends the respondent to an external URL after submitting. |
Map responses to contacts
A form can do more than collect answers — it can feed straight into your audience. Each form has a Map to contacts toggle. When it's on, every submission creates or updates a contact in your contact list, so responses don't just sit in a results table — they become people you can segment, message, and automate against.
To make sure every submission lands on the right person, add a required Email field. Spreeflo uses the email address to match a submission to an existing contact or create a new one. If a form has no email field, only visitors already identified by the Spreeflo SDK (see Web Tracking & Analytics) are mapped — everyone else is recorded as an anonymous response.
Mapping fields to attributes
Beyond the built-in contact fields (email, name, phone, company, website), you can map almost any question to a contact attribute. Open a question's settings and use Map to attribute to choose which contact field the answer should be written to. For example, a "What's your role?" dropdown can be mapped to a job_title attribute, or a number question to a budget attribute.
Contact options
When Map to contacts is enabled, a few extra options become available:
What this unlocks
Mapping responses to contacts turns a form into a growth tool rather than a one-off survey. Common use cases include:
Tip: Leave Map to contacts off when you only want anonymous feedback (e.g. an NPS survey) and don't need the responses tied to people in your audience.
Embed your form
Every form is reachable at its own Spreeflo-hosted link, so you can share it directly without any setup. To put a form on your own website, you have two options — embed it inline in the page, or show it as a popup. The difference matters because they're installed differently: inline embeds use a small embed.js snippet, while popups require the full Spreeflo SDK.
Embed a form inline
An inline embed renders the form directly inside your page, in the spot where you place the code. There are two inline styles:
| Type | How it appears |
|---|---|
| Standard | The form renders inside your page at a width and height you set (with optional responsive auto-height). |
| Full Page | The form fills the entire browser viewport, like a dedicated landing page. |
From the Embed tab, Spreeflo gives you a small snippet to copy. Paste it into your page wherever you want the form to appear:
<div data-spreeflo-embed="YOUR_EMBED_ID"></div>
<script src="https://spreeflo.com/cdn/sdk/embed.js"></script><div data-spreeflo-embed="…"> marks where the form renders and identifies which form to load.embed.js is Spreeflo's lightweight loader script. It scans the page for your embed placeholder and renders the form. You only need to include it once per page, even if you embed several forms — no SDK or account key required. The Embed tab also includes step-by-step instructions for popular platforms like WordPress, Shopify, and Squarespace, in case you'd rather paste the snippet through their editors.
Show a form as a popup
A popup overlays the form on top of your page and opens based on visitor behavior, rather than sitting inline. Popups come in four styles:
| Type | How it appears |
|---|---|
| Popup | A modal that opens over your page with a dimmed backdrop. |
| Slider | A panel that slides in from the edge of the screen. |
| Popover | A floating chat-style panel attached to a launcher button. |
| Sidetab | A fixed tab pinned to the side of the screen that opens a panel when clicked. |
Popups require the Spreeflo SDK. Unlike inline embeds, popups aren't loaded by theembed.jssnippet — they're delivered through the full Spreeflo SDK installed on your site. When you create a popup, Spreeflo shows you the SDK install steps instead of an embed snippet. See Web Tracking & Analytics for how to install the SDK. Once it's on your site, your popups appear automatically — no per-form code to paste.
Each popup style can be styled in the builder — size, launcher button text and color, launcher position (left or right), border radius, and overlay opacity. Choose a trigger for when it opens:
You can also fine-tune close behavior — keep the form open until it's submitted, auto-close after submission, or prevent it from reopening once a visitor has dismissed it — so popups stay helpful rather than annoying.
Forms and the Spreeflo SDK
To recap the two paths: inline embeds need only the embed.js snippet and nothing else, while popups need the full Spreeflo SDK installed on your site. The SDK is the same one used for web analytics and visitor tracking, so if you already have it installed, popups work right away.
With the SDK in place, forms also integrate more deeply: a submission is tied to the SDK's identified visitor, so even forms without an email field can be mapped to the right contact, form submissions become events you can act on, and Spreeflo can deliver scheduled popup forms as part of your campaigns without you editing the page again. For how to install the SDK, identify visitors, and track events, see Web Tracking & Analytics.
Listen to form events
When a form is embedded on your site, it tells the host page what the visitor is doing — so you can react to it. Use this to redirect after a submission, fire your own analytics or conversion tracking, reveal a thank-you message, or anything else. The same events fire for both inline embeds (embed.js) and popups (the Spreeflo SDK), with the same data, so you write your handler once.
| Event | Fires when |
|---|---|
open | The form becomes visible — an overlay opens, or an inline form mounts on the page. |
submit | The visitor submits the form. Fires exactly once per submission. |
dismiss | The visitor closes the form without submitting — a genuine dismissal. |
close | The form closes for any reason. Check detail.submitted to tell whether a submit came first. |
You can listen in either of two equivalent ways — pick whichever fits your site. The simplest is to assign a callback object to window.SpreefloEmbed; each handler runs when its event fires:
window.SpreefloEmbed = {
onOpen: (detail) => { /* form became visible */ },
onSubmit: (detail) => { /* submitted — detail.embedId, detail.formId */ },
onDismiss: (detail) => { /* closed WITHOUT submitting */ },
onClose: (detail) => { /* closed for any reason — detail.submitted says which */ },
}; Or listen for DOM events named spreeflo:<event>. For inline embeds these are dispatched on the embed's placeholder and bubble up, so a single window listener catches every form on the page:
window.addEventListener('spreeflo:submit', (e) => {
console.log('Form submitted', e.detail.embedId, e.detail.formId);
});
window.addEventListener('spreeflo:dismiss', (e) => {
// visitor closed the form without submitting
}); Every event carries a detail object with the same shape — the type of event, the embedId (the data-spreeflo-embed value, or the popup's embed id), the published formId, and, on close, a submitted boolean. Use embedId or formId to react only to a specific form when you embed more than one.
open and submit — they have no close button, so they never emit dismiss or close. close (with submitted: false), but a close that follows a submit fires only close with submitted: true — never dismiss. dismiss will ever fire for it. Remove Spreeflo branding
By default, forms show a small "Powered by Spreeflo" badge in the footer. To hide it, subscribe to the No Spreeflo Branding add-on for $10 per month. It:
Toggle Spreeflo branding off in your form's settings to start. If you're not subscribed yet, you'll be prompted to add the subscription first.
Pricing & limits
Forms are included on the free plan with unlimited responses — there's no limit on how many submissions you can collect, on any plan. The form builder, question types, embed types, and contact mapping are all available for free. Some contact options, like marking submissions as marketing contacts and double opt-in, are part of paid plans.
For a full breakdown of what each plan includes, see About Spreeflo Pricing Plans.
Need Immediate Help? Contact our support team at support@spreeflo.com or check our other guides for more information.