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).

CategoryQuestion typeWhat the respondent does
Contact infoContact InfoEnters first name, last name, email, phone, and company in one step (each field can be shown, hidden, or required).
EmailEnters a single email address.
PhoneEnters a phone number with a country-code selector.
AddressEnters a full postal address (street, city, state, zip, country).
CompanyEnters a company name.
WebsiteEnters a website URL.
ChoiceMultiple ChoicePicks one or several options; supports an "Other" field, randomized order, and a selection limit.
DropdownSelects one option from a dropdown list.
Picture ChoiceSelects one or several image options.
Yes / NoPicks a binary answer with customizable labels.
LegalAccepts or declines a consent / agreement statement.
CheckboxTicks a single checkbox (e.g. opt-in confirmation).
Rating & rankingOpinion ScaleRates on a numeric scale with labels for the low, middle, and high ends.
RatingRates using star, heart, thumb, or smiley icons.
RankingDrags options into a preferred order.
MatrixAnswers several rows against shared columns in a grid.
Text, number & dateShort TextTypes a single line of text.
Long TextTypes a longer, multi-line response.
NumberEnters a number, with optional min/max limits.
DatePicks a date in your chosen format.
OtherVideo & AudioRecords a video or audio reply.
File UploadUploads one or more files.
Custom DesignDisplays a free-form designed block instead of a question.
Flow & structureWelcome ScreenOpens the form with an intro splash (one per form).
StatementShows a text-only screen with no input.
Question GroupGroups related questions under a shared heading.
Multi-Question PageShows several questions together on one page.
End ScreenCloses the form with a thank-you screen, optional share buttons, and a button.
Redirect to URLSends 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:

  • Save as marketing contact — count mapped contacts as marketing contacts so they can receive campaigns (paid plans).
  • Update existing contacts — let new submissions overwrite attributes on a contact who has submitted before. Note that a contact's email address can't be changed once it's set — later submissions update other attributes but never overwrite the existing email.
  • Double opt-in — require the respondent to confirm by email before they're marked as subscribed (paid plans).
  • What this unlocks

    Mapping responses to contacts turns a form into a growth tool rather than a one-off survey. Common use cases include:

  • Lead capture — a "Contact sales" or "Request a demo" form that drops every lead straight into your audience.
  • Newsletter & waitlist signups — collect emails and instantly add subscribers, ready to receive their first campaign.
  • Enrich contact profiles — ask preferences or qualifying questions and store the answers as attributes for personalization.
  • Segmentation & automation — because answers land on the contact, you can build segments from them and trigger journeys the moment a form is submitted.
  • 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:

    TypeHow it appears
    StandardThe form renders inside your page at a width and height you set (with optional responsive auto-height).
    Full PageThe 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>
  • The <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.

    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:

    TypeHow it appears
    PopupA modal that opens over your page with a dimmed backdrop.
    SliderA panel that slides in from the edge of the screen.
    PopoverA floating chat-style panel attached to a launcher button.
    SidetabA 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 the embed.js snippet — 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:

  • On button click — opens only when the visitor clicks the launcher button (the default).
  • On page load — opens as soon as the page is ready.
  • After a delay — opens after a set number of seconds.
  • On scroll — opens once the visitor scrolls past a percentage of the page.
  • On exit intent — opens when the visitor's mouse moves to leave the page.
  • 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.

    EventFires when
    openThe form becomes visible — an overlay opens, or an inline form mounts on the page.
    submitThe visitor submits the form. Fires exactly once per submission.
    dismissThe visitor closes the form without submitting — a genuine dismissal.
    closeThe 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.

  • Inline forms only fire open and submit — they have no close button, so they never emit dismiss or close.
  • Every dismissal is also a close (with submitted: false), but a close that follows a submit fires only close with submitted: true — never dismiss.
  • If a popup is set so visitors can't close it until they submit, no 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:

  • Removes the "Powered by Spreeflo" badge from every form.
  • Applies across your entire account, not just one form.
  • Can be cancelled anytime.
  • 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.