Support
Our support team is ready to assist with any questions while using our apps.
Reward Bar Module
The Reward Bar displays a progress bar that incentivizes customers to reach specific cart totals. When customers hit your defined goals, they unlock rewards like free shipping or free gifts.
How It Works
Section titled “How It Works”The progress bar automatically calculates and displays:
- Current progress: How close the customer is to the next reward
- Amount remaining: How much more they need to spend (e.g., “Add $38.00 more to get FREE shipping!”)
- Goal reached: A success message when the threshold is met
The bar updates in real-time as customers add or remove items from their cart.
Enabling the Module
Section titled “Enabling the Module”Toggle the Reward Bar on or off using the Enable/Disable button at the top of the module settings.
Reward Steps
Section titled “Reward Steps”Define cart goals and the rewards unlocked when each goal is reached. You can create multiple reward steps with different thresholds.
Adding a Reward Step
Section titled “Adding a Reward Step”Click Add step to create a new reward. Each step includes:
- Reward Type: Free shipping or Free gift
- Goal Amount: The cart total threshold (e.g., $100)
- Enabled Toggle: Activate or deactivate the step
Reward Types
Section titled “Reward Types”Free Shipping
Section titled “Free Shipping”When customers reach the goal amount, the progress bar shows they’ve qualified for free shipping.
Free Gift
Section titled “Free Gift”Automatically add a gift product to the cart when customers reach the goal amount.
Managing Steps
Section titled “Managing Steps”The reward steps table displays:
| Column | Description |
|---|---|
| Reward | The type of reward (Free shipping or Free gift) |
| Goal | The cart total threshold |
| Status | Whether the step is enabled or in draft |
| Actions | Edit, duplicate, or delete the step |
Steps are automatically sorted by goal amount, so lower thresholds appear first.
Animation
Section titled “Animation”Add visual interest to your progress bar with animated stripes.
- Animated stripes: Enable this option to show diagonal stripes that move across the filled portion of the progress bar
Design
Section titled “Design”- Background Color — Progress bar fill color
- Text Color — Text displayed on the bar
- Padding — Controls the height of the bar (default: 15px)
- Text Alignment — Left, center, or right