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. To embed in an LMS, a CMS, a website or a blog instead, see 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.
  • 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:

<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

Was this article helpful?

English
Powered by Product Fruits