How to Add Crazy Egg Goal Celebration Confetti to Boost Conversions

Introduction

Ever wondered why some websites feel more rewarding when a visitor completes a goal? Crazy Egg’s Goal Celebration Confetti adds a burst of visual delight that can increase user satisfaction and nudge conversions. In this post we’ll explore what the confetti feature is, why it matters, and step‑by‑step how to set it up.

What Is Crazy Egg Goal Celebration Confetti?

Crazy Egg’s Goal Celebration Confetti is a lightweight JavaScript overlay that triggers a brief shower of animated confetti whenever a pre‑defined conversion event fires – such as a sign‑up, purchase, or form submission. It’s a subtle psychological cue that tells users, “You did something great!” without interrupting the experience.

Why Use Confetti for Goal Celebrations?

  • Instant positive reinforcement – The brain associates visual reward with the action, encouraging repeat behavior.
  • Improved perceived value – A celebratory animation makes the conversion feel more significant.
  • Higher completion rates – Studies show micro‑rewards can lift conversion rates by 3‑7%.

Step‑by‑Step Setup Guide

1. Identify the Goal

In your Crazy Egg dashboard, create a goal that matches the action you want to celebrate (e.g., "Purchase Complete" or "Newsletter Subscribe").

2. Add the Confetti Script

Copy the following snippet and place it just before the closing </body> tag on the page where the goal occurs.

<script src="https://cdn.crazyegg.com/celebration/confetti.min.js"></script> <script>   // Replace "YOUR_GOAL_ID" with the actual goal ID from Crazy Egg   const goalId = "YOUR_GOAL_ID";    // Listen for Crazy Egg's custom event when the goal fires   document.addEventListener('ceGoalCompleted', function(e) {     if (e.detail && e.detail.id === goalId) {       // Launch confetti for 2 seconds       Confetti.start({duration: 2000, colors: ["#ff6b6b","#ffa502","#1dd1a1"]});     }   }); </script>

3. Test the Trigger

  1. Open the page in incognito mode.
  2. Complete the goal (e.g., submit the form).
  3. Watch the confetti animation – if it appears, you’re all set!

4. Fine‑Tune the Experience

You can adjust:

  • Duration – shorter bursts feel snappier; longer bursts feel celebratory.
  • Color palette – match your branding for a cohesive look.
  • Particle count – lower numbers for faster load times.

Best Practices for Maximum Impact

  • Keep it brief – 1–2 seconds prevents distraction.
  • Combine with a thank‑you message – Reinforce the celebration with text.
  • Mobile‑friendly – Test on small screens; confetti should not cover key CTA buttons.
  • Analytics tracking – Use Crazy Egg’s heatmaps to see if the confetti correlates with higher downstream actions.

FAQ

Do I need a paid Crazy Egg plan to use confetti?

Yes, the celebration feature is available on Pro and Enterprise tiers.

Will confetti affect page load speed?

The script is lightweight (<10 KB gzipped). Load it asynchronously to keep performance optimal.

Can I trigger confetti on multiple goals?

Absolutely. Add additional if checks for each goal ID within the same event listener.

Is the confetti accessible?

It’s purely visual. For screen‑reader users, you can add an ARIA live region that announces the celebration.

What if I want a different animation?

Crazy Egg supports custom celebration effects via the same API – replace Confetti.start() with Fireworks.start() or your own canvas animation.

Conclusion

Adding Crazy Egg Goal Celebration Confetti is a quick, low‑cost way to turn ordinary conversions into memorable moments. By following the steps above, you’ll boost user delight, reinforce positive behavior, and potentially lift your conversion metrics. Ready to celebrate?

Call to Action

Start a free 30‑day trial of Crazy Egg today, set up your first goal, and watch the confetti work its magic. Get started now!

Comments are closed, but trackbacks and pingbacks are open.