---
title: "Embed an AI Trainer in Salesforce"
url: "https://help.outdoo.ai/en/article/embed-an-ai-trainer-in-salesforce"
language: "en"
last_updated: "2026-11-10T16:29:38.042Z"
---

# Embed an AI Trainer in Salesforce

You can add a single AI Trainer to a Salesforce Lightning page as a live panel. Team members open the record they're working on and start a trainer session without leaving Salesforce or switching tabs.

The embed is a sandboxed `<iframe>` that points at one trainer. For what a trainer is, see [Intro to AI Trainer](https://help.outdoo.ai/en/article/intro-to-ai-tutor). To embed in an LMS, a CMS, a website or a blog instead, see [Embed an AI Trainer Anywhere](https://help.outdoo.ai/en/article/embed-an-ai-trainer-anywhere).

## Before you start

-   You need a permission profile with **Embed AI Trainer** turned on. It sits under **Agent Access** in **Company Settings > People Settings > Permission Profiles**, and it is off by default. It doesn't need **Manage Agents**. See [Create and Manage Permission Profiles](https://help.outdoo.ai/en/article/create-and-manage-permission-profiles).

-   In Salesforce, you need System Administrator access to Setup to create a Visualforce page, update Trusted URLs and edit the Lightning page.

## Step 1: Get the embed code

-   Go to **Practice > AI Trainer**.

-   Find the trainer, open its **⋯** menu and select **Embed AI Trainer**.

-   Optionally set a **Width** and **Height** under **Size (Optional)**. Leave them blank to use 100% width and height.

-   Click **Copy Embed Code**.

The copied snippet looks like this:

```html
<iframe src="https://app.outdoo.ai/embed/roleplay/ai-tutor/[trainerId]"
  allow="camera *; microphone *; display-capture *; autoplay *; fullscreen *"
  width="100%"
  height="100%"
  style="min-width: 375px; min-height: 650px; border: 0">
</iframe>
```

Keep the `allow` attribute exactly as generated. Sessions can use the camera and microphone, and the browser blocks them without it.

## Step 2: Create a Visualforce page

-   In Salesforce **Setup**, go to **Custom Code > Visualforce Pages** and click **New**.

-   Give it a label, then paste the embed code from Step 1 into the **Markup** field. Save.

-   Open the page you just created and click **Security**. Add the profiles that should be able to access it, then save.

## Step 3: Allow Outdoo AI through Salesforce's CSP

Salesforce blocks cross-origin frames and camera and microphone access by default, so two settings need to allow Outdoo AI explicitly.

-   Go to **Setup > Security > Trusted URLs** and click **New Trusted URL**.

-   Set these fields:

-   **URL**: your Outdoo AI address, for example `https://app.outdoo.ai`.

-   **CSP Context**: Visualforce Pages.

-   **CSP Directives**: `connect-src` and `frame-src`.

-   **Grant access to**: Camera and Microphone.

-   Save.

-   Go to **Setup > Security > Session Settings** and enable the **Permissions Policy** HTTP header. Set camera and microphone access to **Trusted URLs** (or **Always**).

-   Save.

## Step 4: Add it to a Lightning page

-   Open the Lightning page in **App Builder**. Use the gear icon on the page and select **Edit Page**.

-   Drag a **Visualforce** component onto the page.

-   Select the Visualforce page you created in Step 2.

-   Click **Save**, then **Activate**.

Once activated, the trainer panel appears on the record page.

## Signing in inside the embed

The first time a team member opens the panel, they see a **Sign In to Practice** screen. They can click **Sign In with Outdoo AI** to sign in without leaving the Salesforce tab. If their identity provider blocks login pages inside a frame, they can click **Open Sign In in a New Tab**, then return to the Salesforce tab. After signing in they see only that trainer, with no navigation to the rest of Outdoo AI. A **Sign Out** button lets them switch accounts.

## Troubleshooting

**Banner says camera or microphone access is blocked.** The Permissions Policy header in Session Settings isn't enabled yet, or the Trusted URL doesn't grant camera and microphone access. Reload the Lightning page after saving both settings. Team members can click **Open in a New Tab** to use the same trainer outside the frame meanwhile.

**Sign-in screen loops or goes blank.** The identity provider refuses to show its login page inside a frame. Use **Open Sign In in a New Tab**.

**This AI Trainer is still a draft, or isn't active yet.** Ask a workspace admin to publish or activate it.

**You don't have permission to practice with this AI Trainer.** Ask an admin to share the trainer with the team member or add them to the workspace.

**Wrong account in the panel.** Click **Sign Out**, or **Sign Out and Try Again** on an error screen, and sign in again.

Hope this article was helpful. For any queries, please write to support@outdoo.ai

## Related articles

-   [Embed an AI Trainer Anywhere](https://help.outdoo.ai/en/article/embed-an-ai-trainer-anywhere)

-   [Create and Manage an AI Trainer](https://help.outdoo.ai/en/article/create-and-manage-an-ai-tutor)

-   [Embed a Roleplay Agent in Salesforce](https://help.outdoo.ai/en/article/embed-a-roleplay-agent-in-salesforce)