Sale
Evening print
$45, was $60
Website elementsOffers & conversion
Sticker
A sale badge, built into your site with no plugin and no library. A badge pinned to a corner of a card or image: a turned label, a round sticker or a ribbon across the corner, in three tones. The host places it inside a position: relative box. `label` gives the spoken name when the text is not the meaning (“-20%” is read “20% off”, automatically for a bare percentage or amount). No motion, no script.
You'll need to give us
- What each sticker says, and which cards or photos carry itSuch as “New” on this month’s products.
Send these with your request and we can start straight away. Everything else is ours to do.
Mark the sale, the new arrival or the last few in stock right on the photo, where shoppers look first.
Also called
sale badgesale stickercorner ribbonproduct badgediscount badgenew badgeprice tagWooCommerce sale flash
What it replaces
- WooCommerce “Sale!” flash and badge plugins
- page-builder ribbon and badge modules
- corner-ribbon CSS snippets
- sale stickers baked into product photos
Good for
One short word or number on a product, offer, post or event card: Sale, New, -20%, Sold out, Last few, Free delivery.
Not for
A list of labels (that is tags), a message the visitor must read (put it in the text: a sticker is decoration a screen reader still names, not the only place a price or a condition lives), or a banner across the page (announcement-bar). One sticker per card; two fight each other.
Accessibility
Written so the page works for every visitor, whether they browse with a mouse, a keyboard or a screen reader, and whether or not they have asked for less motion.
- Read as written, where it sits in the source: put it before the card’s title and a screen reader says “Sale, Evening print”.
- When the text is not the meaning, `label` is read and the text is hidden from assistive technology. “-20%” and “-$10” get “20% off” and “$10 off” by themselves (English). `label=""` hides a sticker that only repeats what the card already says.
- The fallback colors of all three tones clear 4.5:1 (7.27, 6.57 and 14.75 to 1); `npm run check` computes them. A transparent border draws it in forced-colors mode.
- It ignores the pointer, so a tap on it reaches the card’s link. It is never focusable and never interactive.
- No motion at all, so nothing to reduce. No JavaScript, so nothing differs without it.
Where it's live
- superherotech.ai: /elements/sticker/ (demo)
How to ask for it
“The sticker on our home page, with …”
Name it, say which page and which part of the page it goes on, and say what goes in it: your photos, your words, your colors. That is a complete request. We build it, you approve it, and it goes live. If you know it by another name, from WordPress or from another site, that works too.
More elements you can ask for: Before / After, Particle field, Mega menu, Video background, Parallax band, Scroll reveal, Business hours, News ticker, Flip box, Instagram feed, Accordion / FAQ, Card slider, Tabs, Info list, Video player, Testimonial carousel, Icon library, Animated text, Cookie consent, Animated background, Modal box, Announcement bar, Image hotspots, Info circle, Slide box, Countdown, Content toggle, Off-canvas panel, Video gallery, Map and directions, Link effects, Tabcordion, Tooltip, Responsive table, Notice, Toast, Loading, Menu button, Radio group, Stepper, Tags, Scrollbox. Or see all of them working.
More in Offers & conversion
See them all working- News ticker
Keep your latest news, offers and events turning over in one slim strip, so visitors see what is new without a banner shouting at them.
- Modal box
A box that opens when it is asked for — a click, a scroll, a hand leaving for the tab bar — and stays gone once it's been closed.
- Announcement bar
One line across the top for the thing that matters this week — with a date it stops itself, and a dismiss that stays dismissed.
- Countdown
Show exactly how long is left — to the end of a sale, the start of an event or today’s order cut-off — in your time zone, not the visitor’s guess.
Want the sticker on your site?
Tell us about the business. We build the site with it, launch it, and change it whenever you ask.