Purpose

The purpose of this article is to provide guidance and step-by-step instructions for embedding the Forethought Solve Widget onto your Salesforce Community website.

Before you begin

• Have the code snippet ready, and if you don’t have this, please ask your Forethought Implementation Engineer.
• Make sure that your Salesforce Community website URL has been provided to Forethought, as we’ll need to whitelist this website for the widget to appear and function.
• Testing via “localhost” is not supported by default, please ask your Forethought Implementation Engineer for options on testing locally. Please note that this will introduce additional security risks. For that reason, we ask that you test in a lower environment such as sandbox or staging instead of localhost.

How to Embed the Code Snippet

These steps will help you add the code snippet to your Salesforce Community website for the Solve Widget to be embedded on all pages.

1. Start from the Salesforce Home page.
2. Click the App Launcher , the nine dots at the top left.
   
3. Type “Digital experiences home” into the search bar, then click it.
4. Scroll down to the “All Sites” section, and find the site you’d like to add Solve Widget to.
5. To the right of that row, right click “Builder” and click “Open in new tab.”
6. Once inside the experience builder, click the gear icon (Settings).
   
7. Click the “Advanced” tab.
8. Under the Head Markup section, click the “Edit Head Markup” button
9. Copy and paste the code snippet into the editor. 
   • *Note: This code snippet will look different depending on your workflow configurations. Please paste the code snippet given to you by your Implementation Engineer.
10. Click the Save button.
11. Click Publish in the upper right hand corner.
12. Salesforce will send you an email when it is published.
13. To see the newly published site, go back to your “Builder” tab from step 5, and click “Link to site”.

Using a Component to Embed the Widget

If adding the embed script to the head markup will not work for your organization, we also have a component available that will allow more precise control of where the Forethought widget is shown.

1. Ask your Implementation Engineer for a package link to install into Salesforce
2. After installing the package, you can add the component "ForethoughtWidget" to all the pages where you would like the Forethought widget to be available
3. After adding the component to an appropriate section of the page, you will have to configure the parameters on the component

API Key: This is the API token viewable on the Code Snippet page in the Forethought Dashboard

Parameter Keys: These are the names of workflow context variables to pass information to, you will enter these separated by commas in the way they show up in the Code Snippet page, minus "data-ft-"

Parameter Values: These are the values that match with the keys entered above, also comma separated. These are ordered so make sure they align with the parameter keys. (i.e. Email will be set to "test@test.com", Test-Context will be set to TestContextValue)

Workflow Tag: The value of the tag to apply here, possible values are also shown in the Code snippet page

Open Widget Automatically: When enabled, the widget will automatically open after a number of seconds specified in Auto-open wait time

For more information about Context Variables see this article

After setting the parameters, the widget will be live on that page. If you have the component deployed on multiple pages, repeat these steps for each page.