Lightning Flow iFrame

Embed Lightning Screen Flows on external websites using a Salesforce Site and the FlowIframeEmbed Visualforce page.

WordPress: wordpress.org/plugins/lightning-flow-iframe (v1.1.0+)

What you get

• Flows run in Lightning Runtime (not Classic Flow UI).
• Auto height: iframe grows as users move through screens (postMessage).
• Flow inputs from URL parameters using an inputVars allowlist.
• Finish redirect: send parent window to a thank-you page via endUrl.

Components

Piece	Where
FlowIframeEmbed package	Install from AppExchange or 2GP unlocked package
FlowOut Aura app	Included in package (three_levers:FlowOut)
FlowIframeEmbed VF page	https://your-site.force.com/site-prefix/apex/three_levers__FlowIframeEmbed
three-levers-flow-embed.js	Optional script for non-WordPress sites
WordPress plugin	Shortcode [Lightning-Flow-iFrame] with settings defaults

Note - namespaced Visualforce page URLs: The page ships in the three_levers package as three_levers__FlowIframeEmbed. Site iframe URLs use /apex/three_levers__FlowIframeEmbed, not /FlowIframeEmbed. See Salesforce setup for details.

High-level setup

1. Install FlowIframeEmbed in Salesforce.
2. Create and activate the Screen Flow; note its API Developer Name.
3. Add FlowIframeEmbed to a Salesforce Site and configure guest access.
4. Allow your parent domain in clickjack/CSP settings.
5. Embed with the WordPress plugin or JavaScript widget.

Flows, Sites, and guest user permissions are configured per org and are not bundled in the package.

Choose your path

Platform	Start here
WordPress	WordPress
Any other site	JavaScript widget
Salesforce side	Salesforce setup
Flow design	Flow creation
URL behavior	Querystring variables · Finish URL

External embed options

• WordPress: plugin with Settings → Lightning Flow iFrame defaults and bare [Lightning-Flow-iFrame] shortcode (embed mode). Legacy mode preserved for existing Visualforce integrations.
• Recommended (non-WordPress): JavaScript widget (window.tlFlowEmbed).
• Manual: iframe src + postMessage listener for { frameHeight: number }.

Related products

• Map Records and Take Action — report map and geofencing (separate package)