Add Microsoft Teams Chat to your Wix Website
Do you use Microsoft Teams and Wix? In this article, we'll show you how to embed Microsoft Teams Live Chat in your Wix website so you can answer live chats from your Wix website visitors right from Microsoft Teams.
Step 1: Add Live Chat to Microsoft Teams
If you have not yet added the Live Chat app to your Team in Microsoft Teams, just click the '+' button at the end of the tab list from within Teams.
You can also use this link: Add Live Chat to Teams.
You can reply to chats from the Team conversation or the dedicated ‘Live Chat’ tab.
Next, mention our ‘@Live Chat’ bot in your posts of this channel to make sure we see your messages.
Step 2. Next, to access your Chat Settings and Agent Settings, add the Live Chat app to your personal workspace.
Click on the 3 dots in the left sidebar and search for ‘Live Chat’.
If you have not yet added your app to your Team, FIRST choose the option ‘Add to a Team’ and select the Team that you have added your Live Chat tab to. THEN, select ‘Add’ to add Live Chat to your personal workspace.
(Note: If you don't see it in the left sidebar when selecting the horizontal dots icon, search for ‘Live Chat’ and select it.)
Each Team member should also add your Live Chat app to their workspace individually, as this is how your Team members can change their Agent Settings, such as their photo and nickname.
* If you aren't receiving chat requests to your team:
If you are not receiving Live Chat request notifications to your Team, you may not have added the app to a Team when originally installing. You can always uninstall and re-install the app to your workspace in the following article. See this article on how to uninstall and reinstall the app to your personal workspace.
3. Turn on your Channel Notifications.
By default, new Post Notifications are turned off. To make sure you never miss a Live Chat request, turn on your Channel Notifications. Just click the 3 dots next to your Team’s ‘General’ channel. Then, on the popup, choose ‘All New Posts’: 'Banner and feed': then ‘Save’.
4. Copy your code snippet for inclusion in Wix
Go to the Live Chat app settings and select the ‘Code Snippet’ option to find your code snippet.
You can access the Live Chat app settings from the left-hand navigation by clicking the horizontal 3 dots, then choosing Live Chat. If you don't see your Live Chat listed here, add it by selecting the ‘Browse all apps’ button, then adding Live Chat.
Once in the app settings, choose the ‘Chat Settings’ tab, then choose 'Install Code Snippet'.
Step 5. Add your Custom Live Chat code snippet to Wix
Now we will show you how to add your code snippet directly to your Wix website. Go to your Wix Dashboard:
And scroll down to the Settings link:
Step 6. Select the Custom Code option under the Advanced Settings
Next, scroll to the bottom of the Settings page to the Advanced section and choose Custom Code link.
Now grab the code snippet you copied in step 4 into the Edit Custom Code section in your Wix Settings as follows:
Finally, make sure to enable the custom code snippet you entered above once you Apply the snippet by turning on the toggle button for the snippet.
Step 9. Disable the Wix Chat that is already there
For our case, we want to use the 3rd Party Live Chat application instead of the built in Wix chat because we already use Microsoft Teams and want to continue to use it to chat with visitors.
To disable the built in chat, just go to the website editor, select the Wix Chat element and click your delete button. Now Publish your app and your custom code snippet will be active.
Step 10. Preview your Live Site that includes your embedded Microsoft Teams Live Chat
That's it. After publishing your Wix changes, simply view your live site to verify your Live Chat for Microsoft Teams is now active on your Wix website!
Once you start a chat from your Wix website, you'll receive live chat notifications right within Teams and can answer all the chats from your Teams desktop or mobile apps.