Create a Snippet Settings File for an Experience Site
Take your snippet-only settings like extra pre-chat configuration or direct-to-button routing to your Experience site. Create a JavaScript file and upload it as a static resource that you reference in your Embedded Chat component settings.
The legacy chat product is in maintenance-only mode, and we won’t continue to build new features. You can continue to use it, but we no longer recommend that you implement new chat channels. Instead, you can modernize your customer communication with Messaging for In-App and Web. Messaging offers many of the chat features that you love plus asynchronous conversations that can be picked back up at any time.
Automated chat invitations are available in Experience sites using static resources (see Chat Code Settings to Experience Sites).
In this file, you can’t set pre-chat fields to fill in for logged-in users. Use the Fill-in pre-chat fields option in your Embedded Chat component settings.
In your JavaScript file, define the settings you want to use in your site’s chat window.
| Setting Name | To Specify in Your File |
|---|---|
| Auto-open for post chat | embedded_svc.snippetSettingsFile.autoOpenPostChat = true; // or false |
| Avatar image URL | embedded_svc.snippetSettingsFile.avatarImgURL = ''; |
| Chatbot (Einstein Bots) image URL | embedded_svc.snippetSettingsFile.chatbotAvatarImgURL = ''; |
| Company logo image URL | embedded_svc.snippetSettingsFile.smallCompanyLogoImgURL = ''; |
| Direct-to-button routing | embedded_svc.snippetSettingsFile.directToButtonRouting = function(prechatFormData) {}; |
| External scripts | embedded_svc.snippetSettingsFile.externalScripts = []; |
| External styles | embedded_svc.snippetSettingsFile.externalStyles = []; |
| Extra pre-chat form details | embedded_svc.snippetSettingsFile.extraPrechatFormDetails = []; |
| Extra pre-chat information | embedded_svc.snippetSettingsFile.extraPrechatInfo = []; |
| Pre-chat background image URL | embedded_svc.snippetSettingsFile.prechatBackgroundImgURL = ''; |
| Routing order | embedded_svc.snippetSettingsFile.fallbackRouting = []; |
| Waiting state background image URL | embedded_svc.snippetSettingsFile.waitingStateBackgroundImgURL = ''; |
Your settings are applied first from the Embedded Chat component settings in the Experience Builder, then from your JavaScript file, then from Setup. For example:
- If you set an avatar image in your JavaScript file but leave the setting blank in Setup, the image you set in your JavaScript file displays.
- Let’s say you include an agent avatar in Setup but don’t specify one in your Embedded Chat component settings or in your JavaScript file. Then the image you included in Setup displays.
Upload your file as a static resource in Setup. If you can’t access Setup, ask your Salesforce admin for help.
When you upload your file, make sure that you:
- Select Public for the cache control.
- Give it a name that’s easy to remember and type. You use the static resource name, not the file name, to reference the file from the Embedded Chat component settings.
In the Experience Builder, enter the static resource name (not the file name) in the Snippet Settings File field. If you can’t access the Experience Builder, ask your Salesforce admin for help.
For example, if your JavaScript file is called SnapInCodeSnippetSettings.js and you named it SnippetSettings in your static resources, enter SnippetSettings in the Snippet Settings File field.
This example doesn’t use real URLs, file names, user IDs, button IDs, or email addresses. Enter your own information if you copy parts of this example for your own snippet settings file.
When you change your JavaScript file, follow these steps. They help you to ensure that you don’t have to regenerate your Embedded Service code snippet or edit your Embedded Chat component settings.
- Go to Static Resources in Setup.
- Next to your static resource for your old JavaScript file, click Edit.
- Upload your updated JavaScript file.
- Click Save.
Your static resource name doesn’t change, so you don’t have to modify any additional settings.