Skip to main content
Choosing the right Embeddable type

Know the differences between Banners and Cards and when to use each

Tiago Mota avatar
Written by Tiago Mota
Updated over 8 months ago

You can use Embeddables to deliver in-app guidance with minimal disruption for users. Place native messages in your app to help users get started, announce updates or exciting events without interrupting users' flows.

When creating Embeddables, you can leverage the other Chameleon components to engage users such as adding media or CTA buttons that launch other Tours or links.

πŸ‘‰ Explore an interactive demo of Embeddables and learn how to leverage native patterns.


Availability & Usage

πŸ” Startup: 5 Embeddables

πŸ” Growth & Enterprise: unlimited Embeddables

✚ Pair well with additional Actions


The Embeddables you can build with Chameleon

You can pick between 2 types of Embeddables in Chameleon:

  • Banners -- single-step announcements (full-width or embedded)

  • Cards -- multiple content blocks evenly distributed

The type you pick dictates the urgency of your message, as Banners can appear full-width at the top/bottom of the page, while Cards will display in a set container space.

Each of these will sit comfortably in your app's interface and display to users based on the audience you choose and the different display rules you set.

You'll select an element on the page and choose whether to place your Embeddable before or after the selected element. Chameleon will create a container for your Emebddable and you can configure your announcement as usual using the Builder.

Let's look at the core differences between Banners and Cards and how you can leverage each of them.

Banners

Banners are in-app Experiences that balance urgency and non-intrusiveness and can tip toward either need depending on the configurations you choose. You can use them for critical announcements, exciting offers, or events.

A Banner will stretch to fit the width of the space/container you set for it. You can show your Banner at the top (or bottom) of the page.

Or, you can embed it inline anywhere on the page for less disruptive announcements.

β„Ή You can also show multiple Banners in the same place and update the order in which they show to users.

Cards

Cards are embedded content blocks that you can place anywhere in your app and use to communicate different messages at the same time.

You can show up to 4 Cards at a time, that are evenly distributed over the width of the container. Each Card can have a different message and CTA that can launch other interactive Tours, or links.

They shine when teaching users different steps to take, such as during onboarding, when introducing new features, or simply to share tips, guides, your latest events, or news. As users complete/exit individual Cards, in a "set", the remaining Cards will adjust to take up the remaining space in the container.

πŸ‘‰ Both Banners and Cards offer you a lot of flexibility to achieve a native style with in-app announcements. You can experiment with different positions and adjust the margins for a polished look.


Measuring success

Chameleon collects events related to how users engage with your Embeddables to help you measure the impact of your efforts. You can review their performance in the Dashboard, in your analytics tools, or download the data from Chameleon.

With Banners, you can also leverage your custom events as "Conversion Goals" to track how effective they are to drive the desired user actions.

β„Ή A/B Testing is available for Banners and Cards will soon have Control testing.

Did this answer your question?