Embedding Procedureflow in Genesys Cloud

This guide provides detailed steps on how to configure a Genesys Cloud Interaction widget with Procedureflow. This can be set up to work with different channels. An inbound request accepted by an agent with access to the interaction widget gives the agent access to the configured widget.

1. Prerequisites

Complete the following before configuring the interaction widget:

1.1 Groups

Ensure the agent that needs access to the interaction widget is part of a group.

Groups in Genesys
Group Members in Geneys
  1. In the Genesys Cloud dashboard, navigate to User Management → Groups.
  2. Create a new group by clicking Add General Group   or use an existing group.
  3. Add a new member by clicking Edit   in the top right.
    1. At the bottom of the page, within the input field with the placeholder Add Individual search the agent's name.
    2. Select the name from the results and click Save   

1.2 Create embed URL

Before creating the Genesys script, get the Procedureflow embed URL for the experience you want to enable:

  • Entry Point: Use an Entry Point embed URL to give users access to Procedureflow content through the canvas. See Create an embed link for an Entry Point.
  • AI Chat: Use a Chat embed URL to give users access to Procedureflow content through a conversational interface. See Create an embed link for AI Chat. Keep the embed URL available. You'll use it when configuring the Genesys script.

    • Note: AI Chat are currently in Beta. Features and behavior may change as the Beta evolves.

2. Interaction Widget

Note: Ensure the necessary licenses required to gain access to the interaction widget are enabled.

Add Integration

  1. Navigate to IT and Integrations → Integrations

  2. Select Add Integration     

  3. Search the client application    in the search bar.
  4. Click Install    on the Client Application    result.



Configure Integration



  1. Under the Details    tab, input the Integration Name    and optional notes in the Notes    section.

  2. Click the Configuration    tab

  3. Under the Properties    sub-section, input the following details:
    1. Application URL:
      1. Copy the embed URL created in section [[#1.2 Create embed URL]]
      2. Entry Point embed: Append /flows/<flowId>    to the URL.
        1. flowId    should be the ID of the first flow in the entry point.
      3. Chat embed: Append /chat    to the URL
      4. Append the following query params to the end of either URL: langTag={{gcLangTag}}&gcTargetEnv={{gcTargetEnv}}&gcHostOrigin={{gcHostOrigin}}&conversationId={{gcConversationId}}     
      5. Genesys populates the variables automatically when your widget runs.
      6. The final URL should look like the following: https://embeds.procedureflow.com/<hash>/chat?langTag=⁣&gc TargetEnv={{gcTargetEnv}}&gcHostOrigin={{gcHostOrigin}}&conversationId={{gcConversationId}}    for chat embed and https://embeds.procedureflow.com/flows/<hash>/<flowId>? langTag=⁣&gc TargetEnv={{gcTargetEnv}}&gcHostOrigin={{gcHostOrigin}}&conversationId={{gcConversationId}}    for entry point embed.
    2. Iframe Sandbox Options:
      1. Input the following string: allow-scripts, allow-same-origin, allow-forms, allow-modals, allow-popups     
    3. Group Filtering:
      1. Select the group the agent belongs to as set up in [[#1.1 Groups]].
      2. This is key because without this selection the agent has no access to the interaction widget
    4. Queue Filtering:
      1. If the interaction widget needs to be restricted to specific groups, select all groups you want it to be enabled.
      2. Ensure the agent is also part of at least one of the selected groups.
    5. Communication Type Filtering:
      1. Input the following string to enable interaction widgets in the specified channels: call, chat, email, callback, whatsapp, web messaging, sms     
    6. Work item Filtering:
      1. Set the value at your discretion.
  4. Under the Advanced  sub-section, paste the following snippet if you want to prevent a reload of the interaction widget when the agent switches between multiple interaction views, e.g., voice and chat. Otherwise, skip this section
{
“lifecycle”: {
“ephemeral”: false,
“hooks”: {
“blur”: true,
“bootstrap”: false,
“focus”: true,
“stop”: true
}
}
}
  1. Click Save & Activate  at the bottom of the page to save changes and activate the interaction widget.

3. Verify Agent Access

Note: Trigger a session reset for the agent by getting them to log out of their Genesys cloud dashboard and then logging back in.

  1. Set up a voice or chat interaction that the agent accepts.
  2. Once the agent accepts the interaction, the widget should appear at the top of the agent's workspace.
  3. On first use, the widget might be inactive and might not appear on the agent's workspace.
  4. The agent will need to click on it to activate. A blue background on the widget signifies activation.
  5. The agent should be able to see an embedded version of Procedureflow on the screen.

Workspace with inactive widget

Workspace with inactive widget

Workspace with active widget


Workspace with active widget (Entry Point)

Workspace with active widget (Chat)

Related Articles