Supademo Knowledge Base

https://docs.supademo.com
Admin
Supademo's knowledge base helps users learn how to create interactive demos, guides, and tutorials...
Tokens:64,178
Snippets:1,061
Trust Score:9.8
Update:4 months ago
Show doc for...
Tokens:
Raw
### OneLogin SSO Setup

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/enterprise-workspaces/sso-and-saml

This interactive demonstration guides you through the OneLogin SSO setup process. Follow the steps provided in the demo.

```text
{% @supademo/embed demoId="cm3os60xs1h9wahr7a50arwvn" url="<https://app.supademo.com/demo/cm3os60xs1h9wahr7a50arwvn>" %}
```

--------------------------------

### Okta SSO Setup Guide Link

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/enterprise-workspaces/sso-and-saml

Refer to this external guide for the full Okta SSO setup process, including additional configuration steps and screenshots. This link provides comprehensive instructions.

```text
https://boxyhq.com/docs/jackson/sso-providers/okta
```

--------------------------------

### Google SSO Setup

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/enterprise-workspaces/sso-and-saml

Use this interactive demonstration to set up Google SAML configuration. Follow the steps outlined in the demonstration for a guided setup.

```text
{% @supademo/embed demoId="0EeJEzy7vEYYWP9Pk9vfm" url="<https://app.supademo.com/demo/0EeJEzy7vEYYWP9Pk9vfm>" %}
```

--------------------------------

### Example Supademo Embed Configuration

Source: https://docs.supademo.com/customize/personalize/custom-branding/configure-custom-domain

This is an example of how to embed a Supademo with a specific demo ID and URL. It's used here to illustrate the setup process.

```html
{% @supademo/embed demoId="SG12eoxIjL3yJJqBE-0JC" url="<https://app.supademo.com/demo/SG12eoxIjL3yJJqBE-0JC>" %}
```

--------------------------------

### Dynamic Documentation Query Example

Source: https://docs.supademo.com/admin-and-billing/integrations/google-analytics

Perform an HTTP GET request to query documentation dynamically. Replace `<question>` with your specific query.

```bash
GET https://docs.supademo.com/admin-and-billing/integrations/google-analytics.md?ask=<question>
```

--------------------------------

### Supademo:started Event Example

Source: https://docs.supademo.com/share/embed/embed-events-api

Fired when the user first interacts with the demo. The payload contains the demo ID and title.

```javascript
{
  source: "Supademo",
  type: "Supademo:started",
  payload: {
    demoId: "abc123",
    title: "Getting Started Guide"
  }
}
```

--------------------------------

### Dynamic Documentation Query Example

Source: https://docs.supademo.com/customize/personalize/variables-and-tokens/variables-in-embeds

To get more information not directly on the page, make a GET request to the documentation URL with an 'ask' query parameter containing your question.

```http
GET https://docs.supademo.com/customize/personalize/variables-and-tokens/variables-in-embeds.md?ask=<question>
```

--------------------------------

### GET Request to Query Documentation

Source: https://docs.supademo.com/customize/manage-content-and-layout/crop-media

Use this GET request to ask a question about the documentation. Replace `<question>` with your specific query.

```http
GET https://docs.supademo.com/customize/manage-content-and-layout/crop-media.md?ask=<question>
```

--------------------------------

### Query Documentation via HTTP GET

Source: https://docs.supademo.com/customize/personalize/variables-and-tokens

Perform an HTTP GET request on a documentation URL with the `ask` query parameter to dynamically query for information. The question should be specific and self-contained. Use this when the answer is not explicitly present or for clarification.

```http
GET https://docs.supademo.com/customize/personalize/variables-and-tokens.md?ask=<question>
```

--------------------------------

### Query Documentation via HTTP GET

Source: https://docs.supademo.com/create/by-demo-type/guided-html-demos

Perform an HTTP GET request on the current page URL with the `ask` query parameter to query documentation dynamically. The question should be specific and self-contained.

```http
GET https://docs.supademo.com/create/by-demo-type/guided-html-demos.md?ask=<question>
```

--------------------------------

### Query Documentation Dynamically

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/enterprise-workspaces

Use this GET request to ask questions about the documentation. The response includes direct answers and relevant excerpts.

```HTTP
GET https://docs.supademo.com/admin-and-billing/workspace-maintenance/enterprise-workspaces.md?ask=<question>
```

--------------------------------

### Dynamic Documentation Query

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/folders-and-subfolders

To get more information not directly on the page, make an HTTP GET request with an 'ask' query parameter. The question should be specific and in natural language.

```bash
GET https://docs.supademo.com/admin-and-billing/workspace-maintenance/folders-and-subfolders.md?ask=<question>
```

--------------------------------

### Query Support Documentation Dynamically

Source: https://docs.supademo.com/welcome/use-cases/training-and-onboarding/support-documentation

To get more information not directly available on the page, make an HTTP GET request to the page URL with an 'ask' query parameter containing your question.

```HTTP
GET https://docs.supademo.com/welcome/use-cases/training-and-onboarding/support-documentation.md?ask=<question>
```

--------------------------------

### Ask a Question via HTTP GET

Source: https://docs.supademo.com/article/114-unique-link-for-viewers

Perform an HTTP GET request to the documentation index with an 'ask' parameter to get a direct answer to a specific question. The response includes relevant excerpts and sources.

```http
GET https://docs.supademo.com/analyze/track-analytics-by-lead-or-account.md?ask=<question>
```

--------------------------------

### Query Documentation via HTTP GET

Source: https://docs.supademo.com/analyze/general-analytics

To ask a question about the documentation, perform an HTTP GET request to the current page URL and include your question as the value for the 'ask' query parameter. The question should be specific and self-contained.

```http
GET https://docs.supademo.com/analyze/general-analytics.md?ask=<question>
```

--------------------------------

### Query Documentation via HTTP GET

Source: https://docs.supademo.com/admin-and-billing

Use this method to ask specific questions about the documentation. The response includes direct answers and relevant excerpts.

```bash
GET https://docs.supademo.com/admin-and-billing.md?ask=<question>
```

--------------------------------

### Query AI Demo Agent Dynamically

Source: https://docs.supademo.com/ai-demo-agent

Use this GET request to ask questions about the documentation. The question should be specific and in natural language. The response includes the answer and relevant sources.

```http
GET https://docs.supademo.com/ai-demo-agent.md?ask=<question>
```

--------------------------------

### Querying Documentation via HTTP GET

Source: https://docs.supademo.com/admin-and-billing/integrations/zapier

Use this method to ask questions about the documentation dynamically. The response includes direct answers and relevant excerpts.

```HTTP
GET https://docs.supademo.com/admin-and-billing/integrations/zapier.md?ask=<question>
```

--------------------------------

### Query Documentation Dynamically

Source: https://docs.supademo.com/welcome/use-cases/sales-and-enablement/sandboxes-for-live-demos-and-pocs

To get additional information not present on the page, perform an HTTP GET request with the 'ask' query parameter. The question should be specific and in natural language.

```http
GET https://docs.supademo.com/welcome/use-cases/sales-and-enablement/sandboxes-for-live-demos-and-pocs.md?ask=<question>
```

--------------------------------

### Query Documentation with 'ask' Parameter

Source: https://docs.supademo.com/ai-demo-agent/agent-analytics

Use this GET request to ask specific questions about the documentation. The response includes direct answers and relevant excerpts.

```http
GET https://docs.supademo.com/ai-demo-agent/agent-analytics.md?ask=<question>
```

--------------------------------

### Query Documentation Dynamically

Source: https://docs.supademo.com/admin-and-billing/general-security/internal-testing

Use this HTTP GET request to query the documentation dynamically. Replace '<question>' with your specific question.

```http
GET https://docs.supademo.com/admin-and-billing/general-security/internal-testing.md?ask=<question>
```

--------------------------------

### Query Documentation Dynamically

Source: https://docs.supademo.com/admin-and-billing/general-security/chrome-extension-permission-explained

Perform an HTTP GET request to query the documentation with a specific question using the 'ask' query parameter.

```HTTP
GET https://docs.supademo.com/admin-and-billing/general-security/chrome-extension-permission-explained.md?ask=<question>
```

--------------------------------

### Query Documentation via HTTP GET

Source: https://docs.supademo.com/customize/personalize/variables-and-tokens/image-variables-in-html-demos

Perform an HTTP GET request on a documentation URL with an 'ask' query parameter to dynamically query the documentation. The question should be specific and in natural language.

```http
GET https://docs.supademo.com/customize/personalize/variables-and-tokens/image-variables-in-html-demos.md?ask=<question>
```

--------------------------------

### Example `lead.captured` Webhook Payload

Source: https://docs.supademo.com/admin-and-billing/integrations/webhooks

This is an example JSON payload for a `lead.captured` event. It includes details about the lead, the viewer, and UTM parameters.

```json
{
  "event": "lead.captured",
  "workspaceId": "clx...",
  "viewerId": "viewer_abc123",
  "email": "jane@example.com",
  "name": "Jane Smith",
  "company": "Acme Inc",
  "viewer": {
    "id": "viewer_abc123",
    "email": "jane@example.com",
    "first_name": "Jane",
    "last_name": "Smith",
    "company": "Acme Inc",
    "job_title": "Product Manager",
    "custom_fields": {
      "use_case": "Onboarding"
    }
  },
  "entityType": "demo",
  "entityId": "demo_xyz",
  "entityTitle": "Product Tour",
  "entityLink": "https://app.supademo.com/demo/demo_xyz",
  "entityAnalyticsLink": "https://app.supademo.com/demo/demo_xyz?analytics=true",
  "entityViewedAt": "2025-06-01T14:30:00.000Z",
  "utmParams": {
    "utm_source": "linkedin",
    "utm_medium": "social",
    "utm_campaign": "launch",
    "utm_term": null,
    "utm_content": null,
    "gclid": null,
    "fbclid": null,
    "msclkid": null
  },
  "customParams": {},
  "location": {
    "country": "US",
    "city": "San Francisco"
  },
  "device": {
    "browser": "Chrome",
    "os": "macOS"
  }
}
```

--------------------------------

### Query Documentation with AI

Source: https://docs.supademo.com/customize/personalize/ai-text-generation

To get additional information not directly on the page, perform an HTTP GET request with the 'ask' query parameter. The question should be specific and in natural language.

```HTTP
GET https://docs.supademo.com/customize/personalize/ai-text-generation.md?ask=<question>
```

--------------------------------

### Query Documentation via HTTP GET

Source: https://docs.supademo.com/ai-demo-agent/agent-training

Perform an HTTP GET request on the current page URL with the 'ask' query parameter to query the documentation dynamically. The question should be specific and in natural language. Use this when the answer is not explicitly present, needs clarification, or requires related documentation.

```http
GET https://docs.supademo.com/ai-demo-agent/agent-training.md?ask=<question>
```

--------------------------------

### Querying Documentation with AI

Source: https://docs.supademo.com/customize/edit-html/ai-data-editing

To get information not directly on the page, make an HTTP GET request to the page URL with an 'ask' query parameter containing your question.

```HTTP
GET https://docs.supademo.com/customize/edit-html/ai-data-editing.md?ask=<question>
```

--------------------------------

### Query Documentation with 'ask' Parameter

Source: https://docs.supademo.com/welcome/use-cases/sales-and-enablement/sales-leave-behind

To get specific information not directly on the page, make an HTTP GET request to the current URL with the 'ask' query parameter. This allows for dynamic querying of the documentation.

```HTTP
GET https://docs.supademo.com/welcome/use-cases/sales-and-enablement/sales-leave-behind.md?ask=<question>
```

--------------------------------

### Query Documentation via HTTP GET

Source: https://docs.supademo.com/welcome/use-cases/marketing-and-growth/website-demos

Make an HTTP GET request to the current page URL with the 'ask' query parameter to ask a question. The question should be specific and in natural language. Use this when the answer is not explicitly present or for clarification.

```http
GET https://docs.supademo.com/welcome/use-cases/marketing-and-growth/website-demos.md?ask=<question>
```

--------------------------------

### Querying Documentation Dynamically

Source: https://docs.supademo.com/customize/voiceovers/instant-ai-voice-clone

To get additional information not directly present on a page, perform an HTTP GET request with the 'ask' query parameter. The question should be specific and in natural language.

```HTTP
GET https://docs.supademo.com/customize/voiceovers/instant-ai-voice-clone.md?ask=<question>
```

--------------------------------

### Example Supademo Event Payload

Source: https://docs.supademo.com/share/exports/export-to-scorm

This is an example of the JSON payload structure emitted by Supademo for event tracking, specifically for progress updates.

```json
{
  "source": "Supademo",
  "type": "Supademo:progress",
  "demoId": "cmp33sl3904h9gh7abylz7nl0",
  "currentSlide": 3,
  "totalSlides": 5,
  "percentage": 60
}
```

--------------------------------

### Query Documentation Dynamically

Source: https://docs.supademo.com/ai-demo-agent/getting-started

To get information not explicitly present on the page, make an HTTP GET request to the page URL with an 'ask' query parameter. This is useful for clarifications or retrieving related documentation sections.

```HTTP
GET https://docs.supademo.com/ai-demo-agent/getting-started.md?ask=<question>
```

--------------------------------

### Open Demo Hub to Specific Category

Source: https://docs.supademo.com/share/multi-demo-sharing/demo-hub

This example demonstrates how to open the Demo Hub and specifically display the second category by default. Adjust the index to open to other categories.

```javascript
// Opens Demo Hub to the 2nd category
Supademo.widget.open('your-widget-id', { defaultCategoryIndex: 2 });
```

--------------------------------

### Query Documentation with 'ask' Parameter

Source: https://docs.supademo.com/article/45-demo-chapters

Perform an HTTP GET request to query the documentation index. Use the 'ask' parameter with a specific, self-contained question in natural language to get a direct answer and relevant excerpts.

```HTTP
GET https://docs.supademo.com/create/by-demo-type.md?ask=<question>
```

--------------------------------

### Query Documentation Dynamically

Source: https://docs.supademo.com/admin-and-billing/integrations/hubspot

Perform an HTTP GET request to query the documentation dynamically. Use the 'ask' query parameter with a specific, self-contained question in natural language to get a direct answer and relevant excerpts.

```http
GET https://docs.supademo.com/admin-and-billing/integrations/hubspot.md?ask=<question>
```

--------------------------------

### Query Marketo Documentation

Source: https://docs.supademo.com/admin-and-billing/integrations/marketo

To get more information not present on the page, make an HTTP GET request to the current page URL with the 'ask' query parameter. The question should be specific and in natural language.

```bash
GET https://docs.supademo.com/admin-and-billing/integrations/marketo.md?ask=<question>
```

--------------------------------

### Querying Documentation with 'ask' Parameter

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/workspace-and-team-management/roles-and-permissions

To get more information not directly present on a page, perform an HTTP GET request with the 'ask' query parameter. The question should be specific and in natural language.

```HTTP
GET https://docs.supademo.com/admin-and-billing/workspace-maintenance/workspace-and-team-management/roles-and-permissions.md?ask=<question>
```

--------------------------------

### Query Documentation via API

Source: https://docs.supademo.com/admin-and-billing/integrations/data-and-api

To get information not explicitly present on a page, perform an HTTP GET request with the 'ask' query parameter. The question should be specific and in natural language.

```http
GET https://docs.supademo.com/admin-and-billing/integrations/data-and-api.md?ask=<question>
```

--------------------------------

### Query Documentation with a Question

Source: https://docs.supademo.com/article/58-email-lead-capture

Use this GET request to query the documentation index with a specific question. The response includes direct answers and relevant excerpts.

```http
GET https://docs.supademo.com/customize/chapters/forms-and-lead-capture.md?ask=<question>
```

--------------------------------

### Embed Guided HTML Demo

Source: https://docs.supademo.com/create/by-demo-type

Embed a Guided HTML demo using its demo ID and URL. This type offers pixel-perfect interactivity and editable content.

```html
{% @supademo/embed demoId="cm7l1pg5n13amddum3mis0ppr" url="<https://app.supademo.com/demo/cm7l1pg5n13amddum3mis0ppr>" %}
```

--------------------------------

### Querying Documentation with AI Audit

Source: https://docs.supademo.com/customize/manage-content-and-layout/ai-audit

To get more information not directly on the page, make an HTTP GET request to the current page URL with an 'ask' query parameter containing your question.

```http
GET https://docs.supademo.com/customize/manage-content-and-layout/ai-audit.md?ask=<question>
```

--------------------------------

### Query Documentation Dynamically

Source: https://docs.supademo.com/share/exports/export-to-pdf-or-png

To get additional information not present on the page, perform an HTTP GET request to the current page URL with the 'ask' query parameter. The question should be specific and in natural language.

```http
GET https://docs.supademo.com/share/exports/export-to-pdf-or-png.md?ask=<question>
```

--------------------------------

### Query Documentation via HTTP GET

Source: https://docs.supademo.com/customize

Use this method to ask questions about the documentation when information is not directly available. The question should be specific and in natural language.

```http
GET https://docs.supademo.com/customize.md?ask=<question>
```

--------------------------------

### Query Documentation via HTTP GET

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/workspace-and-team-management/move-or-transfer-demos-between-workspaces

Use this endpoint to dynamically query the documentation. Append your question as the 'ask' query parameter to the base URL. The response will provide a direct answer and relevant excerpts.

```http
GET https://docs.supademo.com/admin-and-billing/workspace-maintenance/workspace-and-team-management/move-or-transfer-demos-between-workspaces.md?ask=<question>
```

--------------------------------

### Query Documentation with 'ask' Parameter

Source: https://docs.supademo.com/article/158-smart-blur-and-auto-redaction

Perform an HTTP GET request to query the documentation index with a specific question. The response includes a direct answer and relevant excerpts.

```HTTP
GET https://docs.supademo.com/customize/blur-and-annotate.md?ask=<question>
```

--------------------------------

### Query Documentation with 'ask' Parameter

Source: https://docs.supademo.com/admin-and-billing/billing-and-payments/access-invoices

To get additional information not directly present on a page, make an HTTP GET request to the page URL with the 'ask' query parameter. The question should be specific and in natural language.

```HTTP
GET https://docs.supademo.com/admin-and-billing/billing-and-payments/access-invoices.md?ask=<question>
```

--------------------------------

### Ask a Question via HTTP GET

Source: https://docs.supademo.com/article/205-in-app-screen-recorder

Use this method to query the documentation index for specific information. Append your question to the URL as the 'ask' parameter.

```http
GET https://docs.supademo.com/create/by-demo-type/screen-and-camera-recording.md?ask=<question>
```

--------------------------------

### Query Documentation with 'ask' Parameter

Source: https://docs.supademo.com/welcome/learning-academy

Perform an HTTP GET request to query the documentation dynamically. Use this when the answer is not explicitly present on the page, requires clarification, or you want to retrieve related sections.

```http
GET https://docs.supademo.com/welcome/learning-academy.md?ask=<question>
```

--------------------------------

### Query Supademo Documentation with 'ask' parameter

Source: https://docs.supademo.com/create/by-demo-type/guided-screenshot-and-video-demos/smart-blur

Perform an HTTP GET request to the documentation URL with the 'ask' query parameter to dynamically query for information not explicitly present on the page.

```http
GET https://docs.supademo.com/create/by-demo-type/guided-screenshot-and-video-demos/smart-blur.md?ask=<question>
```

--------------------------------

### Supademo:close Event Example

Source: https://docs.supademo.com/share/embed/embed-events-api

Fired when the user presses the ESC key while viewing the demo. This event has no payload.

```javascript
{
  source: "Supademo",
  type: "Supademo:close"
}
```

--------------------------------

### Supademo:load Event Example

Source: https://docs.supademo.com/share/embed/embed-events-api

This event is fired when the demo initially loads in the iframe. The payload includes the demo ID, title, and total number of slides.

```javascript
{
  source: "Supademo",
  type: "Supademo:load",
  payload: {
    demoId: "abc123",
    title: "Getting Started Guide",
    totalSlides: 5
  }
}
```

--------------------------------

### Querying Documentation via HTTP GET

Source: https://docs.supademo.com/admin-and-billing/general-security

Use this method to dynamically query documentation when information is not directly available on the page. The question should be specific and self-contained.

```http
GET https://docs.supademo.com/admin-and-billing/general-security.md?ask=<question>
```

--------------------------------

### Supademo:progress Event Example

Source: https://docs.supademo.com/share/embed/embed-events-api

Fired alongside slideChange to provide a completion percentage. Useful for building progress bars. The payload includes demo ID, percentage, current slide, and total slides.

```javascript
{
  source: "Supademo",
  type: "Supademo:progress",
  payload: {
    demoId: "abc123",
    percentage: 60,  // Slide 3 of 5 = 60%
    currentSlide: 3,
    totalSlides: 5
  }
}
```

--------------------------------

### GET /api/integration/zapier/me

Source: https://docs.supademo.com/admin-and-billing/integrations/data-and-api/developer-docs

Verifies the API key and fetches basic information about the associated workspace. Returns the workspace name if the API key is valid.

```APIDOC
## GET /api/integration/zapier/me

### Description
Verifies the API key and fetches basic information about the associated workspace. Returns the workspace name if the API key is valid.

### Method
GET

### Endpoint
/api/integration/zapier/me

### Parameters
#### Headers
- **Authorization** (string, required) - A bearer token containing the user's API key.

### Request Example
GET `/api/integration/zapier/me`
Authorization Header: `Authorization: Bearer YOUR_API_KEY`

### Response
#### Success Response (Authorized)
- **Status**: `200 OK`
- **Response Body**: `{
  "name": "My Workspace",
  "message": "Authorized"
}`

#### Error Responses
- **Status**: `401 Unauthorized`
- **Description**: The provided API key is either missing or invalid.
- **Response Body**: `{
  "message": "Unauthorized"
}`
```

--------------------------------

### Configure Root Domain Redirect

Source: https://docs.supademo.com/customize/personalize/custom-branding/configure-custom-domain

This example shows how to configure a redirect for the root domain. It's recommended to set this to your main Supademo URL, Showcase URL, or website to avoid redirecting users to app.supademo.com.

```html
{% @supademo/embed demoId="cm48rpj5510fj5ewa50us01p3" url="<https://app.supademo.com/demo/cm48rpj5510fj5ewa50us01p3>" %}
```

--------------------------------

### Export Supademo to PDF or PNG

Source: https://docs.supademo.com/share/exports/export-to-pdf-or-png

This is an example of how to embed a Supademo. The export functionality is available within the 'Share' menu of any Supademo.

```html
{% @supademo/embed demoId="cmae52wg20da44s1bchby5e00" url="<https://app.supademo.com/demo/cmae52wg20da44s1bchby5e00>" %}
```

--------------------------------

### Supademo:completed Event Example

Source: https://docs.supademo.com/share/embed/embed-events-api

Fired when the user reaches the final slide of the demo. The payload includes the demo ID, title, and a completion timestamp.

```javascript
{
  source: "Supademo",
  type: "Supademo:completed",
  payload: {
    demoId: "abc123",
    title: "Getting Started Guide",
    completedAt: "2025-01-15T10:30:00.000Z"
  }
}
```

--------------------------------

### Get Sample Data for Zapier

Source: https://docs.supademo.com/admin-and-billing/integrations/data-and-api/developer-docs

Fetches sample data related to specific Zapier triggers based on the provided trigger name.

```APIDOC
## GET /api/integration/zapier/connect

### Description
This API endpoint fetches data related to specific Zapier triggers. The response contains sample data depending on the provided trigger name.

### Method
GET

### Endpoint
/api/integration/zapier/connect

### Parameters
#### Query Parameters
- **trigger** (string, required) - The name of the trigger for which sample data is requested. (e.g., `new-lead`, `demo-view`)

### Response
(Response details for sample data are not explicitly provided in the source text, but would typically include a JSON object with sample data relevant to the specified trigger.)
```

--------------------------------

### Get Authentication Information - Success Response

Source: https://docs.supademo.com/admin-and-billing/integrations/data-and-api/developer-docs

This JSON is returned upon successful authorization, verifying the API key and providing workspace information.

```json
{
  "name": "My Workspace",
  "message": "Authorized"
}
```

--------------------------------

### GET /api/integration/zapier/connect

Source: https://docs.supademo.com/admin-and-billing/integrations/data-and-api/developer-docs

Fetches data based on a specified trigger. Supports 'new-lead' and 'demo-view' triggers, returning different data structures for each.

```APIDOC
## GET /api/integration/zapier/connect

### Description
Fetches data based on a specified trigger. Supports 'new-lead' and 'demo-view' triggers, returning different data structures for each.

### Method
GET

### Endpoint
/api/integration/zapier/connect

### Parameters
#### Query Parameters
- **trigger** (string, required) - The name of the trigger for which the data is being requested. Available triggers: `new-lead` (fetches data for new lead entries), `demo-view` (fetches data for demo view events).

### Request Example
GET `/api/integration/zapier/connect?trigger=new-lead`

### Response
#### Success Response (New Lead Trigger)
- **Status**: `200 OK`
- **Response Body**: `[
  {
    "email": "team@supademo.com"
  }
]`

#### Success Response (Demo View Trigger)
- **Status**: `200 OK`
- **Response Body**: `[
  {
    "name": "Jack Doe",
    "email": "team@supademo.com",
    "company": "Supademo",
    "demoTitle": "New Demo",
    "demoLink": "https://app.supademo.com/demo/123",
    "demoViewedAt": "2021-09-01T12:00:00Z"
  }
]`

#### Error Responses
- **Status**: `400 Bad Request`
- **Description**: The `trigger` query parameter is missing from the request.
- **Response Body**: `{
  "message": "Bad Request: trigger"
}`
```

--------------------------------

### Generate Supademo API Key

Source: https://docs.supademo.com/admin-and-billing/integrations/data-and-api

This is an example of a generated API key. Keep your API key secure and avoid sharing it publicly.

```text
API Key: 1a3c542871619640ak234k4gu2427be8bdd5630e909d46a5ffb9bfe
```

--------------------------------

### Supademo:slideChange Event Example

Source: https://docs.supademo.com/share/embed/embed-events-api

Fired when the user navigates to a different slide. The payload includes demo identification, current slide, total slides, and flags for first/last slide.

```javascript
{
  source: "Supademo",
  type: "Supademo:slideChange",
  payload: {
    demoId: "abc123",
    currentSlide: 3,
    totalSlides: 5,
    isFirstSlide: false,
    isLastSlide: false
  }
}
```

--------------------------------

### Track Demo Engagement Events

Source: https://docs.supademo.com/share/embed/embed-events-api

Listen for 'Supademo:started' and 'Supademo:completed' events to track user engagement with embedded demos. Ensure the analytics object is properly configured.

```javascript
window.addEventListener('message', (event) => {
  if (event.data?.source !== 'Supademo') return;

  const { type, payload } = event.data;

  switch (type) {
    case 'Supademo:started':
      analytics.track('Demo Started', { demoId: payload.demoId });
      break;
    case 'Supademo:completed':
      analytics.track('Demo Completed', { demoId: payload.demoId });
      break;
  }
});
```

--------------------------------

### Embed a Guided Screenshot/Video Demo

Source: https://docs.supademo.com/create/by-demo-type/guided-screenshot-and-video-demos

Use this embed code to display an interactive Supademo directly on your webpage. Ensure you replace the demoId and url with your specific demo's details.

```html
{% @supademo/embed demoId="cSA86m_MPHGSi1J8fv8oe" url="<https://app.supademo.com/demo/cSA86m_MPHGSi1J8fv8oe>" %}
```

--------------------------------

### Enable Smart Blur in Supademo Chrome Extension

Source: https://docs.supademo.com/create/by-demo-type/guided-screenshot-and-video-demos/smart-blur

Toggle on 'Smart Blur' in the Supademo Chrome Extension before starting a recording to automatically redact sensitive information.

```text
To enable Smart Blur, open the **Supademo Chrome Extension** and toggle on **“Smart Blur”** before starting your recording. Once enabled, Smart Blur will automatically detect and blur common patterns like emails, numbers, and currency values during the capture process.
```

--------------------------------

### Microsoft/Azure SSO Configuration Details

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/enterprise-workspaces/sso-and-saml

Copy and paste these details into the appropriate fields when prompted for Microsoft/Azure SSO setup. Ensure accurate entry of ACS URL and Entity ID.

```text
ACS URL: [https://sso.supademo.com/api/oauth/saml](https://mailtrack.io/trace/link/c932f8802bc374b1fc626ced373109c6397a782d?notrack=1\&url=https%3A%2F%2Fsso.supademo.com%2Fapi%2Foauth%2Fsaml\&userId=9145471\&signature=12ec89f7f921570b)
Entity ID: [https://sso.supademo.com](https://mailtrack.io/trace/link/3207501b7e4eb256cd0670de70a942a5c74f5742?notrack=1\&url=https%3A%2F%2Fsso.supademo.com\&userId=9145471\&signature=2ca6b5561b5c8982)
```

--------------------------------

### Typewriter Effect Demo

Source: https://docs.supademo.com/customize/edit-html/typewriter-and-input-rules

Embeds a demo showcasing the Typewriter Effect. This feature automatically types text into input fields, useful for guiding viewers through forms.

```html
{% @supademo/embed demoId="cmk456mf552e0gmn81bvnj7y2" url="<https://app.supademo.com/demo/cmk456mf552e0gmn81bvnj7y2>" %}
```

--------------------------------

### Demonstration of Workspace and Team Management

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/workspace-and-team-management/transfer-licenses-or-change-roles

A Supademo embed showcasing workspace and team management functionalities.

```supademo
{% @supademo/embed demoId="cm05fj14u09a9128vi4f7c274" url="<https://app.supademo.com/demo/cm05fj14u09a9128vi4f7c274>" %}
```

--------------------------------

### Open a Demo with a Button

Source: https://docs.supademo.com/share/embed/popup-embed

Create a button that triggers the Supademo.open() function with your Demo ID to display it in a popup.

```html
<button onclick="Supademo.open('YOUR_DEMO_ID')">
  Take a tour
</button>
```

--------------------------------

### Initialize Supademo SDK with Variables

Source: https://docs.supademo.com/share/embed/in-app-product-tours-legacy

Initialize the Supademo SDK with your API key and custom variables. This is necessary for dynamic elements, especially in frameworks like React, Angular, Vue, and Svelte.

```html
Supademo("YOUR_API_KEY", {
  variables: { email: "", name: "", custom_variable: "" }
});
```

```javascript
useEffect(() => {
  Supademo("YOUR_API_KEY", {
    variables: { email: "", name: "", custom_variable: "" }
  });
}, []);
```

```javascript
ngAfterViewInit() {
  //@ts-ignore
  Supademo("YOUR_API_KEY", {
    variables: { email: "", name: "", custom_variable: "" }
  });
}
```

```javascript
mounted() {
  Supademo("YOUR_API_KEY", {
    variables: { email: "", name: "", custom_variable: "" }
  });
}
```

```javascript
onMount(() => {
  Supademo("YOUR_API_KEY", {
    variables: { email: "", name: "", custom_variable: "" }
  });
});
```

--------------------------------

### Querying Documentation Dynamically

Source: https://docs.supademo.com/customize/personalize/custom-branding/workspace-theme

Use this method to ask questions about the documentation. The response will provide direct answers and relevant excerpts.

```HTTP
GET https://docs.supademo.com/customize/personalize/custom-branding/workspace-theme.md?ask=<question>
```

--------------------------------

### Open a Showcase with a Button

Source: https://docs.supademo.com/share/embed/popup-embed

Use the type option in Supademo.open() to open a Showcase instead of a Demo, providing the Showcase ID.

```html
<button onclick="Supademo.open('YOUR_SHOWCASE_ID', { type: 'showcase' })">
  Take a tour
</button>
```

--------------------------------

### Query Documentation Dynamically

Source: https://docs.supademo.com/analyze

Use this method to ask specific questions about the documentation. The response includes a direct answer and relevant excerpts.

```HTTP
GET https://docs.supademo.com/analyze.md?ask=<question>
```

--------------------------------

### Request a Personalized Demo

Source: https://docs.supademo.com/admin-and-billing/growth-plan

Use this link to schedule a personalized demo session. This session can help you understand Supademo plans, features, and refine your demo content.

```HTML
<a href="https://supademo.com/product-demo" class="button primary">Request a personalized demo</a>
```

--------------------------------

### Transfer License Between Users

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/workspace-and-team-management/transfer-licenses-or-change-roles

Demonstrates the process of reassigning a license from one user to another within the workspace.

```supademo
{% @supademo/embed demoId="cm05fmc1609cm128vlnhd47km" url="<https://app.supademo.com/demo/cm05fmc1609cm128vlnhd47km>" %}
```

--------------------------------

### Initialize Demo Hub Widget

Source: https://docs.supademo.com/share/multi-demo-sharing/demo-hub

Initialize the Demo Hub widget after your single-page application loads. Replace 'your-widget-id' with your actual widget ID.

```javascript
Supademo.widget.init("your-widget-id");
```

--------------------------------

### Upgrade to Growth Plan

Source: https://docs.supademo.com/admin-and-billing/growth-plan

Use this link to upgrade to the Supademo Growth Plan. This plan allows for mixing and matching all three types of interactive demos.

```HTML
<a href="https://app.supademo.com/upgrade?from=html" class="button primary">Upgrade to Growth Plan</a>
```

--------------------------------

### Constructing a Personalized Trackable Link

Source: https://docs.supademo.com/customize/personalize/variables-and-tokens

Append variables as UTM parameters to your Supademo URL. Replace placeholder values manually or programmatically for personalization.

```url
https://app.supademo.com/demo/id?v_name=NAME&v_role=ROLE&v_email=EMAIL
```

--------------------------------

### Set Demo Language via URL Parameter

Source: https://docs.supademo.com/customize/personalize/translations

To make a demo open automatically in a specific language, append the `?lang=` parameter to the demo's URL, followed by the desired language code.

```html
?lang=French
```

--------------------------------

### Open Demo Hub Programmatically

Source: https://docs.supademo.com/share/multi-demo-sharing/demo-hub

Use this function to open the Demo Hub if the launcher is disabled. The 'defaultCategoryIndex' parameter controls which category is shown first (1-based index).

```javascript
// Open Demo Hub
Supademo.widget.open('your-widget-id', { defaultCategoryIndex: 1 });

// Close Demo Hub
Supademo.widget.hide();
```

--------------------------------

### Dynamic Documentation Query

Source: https://docs.supademo.com/customize/edit-html

Use this method to retrieve information not explicitly stated on the current page, seek clarification, or find related documentation sections. The question should be specific and self-contained.

```http
GET https://docs.supademo.com/customize/edit-html.md?ask=<question>
```

--------------------------------

### Add Supademo MCP to Claude Code

Source: https://docs.supademo.com/customize/mcp-server

Configure Supademo MCP for Claude Code using the command line. Use `--scope user` for project-wide access.

```bash
claude mcp add --transport http supademo https://mcp.supademo.com/mcp

```

--------------------------------

### Embed Demo with Zoom and Pan

Source: https://docs.supademo.com/customize/animation/zoom-and-pan

Use the Supademo embed component to include a demo with zoom and pan effects. This is the standard way to add interactive demos to your content.

```html
{% @supademo/embed demoId="_WnwM2vU48rXuSkS8v07R" url="<https://app.supademo.com/demo/_WnwM2vU48rXuSkS8v07R>" %}
```

--------------------------------

### Link to Specific Supademo in Showcase

Source: https://docs.supademo.com/share/share-link

Add '?demo=#' to your showcase share link to direct viewers to a specific Supademo within the showcase. The '#' represents the position of the Supademo.

```html
https://app.supademo.com/showcase/clyf3mxh401f4qtmonws8onax?demo=3
```

--------------------------------

### Configure Supademo MCP in Cursor Settings

Source: https://docs.supademo.com/customize/mcp-server

Add Supademo MCP server details to Cursor's configuration file. This enables Supademo tools within the Cursor IDE.

```javascript
{
  "mcpServers": {
    "Supademo MCP": {
      "url": "https://mcp.supademo.com/mcp"
    }
  }
}

```

--------------------------------

### Dynamically Generate Tracking Links

Source: https://docs.supademo.com/share/share-link/trackable-share-links

Use this embed to demonstrate the dynamic generation of tracking links.

```html
{% @supademo/embed demoId="cm1b74hdo17j8ououhf6c402n" url="<https://app.supademo.com/demo/cm1b74hdo17j8ououhf6c402n>" %}
```

--------------------------------

### Add Supademo SDK Script

Source: https://docs.supademo.com/share/embed/popup-embed

Include this script tag in your website's head or body to load the Supademo SDK.

```html
<script src="https://script.supademo.com/supademo.js"></script>
```

--------------------------------

### Embed Supademo in Intercom Help Articles

Source: https://docs.supademo.com/admin-and-billing/integrations/intercom

Paste the Supademo link into the Intercom article editor. The interactive demo will appear directly within the help center.

```markdown
{% @supademo/embed demoId="cme749fgv2j24h3py0w4nwwox" url="<https://app.supademo.com/demo/cme749fgv2j24h3py0w4nwwox>" %}
```

--------------------------------

### Okta SSO Configuration Details

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/enterprise-workspaces/sso-and-saml

Use these details for setting up Supademo SSO in Okta. Ensure the Single sign-on URL (ACS URL) and Audience URI (SP Entity ID) are correctly entered.

```text
Single sign-on URL (ACS URL):
[https://sso.supademo.com/api/oauth/saml](https://l.gourl.es/l/841760eb895713ced209ee75d3fcf7fadc1fb767?url=https%3A%2F%2Fsso.supademo.com%2Fapi%2Foauth%2Fsaml&u=9145471&signature=f427150b32be65e6)
Audience URI (SP Entity ID):
[https://sso.supademo.com](https://l.gourl.es/l/71c253413b5f9ba4cb111967bbf08c0b63fe8b82?url=https%3A%2F%2Fsso.supademo.com&u=9145471&signature=304c0408619d694a)
```

--------------------------------

### Programmatically Trigger Showcase

Source: https://docs.supademo.com/share/embed/in-app-product-tours-legacy

Use JavaScript to programmatically load and display a Showcase using its ID.

```javascript
Supademo("YOUR_API_KEY").loadShowcase("YOUR_SHOWCASE_ID");
```

--------------------------------

### Enable Autoplay for Showcase

Source: https://docs.supademo.com/customize/animation/autoplay-and-loop

Configure autoplay settings for a Showcase collection, including turning it on/off and setting slide durations. This is done via the 'Settings' tab in the edit view.

```text
{% @supademo/embed demoId="cmde3jtk50j2d6n9n82j70dlq" url="<https://app.supademo.com/demo/cmde3jtk50j2d6n9n82j70dlq>" %}
```

--------------------------------

### Embed Supademo with URL Parameters

Source: https://docs.supademo.com/customize/personalize/variables-and-tokens/variables-in-showcases

Embed a Supademo and use URL parameters to personalize it. Variables within the Showcase can be set by adding them to the Showcase's URL parameter.

```html
{% @supademo/embed demoId="cm0r3x8g10dyyk62w9p5sdfm6" url="<https://app.supademo.com/demo/cm0r3x8g10dyyk62w9p5sdfm6>" %}
```

--------------------------------

### Embed Supademo with Step Descriptions

Source: https://docs.supademo.com/share/share-link

This component embeds a Supademo and enables the display of step-by-step text descriptions below the demo on the share page. Descriptions default to the meta description and hotspot text.

```html
{% @supademo/embed demoId="cmfco1paw7vyu39ozt2kflm47" url="<https://app.supademo.com/demo/cmfco1paw7vyu39ozt2kflm47>" %}
```

--------------------------------

### Personalize Demo Images with Variables

Source: https://docs.supademo.com/customize/personalize/variables-and-tokens/image-variables-in-html-demos

Add variables to HTML/Sandbox demo URLs to personalize images within the demo. Use the "{}" icon in the HTML edit toolbar to add variable names. Personalized links can be created by uploading variables or providing a public image URL in the demo URL parameter.

```html
{% hint style="success" %}
Adding a variable to the HTML/Sandbox demo's URL parameter will personalize every image that uses that variable name  (i.e. {{logo}} or {{graph}}) within the demo

Simply add variables by clicking on the "{}"  icon from the HTML edit toolbar and adding a variable name. You can then create a Personalized Link and upload your variables or add publicly available URL of the image in the demo URL parameter.
{% endhint %}
```

--------------------------------

### Input Rules Demo

Source: https://docs.supademo.com/customize/edit-html/typewriter-and-input-rules

Embeds a demo illustrating Input Rules. This feature pauses the demo until the viewer types specific text, ensuring active participation and reinforcing learning.

```html
{% @supademo/embed demoId="cmk45nxfy53cggmn89segr9b0" url="<https://app.supademo.com/demo/cmk45nxfy53cggmn89segr9b0>" %}
```

--------------------------------

### Connect Zapier Integration (POST)

Source: https://docs.supademo.com/admin-and-billing/integrations/data-and-api/developer-docs

Use this endpoint to connect a Zapier integration to a workspace. It requires a trigger name and a Zapier webhook URL. Ensure your workspace has the necessary subscription plan and provide a valid API key for authorization.

```http
POST /api/integration/zapier/connect?trigger=NewLead
```

```json
{
  "url": "https://hooks.zapier.com/hooks/catch/1234567/abcde"
}
```

```http
Authorization: Bearer YOUR_API_KEY
```

--------------------------------

### Enable Autoplay for Supademo

Source: https://docs.supademo.com/customize/animation/autoplay-and-loop

Configure autoplay settings for a Supademo, including turning it on/off, setting slide durations (uniform or custom), and enabling looping. This is done via the 'Customization' tab in the edit view.

```text
{% @supademo/embed demoId="cmelneg24169mv9kq0f8jirqi" url="<https://app.supademo.com/demo/cmelneg24169mv9kq0f8jirqi>" %}
```

--------------------------------

### Many Viewers Embed URL with Variables

Source: https://docs.supademo.com/customize/personalize/variables-and-tokens/variables-in-embeds

Embed a Supademo personalized for multiple viewers by appending URL parameters for variables. Replace 'NAME' and 'COMPANY' with actual values.

```html
https://app.supademo.com/embed/yourdemoID?v_name=NAME&v_company=COMPANY
```

--------------------------------

### Embed Multi-Demo Showcase

Source: https://docs.supademo.com/share/embed

Embed a multi-demo Showcase by providing its demo ID and URL to the embed component.

```html
<div data-supademo-embed data-demo-id="YKi9xK7JGnvaBj5DCANwD" data-url="<https://app.supademo.com/demo/YKi9xK7JGnvaBj5DCANwD>"></div>
```

--------------------------------

### Link to Specific Slide in Supademo

Source: https://docs.supademo.com/share/share-link

Append '?step=#' to your Supademo share link to direct viewers to a specific step. The URL updates dynamically as you navigate through the demo.

```html
https://app.supademo.com/demo/clikm22sy25xdzgceg9f8pkte?step=4
```

--------------------------------

### Using Dynamic Variables in Text

Source: https://docs.supademo.com/customize/personalize/variables-and-tokens

Wrap text in double curly brackets to make it dynamic. These variables can be populated when sharing the demo.

```text
{{role}}
```

--------------------------------

### Embed HTML Demo

Source: https://docs.supademo.com/share/embed

Embed an HTML demo by specifying the demo ID and URL in the data attributes.

```html
<div data-supademo-embed data-demo-id="cmaccvf1u02vpxt0ifnax9n0s" data-url="<https://app.supademo.com/demo/cmaccvf1u02vpxt0ifnax9n0s>"></div>
```

--------------------------------

### Subscribe to Zapier

Source: https://docs.supademo.com/admin-and-billing/integrations/data-and-api/developer-docs

Connects a Zapier integration to a workspace, allowing triggers to be set. Validates API key and workspace subscription plan. Updates existing integration or creates a new one.

```APIDOC
## POST /api/integration/zapier/connect

### Description
This API endpoint connects a Zapier integration to a workspace, allowing triggers to be set for the integration. The endpoint validates the user’s API key and checks the workspace’s subscription plan before processing the request. If the integration already exists, it updates the trigger configuration; otherwise, it creates a new integration.

### Method
POST

### Endpoint
/api/integration/zapier/connect

### Parameters
#### Query Parameters
- **trigger** (string, required) - The name of the trigger for which the data is being requested. The available trigger names are: `new-lead` (Fetches data for new lead entries), `demo-view` (Fetches data for demo view events).
#### Headers
- **Authorization** (string, required) - A bearer token containing the workspace API key. Example: `Authorization: Bearer <API_KEY>`
#### Request Body
- **url** (string, required) - The URL that should be associated with the trigger. This is typically the Zapier webhook URL.

### Request Example
POST `/api/integration/zapier/connect?trigger=NewLead`
```json
{
  "url": "https://hooks.zapier.com/hooks/catch/1234567/abcde"
}
```
Authorization Header:
```
Authorization: Bearer YOUR_API_KEY
```

### Response
#### Success Response (201 Created)
- **integrationId** (string) - The ID of the newly created Zapier integration.
#### Response Example
```json
{
  "integrationId": "new-integration-id"
}
```
#### Error Responses
- **401 Unauthorized**: The provided API key is invalid, the workspace does not have permission, or the plan does not allow this action.
- **400 Bad Request**: The request body is missing the required `url` field or query parameters are missing the `trigger` field.
- **500 Internal Server Error**: An error occurred while processing the integration.
```

--------------------------------

### Embed a Supademo Demo

Source: https://docs.supademo.com/admin-and-billing/workspace-maintenance/tagging-supademo-and-showcases

Use this embed code to display a Supademo demo directly within your content. Ensure you have the correct demo ID and URL.

```html
{% @supademo/embed demoId="cmkvfu9t72ybt12hhdmdaz734" url="<https://app.supademo.com/demo/cmkvfu9t72ybt12hhdmdaz734>" %}
```

--------------------------------

### Format Text with Dynamic Variables

Source: https://docs.supademo.com/customize/chapters

Customize chapter heading and description text, including colors and dynamic variables, by clicking on the text element. Dynamic variables personalize content automatically.

```markdown
Click any text element to format it, adjust colors, and add dynamic variables using `{{variable_name}}` syntax.
```

--------------------------------

### Embed Supademo as a Link

Source: https://docs.supademo.com/share/share-link

Use this component to generate a shareable link for your Supademo. It displays the demo in a box card format by default.

```html
{% @supademo/embed demoId="clikm22sy25xdzgceg9f8pkte" url="<https://app.supademo.com/demo/clikm22sy25xdzgceg9f8pkte>" %}
```

--------------------------------

### Embed Mobile Demo (Video Uploads)

Source: https://docs.supademo.com/create/by-demo-type/create-mobile-demo

Embed a mobile demo created using video uploads and splitting functionality. Verify the demoId and url match your uploaded content.

```html
{% @supademo/embed demoId="clxatgah20ltwt2oe9v54my5b" url="<https://app.supademo.com/demo/clxatgah20ltwt2oe9v54my5b>" %}
```

--------------------------------

### Programmatically Trigger Supademo

Source: https://docs.supademo.com/share/embed/in-app-product-tours-legacy

Use JavaScript to programmatically load and display a Supademo using its ID.

```javascript
Supademo("YOUR_API_KEY").loadDemo("YOUR_DEMO_ID");
```

--------------------------------

### Embed Individual Supademo

Source: https://docs.supademo.com/share/embed

Use this component to embed a single Supademo. Provide the demo ID and URL.

```html
<div data-supademo-embed data-demo-id="zyz1rJMWCv8WsxNLX69kp" data-url="<https://app.supademo.com/demo/zyz1rJMWCv8WsxNLX69kp>"></div>
```

--------------------------------

### Select and Blur Custom Elements in Supademo

Source: https://docs.supademo.com/create/by-demo-type/guided-screenshot-and-video-demos/smart-blur

Manually select custom elements to blur either before or during a Supademo recording using the select & blur functionality.

```text
You can also select **custom elements** to blur before or during a Supademo recording. Here's a quick walkthrough of how to use the select & blur functionality:
```

--------------------------------

### Zapier Integration Unauthorized Error Response

Source: https://docs.supademo.com/admin-and-billing/integrations/data-and-api/developer-docs

This response is returned if the provided API key is invalid or the workspace lacks the necessary permissions or plan.

```json
{
  "message": "Unauthorized"
}
```
Tokens:
Raw