Effects Addon

The Effects Addon lets you add different effects to your project. You can choose from various types of effects and customize each one to build your own effects library. 

How to Enable It

1. Open the Building Blocks on the left sidebar of the editor
2. Search for “Effects Addon” 
3. Drag the Effects Addon onto your project to enable it
4. Create a new Effects Addon and give it a name, e.g. My Effects
5. Configure the addon using the settings below 

Settings

1. Click “Add Effect” to add a new Effect
2. Customize the Effect Name, Type and Configuration
3. Click “Save” to confirm your effect configuration
4. Click “Save” again to save your changes

Actions

Once your Effects Addon is enabled and configured, you will gain access to a set of actions. These actions are automatically generated for each effect you create, making it easy to control effects directly from triggers (e.g., On Click, On Page Load, After Form Submit). 

1. Play
   • Play a specific effect
   • Example: Play Small Confetti
   • Additional configuration: 
     • Target Component (optional): Choose a component in your project where the effect should be rendered. If left empty, the effect will display as a full-screen overlay. 
2. Stop
   • Stops the specific effect you created
   • Example: Stop Small Confetti
3. Stop All Effects
   • Stops all active effects currently running in the project. Useful when navigating to a new page or closing a popup

Performance

To prevent performance issues from stacking too many effects or overlays, it’s recommended to use Stop or Stop All actions to control and end long-running or looping effects.

Optional: Unbind from Project 

When you add an Effects Addon to a project, it becomes bound to that specific project. If you want to reuse the same Effects Addon in multiple projects, you will need to unbind it from the current project first. 

After unbinding, you can easily add the Effects Addon to any project from the Building Blocks. Then, simply enable the unbound addon instance you want to use from the global list. 

To unbind the addon, click the “Unbind from Project” button at the top of the addon screen. This will make it available for use on other projects.