Chat management: Install chat
Last Update: Sep 2024 • Est. Read Time: 3 MINConnect with customers over chat using our web and mobile SDKs. You can generate a custom chat code snippet to embed your chat widget on your website and create keysets to turn on push notifications for Android and iOS devices.
Learn more about the Kustomer Chat SDKs for web and mobile in Chat SDK developer documentation.
Who can access this feature? | |
User types | Admins can access the Chat page. |
In this article
- Generate the Web SDK code
- Embed the Web SDK code on your site
- Embed the Web SDK code to your Knowledge Base
- Turn on mobile SDK push notifications
- Customize your push notifications content
To access the Chat SDK settings for a brand in Kustomer, go to Apps> Chat. Select the desired brand from the Chat Management page and then go to the Install Chat tab.
Generate the Web SDK code
The Web SDK setting automatically generates the standard chat widget code for your brand customized with your brand ID and API key with the correct role to use with the Web SDK. Otherwise, you can manually create and enter an API Key with the org.tracking
role. To create an API key go to Settings > Security > API Keys.
The following two values are generated:
data-kustomer-api-key
is the unique API key tied to your Kustomer organization.brandId
is the unique brand ID of the chat widget brand. To learn more, see Find your brand ID.
Note: If you don't include a specific brand ID in your Chat SDK, Kustomer automatically assigns the default brand ID. To learn more, see Multi-brand Chat.
Embed the Web SDK code on your site
Copy and paste the generated chat widget code to embed the chat widget on your site.
To embed the code:
- Select Copy Code to copy the code snippet. Make sure that you have selected the correct brand and that there is an API key in the code.
- Locate the closing body tag in your HTML file for the website.
- Paste the code before the closing body tag and save your HTML file.
Once you save the HTML file with the Web SDK code, you can chat and track visitors with chat on the site.
Embed the Web SDK code to your knowledge base
To learn how to add chat to your knowledge base, see Add chat to your knowledge base in the Chat SDK developer documentation.
Turn on mobile SDK push notifications
The chat mobile SDKs support push notifications for your mobile apps on Android and iOS. You can create keysets within your Kustomer chat settings to turn on push notifications for Android and iOS devices. For iOS only, you can test push notifications on a simulator before turning them on.
Android
- Before creating a keyset, ask your mobile developer for the Firebase Cloud Messaging Private Key file
- For more information, see Push notifications with FCM in our developer docs.
iOS
- Before creating a keyset, ask your mobile developer for the following information:
- Apple Developer account-wide push key as a p8 file
- Apple Developer Account Team ID
- Apple Push Notifications service (APNs) Key
- Bundle IDs for each app you want to use with push notifications.
- Include bundle IDs for both your Kustomer sandbox and Kustomer production environments.
- See Push Keys and Certificates in our developer docs for more information. See Push notifications to learn more about implementing and testing push notifications in iOS.
Customize your push notifications content
By default, push notifications show a preview of the chat message content. To prevent sensitive information from appearing in the push notification preview, you can use this setting to redact it. For example, you can use this setting to replace the preview with a message that reads "You received a secure message".
You can customize your push notifications by adding an emoji, personalizing the notification with contextual data (such as a customer's name) with dynamic text, or using a snippet for multi-lingual support. For notifications to display properly, we recommend a maximum length of 45 characters for the title and 128 for the body.
Note: Selecting Reset to Default removes any custom overrides. Notifications will show the message preview instead.