Skip to main content

Web apps on Salesforce pages

How to place an agent's web app on a Salesforce page with the Web App component.

Overview​

The Agent Platform's Salesforce package includes a Web App component that shows an agent's web app on a Salesforce page, for staff and for Experience Cloud visitors. It is the same page the agent serves everywhere else, held to the same rules: visitors get the deployed version's page, and the app is sandboxed from the page around it.

What a web app is, how one is built, and how it behaves on your own website are on the Web apps page. This page covers placing one in Salesforce.


Adding the component​

Add Flourish Agent Platform: Web App in the Lightning App Builder or the Experience Builder. It works wherever the chatbot does: app pages, record pages, home pages, Experience Cloud pages, Flow screens, and the utility bar.

PropertyDescription
Agent IDThe agent's Agent ID, from Copy Agent ID in the Agent Builder action bar. A Salesforce agent record ID also works.
Web App NameWhich of the agent's web apps to show. Lowercase letters, digits and single hyphens, such as intake-form. Leave it blank for main.
Conversation IDOptional. Continue an existing conversation instead of starting a new one.
Group KeyOptional. Names which memory the agent uses, such as a record ID or an account number. See Choosing which memory to use. Agents set to No memory ignore it.
Record IDOptional. On an Agent record page it selects the agent, so Agent ID can be left blank.
Custom Style (JSON)Optional. Size and background, as JSON. See below.

Record ID picks the agent; it does not pass page context. On any other record page it does nothing. The app knows what its own page and the agent's configuration give it, and nothing about the record it happens to be sitting beside.

Conversation ID is how an app and a chatbot share one conversation. Give the Chatbot and the Web App on a page the same conversation, so a click in the app is in the agent's context when the visitor asks about it in the chat. See One conversation, not two.


Sizing it​

The host picks the size, because the app cannot ask for one. A web app is served in a sandboxed frame, and Salesforce cannot measure how tall its contents are. Set the size in Custom Style (JSON). The app itself scrolls if it needs to.

{
"layout": { "height": "720px", "minHeight": "400px" },
"colors": { "background": "#ffffff" }
}
SectionKeysDefault
layoutwidth100%
layoutheight600px
layoutminHeightauto
layoutmaxHeightnone
layoutborderRadius6px
colorsbackgroundwhite

Any CSS length works, so 720px, 80vh and 100% are all fine. Clearing the property puts the defaults back.

This styles the box the component draws, not the app inside it. The page in the frame is served by the Agent Platform and is styled by the agent.


Hardware​

A web app can ask for a camera, a microphone, or the visitor's location from a Salesforce page. The component delegates those, along with clipboard access, fullscreen and autoplay. Delegation is not permission: the browser still prompts the visitor, who can still say no. An app that never asks for any of it is unaffected.

Each agent's app is served from an address of its own, which is also what lets an app keep anything in browser storage.