Set up Chat

Chat allows customers to get in touch with your business without needing to send an email or wait long for a reply.

When working on a Chat ticket, you'll see additional buttons below your text input field that will let you insert bold, underlined, and italic text, as well as give you the ability to create hyperlinks, insert inline images, and add emojis to your message.

You'll also see several prompts:

A delivered ✓ and read icon ✓✓ for each message sent by agents to shoppers.
A notification below the latest sent/received message that the shopper is currently typing a new message.
The Last seen on Chat information as a 🟢 or 🟠 icon over the shopper's avatar.

Web Acceleration tools (Content Delivery Networks (CDNs)), lazy loading, caching, precaching, and user speed optimization) can cause harm to the Chat widget - it's crucial to avoid caching the Chat widget and any personal data on the webpage, including Shopify variables (window.SHOPIFY_CUSTOMER_ID, window.SHOPIFY_CUSTOMER_EMAIL).

Steps

Set up the basics

Here you can select your Chat's title which is what your customers see at the top of your Chat widget when it's open, as well as the language of the Chat (you can add more of them with the + Add More Languages button on the right.

Then, you can select a platform type:

Ecommerce platforms (Shopify, Magento, and BigCommerce)
Any other website

The first group has to specify the store right away to enable Quick installation and use Automate features, while the second can do so at a later date.

Finally, you can choose to make your Chat live or in offline mode. You can also choose to hide “Send us a message” button so customers must start with an automation button before they can send a message.

Customize your Chat

Here you can choose the colors of your Chat widget and the look of your launcher.

Automate

Here you can also choose to connect a store to turn on features like Order Management and Article Recommendation - all part of our Automate add-on.

Install and launch

There are 2 installation methods to choose from:

Quick installation for Shopify stores
Manual installation for non-Shopify stores, Shopify Headless stores, or to add Chat only to specific pages on a Shopify (or any other) store

Quick installation

When you select quick install, Gorgias automatically adds the code for Chat to your Shopify store’s theme.

Select Quick installation for Shopify, then select Install
- You will be taken to your Shopify store’s theme in a new browser tab. There’s no need to edit anything on this page.
Select Save to add Chat to your store’s theme

On the Chat installation page in Gorgias, selecting the Install button to add Chat to your Shopify If you only want to show Chat on specifics pages on your store, select the down arrow next to Quick installation for Shopify. Here you can choose to Show on all pages or Hide on specific pages.

If you choose to Hide on specific pages, you can then apply rules to specify which pages to hide. For example, you might exclude page URLs that contain /pages/contact to hide chat on your contact page. Select Update Installation to confirm.

Adding a page URL to hide Gorgias Chat on specific pages of your store

Note: When you use the Quick Installation method to add Chat to your Shopify store, you can then separately add Chat to your checkout and thank you pages.

Manual installation

1. Select Manual installation.

2. Click on the Install Manually button and See Instructions on the pop-up.

3. Click on the arrow to the right to expand the manual installation instructions.

4. Select your site type from the options provided - Shopify Website, Any Other Website, and Google Tag Manager.

5. Follow the instructions displayed under the chosen tab.

By copying the code to your Shopify theme.liquid files, the Chat will be shown on all pages. If you only want to show it on specific pages, copy the Chat code only onto the pages that you want the widget to appear on or follow the steps for Quick installation where you can choose on which URLs you wish to have the Chat shown.

If you're using Gorgias Chat on an iOS webview, make sure to add about:srcdoc to your webview's originWhitelist.

Google Tag Manager installation

When the Chat is added using the Google Tag Manager, it won't display on the website to someone who has an ad blocker switched on.

1. Go to Settings → Channels -> Chat -> your Chat integration -> Installation -> Google Tag Manager.

2. You'll find your Chat App ID in step 4 - please copy it.

3. Go to your Google Tag Manager, go to Tags in the menu, then click on the New button to create a new tag.

4. Search for Gorgias Chat and select it.

5. Enter your Gorgias Chat App ID from step 2.

6. Select All Pages - Page view in the Trigger section, then Publish.

If the Chat widget was installed manually and the tag was added to GTM, it's recommended that the installation code is pasted directly into HTML.

Due to Google Tag Manager limitations, you might have to whitelist the code in your Content-Security-Policy and, if you have the Content-Security-Policy header configured, you'll need to whitelist Gorgias as well.

If you delete the Chat integration all settings would have to adjusted once more should you install the Chat again.

Installation Monitoring

To make sure your Chat is installed correctly, we're checking whether we've seen the bundle be loaded on your website in the past 72 hours.

If you've just installed the Chat, you need to go to your website and refresh to make the status change. If you've uninstalled your Chat, you'll see the change in status on the list after 72 hours.

If we don't see the Chat on your website, we'll let you know by displaying:

the Not Installed status in the Chat list
a banner on the Installation page.

Since we're relying on visitors' traffic to know if your Chat is installed, it's possible that we displayed Not Installed when there was simply no traffic on the website in the last 72h.

Content Policies

If your store uses strict content security policies, you may need add the following URLs to an allowlist in order for the Gorgias Chat widget to work:

11- https://config.gorgias.chat
22- https://assets.gorgias.chat
33- https://config.gorgias.io
44- https://us-east1-898b.gorgias.chat
55- https://storage.googleapis.com

If you subscribe to Gorgias Automate, consider adding the following URL as well:

11- https://api.gorgias.work

If you want to add Chat on your Shopify checkout and thank you pages, also add the following URL to your allowlist:

11- https://*.shopify-checkout.config.gorgias.chat/

Set up ChatUpdated 4 months ago