Lucky Wheel

How to build with Lucky Wheel and Webflow

Smartarget Lucky Wheel adds spin-to-win popups to Webflow sites that display a spinning wheel interface where visitors submit their email address to reveal discount codes or promotional offers. The widget triggers based on visitor behavior, including scroll depth percentage, time on page, or exit intent detection when visitors move their cursor toward the browser's close button. You can customize colors, prize configurations, and display rules through Smartarget's dashboard before embedding on your Webflow site.

This approach differs significantly from traditional email capture methods. Static email signup forms require visitors to manually enter their information without any interactive element, which can result in lower engagement. In contrast, Lucky Wheel provides a pre-built popup system with a gamified spinning wheel interface that visitors interact with in exchange for their email address. The widget handles display triggers and data collection automatically, eliminating the need for custom code.

To get started, you can add Lucky Wheel to Webflow through two methods: using the Lucky Wheel app from the marketplace for integrated management, or adding Lucky Wheel with Code Embed element for page-specific popups. Both methods support full visual customization through Smartarget's dashboard.

Use the Lucky Wheel app

The Lucky Wheel app in the Webflow Apps marketplace is available as a native Webflow integration. Install the app through Webflow's standard marketplace installation flow, authenticate your account, and configure settings within Webflow.

The marketplace app includes these features:

• Lead capture interface: Customizable spinning wheel for collecting visitor information  
• Display triggers: Exit-intent detection, time-on-page delays, and scroll-depth percentages  
• Promotional configuration: Discount amounts, prize types, and win probability settings  
• Real-time reporting: Engagement metrics tracking  
• Mobile responsiveness: Touch-enabled interfaces on all device sizes

The app requires permissions to read and write custom code for implementing the interactive wheel, plus read site data for proper integration.  

Add Lucky Wheel with Code Embed element

For targeted landing page implementations, add Lucky Wheel to specific pages using Webflow's Code Embed element. This method works well when you want to test different popup campaigns on select pages or run promotions only on high-traffic landing pages without affecting your entire site.

Open Webflow, access the Add panel in the left sidebar, and drag a Code Embed element onto your canvas. Double-click the element to open the embedded code editor, paste your Lucky Wheel JavaScript snippet from Smartarget's dashboard, and publish.

This method supports up to 50,000 characters per embed and accepts HTML, CSS (<style> tags), and JavaScript (<script> tags). Scripts display only as a placeholder in the canvas and functionality appears after publishing to your staging or live site. Before embedding, configure all settings through Smartarget's dashboard. You can adjust color schemes, customize call-to-action text, set trigger conditions (scroll position percentage, time delay in seconds, exit intent cursor detection), and configure data collection fields without code editing.

What you can build

Integrating Lucky Wheel with Webflow enables email list building through a spin-to-win popup mechanism that captures visitor information in exchange for discount incentives.

• E-commerce discount campaigns: Display exit-intent triggered Lucky Wheel popups when visitors show abandonment behavior, offering percentage discounts or promotional codes to encourage cart completion and capture email addresses for retargeting campaigns  
• Lead generation landing pages: Add scroll-depth triggered Lucky Wheel displays to product launch pages or webinar registration sites that collect visitor information in exchange for exclusive content, early access codes, or premium feature trials  
• Seasonal promotion pages: Create time-limited campaign pages with branded Lucky Wheel designs matching holiday themes (Black Friday, summer sales) that distribute promotional incentives while building segmented email lists for future marketing  
• Mobile-first engagement experiences: Deploy touch-enabled Lucky Wheel interactions on mobile landing pages where traditional forms create friction, capturing leads through gamified exchanges with full responsiveness across device sizes