Promote a deal with a price, coupon and deadline in one box.
Deal and promotion boxes with highlighted titles, big offers, sale prices, a copyable coupon, deal countdowns, stock bars, badges and two buttons.
Elementor widget
Requirements
- Elementor 3.5 or newer
- WordPress 6.2 or newer
- PHP 7.4 or newer
- Licence: Pro ($2 / year) — add it to the cart in Moduly
Add it to a page
- Edit the page with Elementor.
- In the widget panel, search for Promo Box. Our widgets sit in the Moduly category and carry the Moduly badge.
- Drag it onto the page.
- Set it up in the Content tab, style it in the Style tab, and use Advanced for spacing, motion and visibility.
Settings
Image
| Setting | What you can set |
|---|
| Image | Image |
| Image Resolution | any registered image size |
| Image Dimension | You can crop the original image size to any custom size. You can also set a single value for height or width in order to keep the original size ratio. |
| Image Position | Left, Right, Top, Bottom, Behind the text or Hidden |
| Product Cut-Out | Show the whole image contained (for product shots) instead of cropping it to fill. |
Text
| Setting | What you can set |
|---|
| Eyebrow | Text |
| Eyebrow Position | Above the title or Below the title |
| Title | Text |
| Highlighted Part | Text |
| Text After the Highlight | Text |
| Highlight Style | Accent colour, Gradient text, Marker behind, Hand-drawn underline or Outlined letters |
| Title Tag | H1, H2, H3, H4, H5, H6 or div |
| Description | Text |
Offer, Price, Coupon & Timer
| Setting | What you can set |
|---|
| Big Offer Line | Text |
| Before the Offer | Text |
| After the Offer | Text |
| Sale Price | Text |
| Original Price | Text |
| Stock Line | Text |
| Claimed (%) | Shows a progress bar under the stock line. Leave empty for none. |
| Coupon Code | Text |
| Coupon Label | Text |
| “Copied” Text | Text |
| Deal Countdown | On / off |
| Counts Down To | A fixed date, A time after each visitor’s first view or Midnight every day (site time) |
| Ends | In the site’s time zone. |
| Hours | Number |
| Label | Text |
| Style | Boxes or Inline text |
| Show Days | On / off |
| When It Ends | Show a message, Hide the whole box, Keep the box, stop at zero or Start again (per-visitor timer) |
| Message | Text |
| Setting | What you can set |
|---|
| Text | Text |
| Link | Link |
| Icon | Icon picker |
| Style | Solid, Outline, White or Text link |
| Link the Whole Box | Link |
Badge
| Setting | What you can set |
|---|
| Badge Text | Text |
| Style & Position | Tag — top left, Tag — top right, Tag — bottom left, Tag — bottom right, Corner ribbon, Round sticker or Starburst |
Layout & Hover
| Setting | What you can set |
|---|
| Text Alignment | Left, Center or Right |
| Vertical Alignment | Top, Middle or Bottom |
| Minimum Height | 0–900 |
| Text Max Width | 200–900 |
| Hover Effect | None, Zoom the image, Lift the box, Draw an inner frame, Shine sweep or Tilt the image |
Style tab: design controls for Box, Image, Text, Offer, Price, Coupon & Timer, Buttons or Badge — colours, typography, spacing, borders and hover states.
Tips
- Start with the Style choice — it changes the overall look the most; fine-tune the rest afterwards.
- Visitors who ask their device for reduced motion get a calmer, still version automatically.
Troubleshooting
- Changes not showing on the live page? Regenerate CSS in Elementor → Tools → Regenerate CSS & Data and clear any page cache.
- Also available for Divi (Promo Box), Gutenberg (Promo Box).
- Works well with: Advanced Comparison Table, Advanced Pricing Table, Comparison Table.
