loading

Customizing Salesforce Confetti: Tips for Your Unique Needs

post_thumbnail

Customizing Salesforce Confetti: Tips for Your Unique Needs

Customizing Salesforce Confetti_ Tips for Your Unique Needs

Custom confetti in Salesforce is more than just a fun animation; it’s a tool that can energize your team and reinforce business milestones. While Salesforce’s default confetti feature helps celebrate when users achieve specific goals, customizing it can better align with your company’s brand and values.

In this post, you’ll discover the benefits of custom confetti in Salesforce, how to enable it, and practical tips for customization to meet your unique needs.

1. Understanding Salesforce Confetti

Understanding Salesforce Confetti

Salesforce introduced the Confetti Celebration feature in 2019 as part of its Path component. When users reach a milestone—such as closing a deal in the “Closed Won” stage—confetti explodes on their screen, adding a celebratory element to routine tasks.

While confetti may seem like a simple feature, its ability to boost user engagement and satisfaction shouldn’t be underestimated, businesses can leverage confetti to make tasks more rewarding, fostering a positive work environment.

2. Why Customize Salesforce Confetti?

Custom confetti helps to create a personalized experience for your users. Here’s why you should consider customization:

  • Brand Identity: Customizing confetti to use your brand’s colors and themes adds a subtle yet powerful branding element.
  • Employee Motivation: Whether recognizing employee achievements or marking specific business goals, custom confetti can be tailored to make these celebrations more impactful.
  • Frequency Control: Depending on how often you want users to see confetti, Salesforce offers options to trigger confetti rarely (5% of the time), often (50%), or always (100%). Adjusting these settings ensures confetti doesn’t lose its special appeal.

3. How to Enable Confetti in Salesforce

To enable and customize confetti in Salesforce, follow these steps:

  1. Navigate to Setup: In Salesforce, click the gear icon (Setup), and use the Quick Find box to search for “Path.”
  2. Enable Path: If the Path feature is not enabled, click Enable. Paths are required to trigger confetti celebrations and guide users through various stages of objects like Opportunities or Leads.
  3. Create or Modify a Path: Click New Path or edit an existing one. You’ll need to select the Object (e.g., Opportunity) and configure the key fields for each stage of that object. Paths can be tied to custom objects or standard objects like Leads.
  4. Configure Celebration Settings: On the final step of Path configuration, scroll to the Celebration Settings. Here, you’ll find the option to turn on confetti for specific stages (e.g., Closed Won for Opportunities). Simply toggle the celebration on. This will add the confetti animation to the desired stage.
  5. Set Confetti Frequency: Salesforce lets you control how often users see confetti. The available settings include:
    1. Always: 100% frequency, used for rare achievements.
    2. Often: 50% for milestones that occur regularly (once or twice weekly).
    3. Sometimes: 20% for milestones achieved multiple times per week.
    4. Rarely: 5% for frequent but less critical achievements​.
  6. Activate and Test: Once the configuration is complete, click Activate. Test the Path by updating a record to the selected stage (e.g., Closed Won), and the confetti should display according to your configured settings.

Ensure users have the View Setup and Configuration permission to see the confetti celebration on their screens​.

4. Customizing Salesforce Confetti

Customizing Salesforce confetti goes beyond the default settings, allowing you to create a more personalized celebration experience. Here’s a step-by-step guide on how to do this:

1. Access the Confetti Settings

  • Follow the steps mentioned earlier to enable confetti through Path Settings.
  • Once confetti is enabled, basic customizations can be done directly within the Salesforce UI. But for deeper customization, like changing colors, animation styles, or confetti behaviour, you will need to work with Lightning Web Components (LWC) and JavaScript.

2. Modify Confetti Frequency and Appearance

To customize the frequency and style of confetti in a more detailed way, such as adding different animations or modifying particle behaviour, follow these steps using LWC:

  • Create a Static Resource: First, upload a confetti script to Salesforce as a static resource. You can use external JavaScript libraries like Canvas-Confetti to generate different confetti effects. Here’s how:
    • In Setup, go to Static Resources.
    • Click New, and upload the JavaScript file for confetti.

     

  • Create a Lightning Web Component: To start customizing confetti, create a Lightning Web Component (LWC) that will trigger and modify the confetti animation. Here’s a sample LWC code:
    <template>
    <lightning-button label=”Trigger Confetti” onclick={handleConfetti}></lightning-button>
    </template>

Then, in the JavaScript file (confetti.js):
import { LightningElement } from ‘lwc’;

import confetti from ‘@salesforce/resourceUrl/confetti’;  // Import confetti script from static resource

export default class CustomConfetti extends LightningElement {

  handleConfetti() {

    // Call the confetti function with custom configurations

    confetti({

      particleCount: 100,         // Number of confetti particles

      spread: 160,                // Confetti spread angle

      origin: { y: 0.6 },         // Starting point for confetti

      colors: [‘#FF0000’, ‘#00FF00’, ‘#0000FF’],  // Custom colors

    });

  }

}

This example triggers confetti when the button clicks, customizing the number of particles, spread angle, start position, and color.

  • 3. Custom Confetti Types

            You can also add different types of confetti, such as fireworks, bursts, or shower effects, by modifying the JavaScript configuration. For example:

Fireworks Mode:

 fireworks: function() {

  var interval = setInterval(function() {

    confetti({

      particleCount: 300,

      startVelocity: 45,

      spread: 360,

      origin: { x: Math.random(), y: Math.random() },

    });

  }, 250);  // Custom interval

}

Shower Effect:

shower: function() {

  confetti({

    particleCount: 50,

    startVelocity: 20,

    spread: 180,

    ticks: 300,  // Duration of the confetti fall

  });

}

  • 4. Apply Customization to Specific Stages
    You can apply confetti customizations to different stages of an object in Salesforce. For example, in the Closed Won stage of an Opportunity, the custom confetti you configured in LWC can be triggered programmatically through Salesforce’s built-in automation (e.g., Flow Builder or Apex triggers).
    • To do this, integrate the LWC into a record page layout and ensure it’s activated when certain milestones or conditions are met, such as closing an opportunity.
  • Testing Your Customizations

Before rolling it out to your team, always test the confetti customizations in a sandbox environment to ensure all configurations work as expected. Verify the frequency settings and ensure the confetti is not triggered too often, as overuse can reduce its impact​.

5. Common Mistakes and How to Avoid Them

Common Mistakes and How to Avoid Them

While setting up custom confetti is straightforward, here are a few mistakes to watch out for:

  • Overuse of Confetti: Seeing confetti too often can dilute its impact. Set it to appear only during important milestones.
  • Browser Compatibility: Confetti may not display correctly in certain browsers, such as Firefox. Ensure your team uses supported browsers.
  • Permission Issues: Users need specific permissions to view confetti animations. Make sure the View Setup and Configuration permission is granted.

Conclusion

Customizing Salesforce confetti is an easy and effective way to make everyday tasks more engaging for your team. Whether you want to motivate your sales force, reward your support team, or simply add a fun element to your Salesforce environment, custom confetti helps you celebrate success in a personalized and meaningful way.

Advayan’s first Confetti Path Enhancer product is in its final review stage and will be launched soon! This exciting new feature allows users to:

  1. Customize brand color themes in their Salesforce environment.
  2. Set different types of confetti for leads, opportunities, or any custom workflow.
  3. Add music to the confetti shower for a more cheerful and engaging experience at any predefined stage.

And that’s just the beginning—best of all, it’s free for Salesforce users! Visit Advayan’s page for more details and to discover more innovative Salesforce products like this.

Drop us a line