The Mystery box is a gamified item for Signup Forms. It lets visitors pick a box to reveal a discount while signing up.
In this article, you’ll learn how to add and customize a Mystery box in the Form Builder.
Before You Begin
Mystery box is available on the Pro plan only. Support for Standard plans through an add-on is coming soon.
Have a discount code ready before configuring the Mystery box. Enter this code in the Mystery box settings so customers can use it at checkout.
Mystery box is not currently available in Signup Form templates or in forms generated by the Omnisend agent. Add it manually from the Form Builder. Support for templates and agent-generated forms is coming soon.
Add and Configure a Mystery Box
Step 1. Create or edit a Signup Form
Go to Forms and create a new Signup Form, or open an existing form in the Form Builder.
Step 2. Add the Mystery box item
From the left-side menu, drag the Mystery box item into your form layout.
Select the Mystery box item to open its settings in the right-side panel.
Step 3. Add a discount code
In the Mystery box settings, enter the discount code that customers will receive when they pick a mystery box.
Step 4. Customize the Mystery box styles
Go to the Styles section to customize the appearance of the boxes.
You can adjust:
Font: Select the font for the box text.
Size: Set the text size.
Width: Adjust the width of the Mystery box item.
Border radius: Make the box corners more or less rounded.
Border width: Adjust the border thickness.
Border style: Choose a solid, dashed, or dotted border.
Border color: Select a color or enter a hex code.
Padding: Adjust the space around the Mystery box item.
Step 5. Customize each mystery box
Open Mystery box 1 style, Mystery box 2 style, or Mystery box 3 style to customize each box separately.
For each box, you can configure:
Text: Enter the text displayed on the box.
Text color: Select the color of the box text.
Mystery box color: Select the background color of the box.
Step 6. Save and enable the form
Review the Mystery box on desktop and mobile views.
Once your form is ready, click Enable form.
💡 Visitors see the mystery boxes in the form. After they pick a box, they reveal the discount and receive the code for checkout.
Use Cases
Grow your Contact list: Add an interactive experience to your Signup Form to encourage visitors to submit their contact details.
Offer a signup discount: Let visitors pick a mystery box to reveal a discount they can use at checkout.
Create a choose-and-reveal promotion: Give visitors a choice of boxes instead of displaying the discount as static text.
Offer an alternative to other gamified options: Use Mystery box when you want visitors to choose a box instead of spinning a wheel or scratching a card.
FAQ
Who can use the Mystery box?
Mystery box is available on the Pro plan. Standard-plan support through an add-on is coming soon.
What happens when a visitor picks a mystery box?
The visitor picks one of the boxes and receives the discount code configured in the Mystery box settings.
Can I customize each mystery box separately?
Yes. Open the style settings for each box to change its text, text color, and background color.
Can I change the appearance of the Mystery box?
Yes. You can customize the font, size, width, border, border color, border radius, and padding.
Need more help? Contact our Support Team via in-app chat or at [email protected].