Flowstar Spin Wheel & Gamification
Add Flowstar Spin Wheel & Gamification to Webflow with embed code and run spin-to-win campaigns that turn visitors into subscribers.
Webflow handles pages and native forms on hosted sites, but it has no native gamification mechanics. A spin-to-win wheel or an exit-intent discount popup has to be built by hand, and the same goes for reward-based signup incentives.
Flowstar Spin Wheel & Gamification fills that gap with prize wheels and popup campaigns made for Webflow sites. You configure the wheel and its rewards in Flowstar's dashboard, set the triggers there, then place the widget's embed code on your Webflow pages.
This integration suits e-commerce store owners trying to hold onto visitors who are about to leave, and marketers building email and phone lists. Designers building client sites in Webflow use it to add engagement mechanics without writing popup logic themselves. Campaigns around product launches and newsletter growth are where it earns its keep.
How to integrate Flowstar Spin Wheel & Gamification with Webflow
What is Flowstar Spin Wheel & Gamification? Flowstar Spin Wheel & Gamification is a gamification widget for Webflow sites that turns a plain popup into a reward-based interaction, where a visitor spins a wheel for a discount or an offer in exchange for an email address. Flowstar sells it as a standalone monthly subscription alongside its other Webflow widgets, with current rates on Flowstar's pricing page.
Teams pair Flowstar with Webflow to run exit-intent discount popups and timed engagement triggers on live pages, and to reward finished forms. E-commerce stores use the combination for cart recovery and list building. The wheel handles the incentive, and Webflow handles the pages and the form data underneath it.
One thing to settle before you plan the build: this app has no live listing on the Webflow Marketplace, so there is no one-click OAuth install for it. Flowstar's own site still links to a Marketplace URL for the Spin Wheel, but that URL does not resolve to a listing, and a sibling Flowstar product has gone the same way. Setup runs on embed code you get from Flowstar, which changes the install order without changing what the widget does on the page.
Two paths cover nearly every setup. Custom code embeds put the widget on the page at whatever scope you need, and the Webflow Data API takes over once a visitor has handed over an email address. Most builds start with the embed and reach for the API only when leads have to land somewhere specific.
Add the spin wheel with custom code
You place the widget by pasting Flowstar's embed code into Webflow. Request a site-specific snippet through Flowstar's contact page, since the code is tied to your campaign configuration. Custom code fields accept HTML, CSS inside <style> tags, and JavaScript inside <script> tags, and server-side languages do not run. Publishing custom code needs a paid Site plan, Basic or higher, or a paid Workspace plan. The three placement scopes below differ only in how much of the site loads the script.
Place the widget with a Code Embed element
A Code Embed element renders the widget at an exact spot on the canvas, such as inside a hero section or above a product grid.
To add the embed:
- Copy the Flowstar embed code to your clipboard.
- Open the Add panel and add a Code Embed element where the wheel should appear.
- Paste the code into the modal and click Save & Close.
Code Embed elements cannot contain <html>, <body>, or <head> tags. If Flowstar's snippet sets no dimensions of its own, add height="100%" width="100%" to it so you can size the widget from the Style panel.
Add the widget to a single page
Page-level custom code in head and body tags loads the widget on one page only, which keeps the script off pages that have nothing to do with the campaign.
To add page-level code:
- Open Page settings for the target page and go to Custom code.
- Paste the embed code into the Before </body> tag field and click Save.
This is the scope we recommend by default. A campaign that lives on one landing page has no reason to cost you load time on the other forty.
Run the widget site-wide
Site-wide injection loads the wheel on every page, which fits a storewide promotion where the offer applies wherever the visitor happens to be.
To add site-wide code:
- Go to Site settings > Custom code tab.
- Paste the embed code into the Footer code section and click Save changes.
With any of these scopes, the widget shows up in preview but stays invisible to visitors until you publish the site.
Build with the Webflow Data API
Flowstar exposes no public API and no webhooks of its own, so its dashboard is the only place to configure the wheel. Everything programmatic happens on the Webflow side, through Data API v2 at https://api.webflow.com/v2, which is where spin-wheel leads get routed and campaign records get stored. This path needs server-side development.
The work splits across a few parts of the Data API.
- API reference: Webflow's Data API covers CMS collection items and form submissions, the two record types a spin-wheel campaign actually touches.
- Webhook events: the event trigger list includes
form_submission, which fires the moment a visitor submits an email through a Webflow form. - Webhook registration: creating a webhook takes
POST /sites/{site_id}/webhooksand thesites:writescope, and it accepts an optional filter so one form can be watched on its own. - Submission polling:
GET /v2/sites/{site_id}/forms/{form_id}/submissionslists submissions for a form with theforms:readscope, which suits a nightly export better than a webhook does.
Most builds either forward Webflow form submissions to a server in real time or write campaign records into the CMS, and the two sections that follow cover each.
Capture spin wheel leads with a form_submission webhook
When the wheel captures emails through a Webflow form, a form_submission webhook delivers each lead to your server in real time. Forms have to exist in Webflow first, because the API does not create them.
To set this up:
- Register the webhook with
POST https://api.webflow.com/v2/sites/{site_id}/webhooksusing theform_submissiontrigger type. - Receive the payload on your endpoint, which carries
data,schema,submittedAt,formId, andsiteId. - Forward the lead to your CRM or email platform from your server.
Log the raw payload before you reshape it for the destination. A field-mapping mistake is cheap to fix and expensive if it quietly drops the address you just paid a discount for.
Store campaign data in the Webflow CMS
You can log spin outcomes or prize inventory as items in Webflow CMS Collections, then display them with Webflow's native content tools.
To implement this:
- Create a Collection, such as Spin Results, in Webflow with fields matching your data.
- Write records with
POST https://api.webflow.com/v2/collections/{collection_id}/items. New items default toisDraft: true, so they land staged. - Publish them with
POST /v2/collections/{collection_id}/items/publish.
Reads need the cms:read scope and writes need cms:write. The create item reference documents the request body.
What you can build with the Flowstar Spin Wheel Webflow integration
Pairing Flowstar with Webflow gives you gamified conversion campaigns without writing popup logic, prize mechanics, and reporting yourself.
These are the patterns that come up most often on Webflow sites:
- Exit-intent discount recovery: an online store shows a spin-to-win wheel when a visitor moves to leave a product page, which buys one more attempt at a cart that was about to go cold.
- Gamified email and phone capture: a newsletter landing page trades a spin for contact details and builds a list you can use for sales and product announcements.
- Form-completion incentives: a signup page rewards finished forms with an extended trial or gated content, which lifts completion on the longer forms people abandon.
- Timed launch-page engagement: a webinar or product launch page fires the wheel after a set delay and converts readers who were only skimming.
Every one of these comes down to getting a script onto the right pages, so read how to apply custom code before you deploy a campaign across a large site.
That page-by-page script management is also work you can hand to an agent. Connect the Webflow MCP server and it can read and write site-level and page-level custom code for you, which beats opening Page settings on twenty landing pages by hand.
Frequently asked questions
A paid Site plan, Basic or higher, because publishing custom code to a custom domain is not available on the free Starter plan. Starter also caps form submissions at 50 per site, per Webflow pricing, which a live capture campaign burns through quickly. Flowstar's own subscription is separate from your Webflow plan.
Publish the site. Embedded scripts render in preview but never reach visitors until a publish pushes them to your domain. Check the live domain rather than the canvas, and confirm the snippet sits in the scope you meant to target.
Not directly, because Flowstar publishes no connector on those platforms. Route the lead data through Webflow instead: a
form_submissionwebhook or Webflow's Zapier integration hands submissions to whatever automation platform you already run. If the destination is only an email list, Webflow's Mailchimp integration is a shorter route.No, consent handling is not part of the widget. Pair it with a consent platform, block the Flowstar script until a visitor consents through that platform's blocked-scripts settings, and load the consent script first in your site's head code. Webflow's site tracking consent guidance covers the setup, and Flowstar sells a separate GDPR cookie consent app if you would rather keep both with one vendor.
It can, if you load it everywhere. A campaign script running site-wide costs you on every page, including the pages with no campaign on them, so scope it to the campaign pages through Page settings or a single Code Embed element. Measure the difference on your live domain with PageSpeed Insights before and after you add it.
Description
Adds spin-to-win popups and gamified email capture to Webflow pages through custom code embeds you paste into Page settings or a Code Embed element. Lead data routes onward through Webflow form webhooks.
This integration page is provided for informational and convenience purposes only.
ChatGPT
Manage your Webflow site from ChatGPT, add AI chat to your pages, or build a custom OpenAI workflow.
Discord
Connect Discord, a communications platform built around servers and channels, with Webflow to route form submissions, orders, and CMS events into channels or embed live server activity on a page using widgets, automation platforms, or APIs.
Connect WhatsApp, Meta's business messaging platform, with Webflow to add chat buttons, trigger automated messages from form submissions and orders, and build real-time customer communication into any page.
YourGPT Chatbot
Connect YourGPT Chatbot, a no-code AI support platform, with Webflow to deploy an AI agent that answers questions and captures leads using the app or embeds.
FullContext
FullContext provides an embeddable JavaScript solution that handles conversational interfaces through a single code snippet, eliminating the need to build chat infrastructure or maintain form validation logic.
ManyChat
Connect ManyChat, a chat marketing and messenger automation platform, with Webflow to route form submissions into messaging flows and trigger conversations across Instagram, Messenger, and WhatsApp.
Zendesk Chat (Zopim)
Connect Zendesk Messaging, a live chat and AI-powered support platform, with Webflow to add a chat widget, bot responses, help center search, and persistent conversations to any page.
Zendesk
Connect Zendesk, a cloud-based customer service platform, with Webflow to add live chat, AI-assisted messaging, and ticket creation to any page on your site.
Website Toolbox Forum
Connect Website Toolbox Forum, a hosted community discussion platform, with Webflow to embed threaded forums, user management, and moderation tools on any page without backend code.
Related integrations
Get started for free
Try Webflow for as long as you like with our free Starter plan. Purchase a paid Site plan to publish, host, and unlock additional features.
