Brief Overview

Use the Design Gallery to apply and customize pre-designed templates for your WalkMe balloons and ShoutOuts — without touching the global CSS console.

How It Works

The Design Gallery lets you apply pre-built templates directly to a balloon or ShoutOut in a few steps.

1. Open a balloon or ShoutOut and go to the Interaction tab
2. Select Change Design
3. Choose a template to apply the design
4. Any custom CSS and BBcode is added to the item in the Rich Text Editor

CSS

Each balloon and ShoutOut has its own local CSS console, so templates apply without affecting other items or requiring the Item ID.

Editing local CSS within a balloon or ShoutOut also updates the global CSS.

CSS Precedence

When CSS rules conflict, priority is applied in this order:

1. Local level (Rich Text Editor) — overrides all other CSS
2. Customize menu → Balloon tab — overridden by local CSS
3. Global CSS console — applied last

BBCode

Some templates use BBCode alongside custom CSS. When applied, BBCode overwrites any existing text and BBCode in the balloon. This can't be undone with the Reset button — BBCode templates can only be edited at the local level.