Winner Reveal Page

A dramatic, cinema-style reveal experience for announcing raffle winners. Designed for embedding on dedicated pages or using as a live-streaming overlay on YouTube, Facebook, or Instagram.

Overview

The winner reveal is a presentation layer — it reads from the existing winner data created by the free plugin's draw system. It does not modify or create winners; it simply displays them with animations.

Winner data is loaded via AJAX, so the page source never contains spoilers before the reveal animation plays.

Shortcode

[raffle_reveal id="123"]

Examples

[raffle_reveal id="123"]
[raffle_reveal id="123" style="spotlight" heading="And the winner is..."]
[raffle_reveal id="456" show_ticket="false" show_city="false"]

How it works

• Place the shortcode on any page or post.
• The page shows a dark-themed stage with the raffle name and a "Reveal Winner" button.
• Clicking reveals the first winner with a confetti animation and a scaling card transition.
• If there are multiple winners, a "Next Winner" button appears to reveal them one by one.
• After all winners are revealed, an "All winners revealed!" message appears.
• A "Start Over" button lets you replay the entire sequence.

Full-screen mode

A Full Screen button uses the browser Fullscreen API to expand the reveal to fill the entire screen. This is ideal for:

• Live-streaming on YouTube/Facebook/Instagram
• Projecting at events
• Screen-sharing during video calls

The dark background and centered layout are optimized for full-screen presentation.

Animation styles

All styles include the card scale-in animation with a spring easing curve.

Privacy

The reveal respects the core plugin's rfwc_mask_winner_name filter. When name masking is enabled, names appear as "Jn Sh". City is automatically hidden when name masking is active.

Requirements

• Winners must be drawn using the free plugin's winner selection system first.
• If no winners have been drawn, the page shows "No winners drawn yet. Check back soon!"

CSS classes