What You’ll Learn
- Set up your Spin to Win
- Explore Advanced Options
- Follow STW best practices
The Spin to Win widget by Digioh is a super engaging gamification tool that helps you connect with your visitors in a playful, interactive way. Add it to a pop-up and you’re ready to offer prizes, discounts, or fun surprises all while collecting valuable leads.
How to get started:
1.Start from a theme
To kick off your Spin to Win campaign, you can choose from our ready-to-go themes under Gamification in the Use Case section. It’s a great starting point and of course, you can fully customize everything later to match your brand.
2.Configure Your Widget
Inside the campaign where you’ve placed your Spin to Win widget, open the Custom Widget Configuration panel and click on Configure Widget to start tweaking.
3.Customize Your Wheel
You can easily add or remove segments and personalize each one with its own text or image, color, probability, and even specific coupons. Make the experience feel on-brand and fun!
4.Configure Spin Button
In the settings section, you’ll find options for configuring the Spin Button and defining what happens after the user spins the wheel. You can use the center circle of the spinner or another button element on your page.
If you are capturing Email or other form data on the step/page with the spinner, make sure to set it to Submit Form, and set your After Form Submit proceeding to your desired next page.
The button action set in the Spin to Win (STW) will always override the button action configured in the editor.
5.Explore Advanced Options
The Advanced Settings section lets you fine-tune elements like the wheel design, center circle, segment styles, and data capture behavior.
Best Practices
Tips
1.You can use merge tags like [CUSTOM_19] or [CUSTOM_20] on pages like your Thank You page to automatically show users their prize and coupon code. Set which custom fields you want to use in the Advanced Settings.
2.Since all segments share the same text color, stick with similar background tones across the wheel to keep things clean and easy to read.
3.Want to use your brand font? Just make sure it’s already used somewhere on your page in the editor that way, it’ll load correctly in the widget.
4.If you would like to add a line break to your text in a segment, add a ^ character between lines.
5.You can only display text or an SVG image on each segment. However, you can still add text if you want to display that in the following steps of your campaign. SVGs will ensure images look crisp on all devices.
6.For the best layout, size the wheel element to a slightly taller square (example: 330×365). Since the size of the element doesn’t show exact dimensions, it helps to keep Inspect open while adjusting if you want to be exact.
