Steps

A Step represents a single screen within a multi-step Experience. Steps define:

What to show — title, body text, buttons, and input fields
Where to show it — positioned relative to the screen, snapped to an element, or rendered inline
When to show it — triggered on page load, element visibility, click, hover, or custom events

Schema

Property	Type	Description
`id`	ID	The Chameleon ID
`created_at`	timestamp	When this happened or when this was added to the Database
`updated_at`	timestamp	The last time any property was updated
`title`	string	The configured title text for this Step
`body`	string	The configured body copy for this Step
`preset`	string	The template this step follows (see Step presets below)
`dropdown_items`	array<String>	For a dropdown Microsurvey Step, the configured options for the dropdown
`follow_up_delay`	integer	Delay in milliseconds before follow-up actions are triggered
`cta_has_custom_click`	boolean	Whether the CTA requires custom click handling
`step_trigger`	string	Primary trigger condition. One of: `page_load`, `element_match`, or `element_not_match`
`position_type`	string	How the step is positioned on the page. One of: `relative_to_screen`, `snap_to_element`, `snap_to_trigger`, or `inline`
`step_additional_trigger`	string	Additional trigger condition. One of: `element_match` or `element_not_match`
`secondary_trigger`	string	Secondary trigger condition. One of: `click`, `hover`, `time_on_page`, `smart_delay`, `input`, or `custom_trigger`
`trigger_element`	Element	Present if `step_trigger` is `element_match` or `element_not_match`.
`trigger_additional_element`	Element	Present if a `trigger_additional_element` has been selected in the UI.
`trigger_secondary_element`	Element	Present if `position_type` is `snap_to_trigger` OR if `secondary_trigger` is one of `click`, `hover`, `input`.
`position_element`	Element	Present if `position_type` is `snap_to_element` or `inline`.
`exit_element`	Element	Present if `cta_has_custom_click` is true.
`buttons`	array<Button>	Array of Buttons for this step
`quantifier_urls`	array	List of URL matching conditions that must match the current page URL
`quantifier_urls.id`	ID	Unique identifier for this URL condition
`quantifier_urls.url`	string	The specific URL used in this matching condition
`quantifier_urls.match_type`	string	The type of matching used. One of: `simple`, `exact`, `regex`, `inverse_simple`, or `inverse_exact`

Step presets

Steps use a preset to define their type and behavior:

Preset	Type	Description
`survey_two`	Microsurvey	Two-choice survey (e.g., Yes/No, Thumbs Up/Down)
`survey_nps`	Microsurvey	Net Promoter Score (0-10 scale)
`survey_csat`	Microsurvey	Customer Satisfaction score
`survey_ces`	Microsurvey	Customer Effort Score
`survey_three`	Microsurvey	Three-choice survey
`survey_four`	Microsurvey	Four-choice survey
`survey_five`	Microsurvey	Five-choice survey (e.g., Likert scale)
`survey_input`	Microsurvey	Free-text input survey
`survey_dropdown`	Microsurvey	Dropdown selection survey
`response`	Follow-up	A follow-up question shown after the primary survey
`thank_you`	Follow-up	A thank-you message shown after survey completion

Steps without a survey-related preset are standard Tour steps (tooltips, modals, banners, etc.).

Step positioning

`position_type`	Description
`relative_to_screen`	Positioned relative to the viewport (e.g., center of screen, bottom-right).
`snap_to_element`	Anchored next to the `position_element` on the page.
`snap_to_trigger`	Anchored next to the trigger element (the element that caused this step to show).
`inline`	Rendered inline in the DOM near the `position_element`, used by Embeddables.

Example Step JSON (Tour step)

{
  "id": "5f3c4232c712de665632a8f1",
  "created_at": "2029-04-07T12:18:00Z",
  "updated_at": "2029-04-07T12:18:00Z",
  "title": "Welcome to your dashboard",
  "body": "This is where you'll find an overview of your key metrics.",
  "preset": null,
  "step_trigger": "element_match",
  "position_type": "snap_to_element",
  "secondary_trigger": null,
  "trigger_element": {
    "id": "5f3c4232c712de665632a7e1",
    "selector": ".dashboard-header",
    "tag": "div",
    "use": ["attr_class"]
  },
  "position_element": {
    "id": "5f3c4232c712de665632a7e2",
    "selector": ".metrics-panel",
    "tag": "section",
    "use": ["attr_class"]
  },
  "buttons": [
    {
      "id": "5f3c4232c712de665632a9b1",
      "text": "Next",
      "position": "bottom_right",
      "tour_action": "next"
    }
  ],
  "quantifier_urls": [
    {
      "id": "5f3c4232c712de665632aab1",
      "url": "/dashboard",
      "match_type": "simple"
    }
  ]
}

Example Step JSON (Microsurvey step)

{
  "id": "5f3c4232c712de665632a8f2",
  "title": null,
  "body": "How easy was it to complete this task?",
  "preset": "survey_five",
  "step_trigger": "page_load",
  "position_type": "relative_to_screen",
  "buttons": [],
  "quantifier_urls": []
}

Steps in context

Steps appear as embedded objects within Tours, Microsurveys, and Embeddables. They are included when you retrieve an Experience with the appropriate expand parameter. See also:

Tours — contain ordered sequences of Steps
Microsurveys — contain survey-type Steps
Embeddables — contain inline Steps
Elements — define the DOM targets Steps use
Buttons — define the interactive actions within Steps

Getting Started

JavaScript API

Guides

Webhooks

REST API

Schema

Step presets

Step positioning

Example Step JSON (Tour step)

Example Step JSON (Microsurvey step)

Steps in context

​Schema

​Step presets

​Step positioning

​Example Step JSON (Tour step)

​Example Step JSON (Microsurvey step)

​Steps in context

Schema

Step presets

Step positioning

Example Step JSON (Tour step)

Example Step JSON (Microsurvey step)

Steps in context