We appreciate that sometimes...
You need to be able to shout out about new features, events, and general updates.
You need a way to grab their attention during onboarding.
You need to be able to block users from your product or premium features until they upgrade.
You don't always have the space to embed content like videos, forms, or extra information onto a specific page in your product
So, we built overlays!
You can display content in an overlay that sits on top of your product, rather than embedded in-line in your product. You can make them any size or shape and place them anywhere on the page! Plus, you can trigger them from Candu CTAs.
➡️ Need inspiration for what to create? Check out this article on use cases for overlays!
Understanding Overlay Controls
Component:
Choose whether you want your overlay to be dismissible or not > Select your overlay, head to Component in the toolbox, and make it dismissible!
Note: If your overlay is dismissible, users can click on the 'X', on a button set to dismiss the overlay or anywhere on their screen - these will be tracked as User Events.
Choose whether you want to Hide the Backdrop, e.g. turn your oveerlay into a Pop-up, where users can interact with the screen behind!
Styles
Element Alignment
Use Element Alignment to position your overlay on your page - do you want it in the middle, or bottom right corner, so many choices!
Overflow
Use our Overflow feature to choose whether to show content that "spills over" or hide it:
You can enable scroll when the content is longer than the space allows:
Border Radius
You can add a border radius to make your overlay more rounded!
Border Width and Color
You can add a border width to your overlay and change the color!
Backdrop color
Set a backdrop color - make sure you set an opacity or it will default to a block color!
Interactions
Using a Button to dismiss your overlay
You can set your overlay to dismiss from a button click > add your button and get the interaction to be Dismiss Overlay 🙌
Now that you know what options are available for building overlays, do you want...