In this article, we’ll cover the basics of Hatch Chat including what it does, how to set it up, and frequently asked questions.
Hatch Chat Overview
Hatch Chat allows you to connect with your customers directly from your website.
It is similar to a traditional webchat, except when the customer submits a message, the conversation continues on their cell phone over text messaging. This allows you to continue the conversation with the contact even after they leave your website.
Check out a quick video demo here:
Here’s how it works
The Hatch Chat widget is added to your website using a simple-to-install snippet of code. Once set up, the pop-up looks like this and can appear on every page where you put the code snippet.
Here is an example of Hatch Chat on our Website.
When a customer requests to chat, it will ask them to add their cell number and their message.
If they visit your site on their mobile device, it will automatically open their text messaging function and pre-populate a message.
Here is an example of Hatch Chat on a Mobile Device.
Once they submit the message, there are two ways you can handle these inbound messages.
- You can have them show up in your Hatch workspace, in the INBOUND column, where you can easily text those customers back.
- You can set it up to have those contacts immediately launch into a campaign, ensuring an instantaneous response.
In Hatch, you will see the message submitted through the website pop into the inbound column.
If their number is already in your Contacts, it will show their name instead of just a number.
For the customer, they will see the first message you send back pop up on their phone. Make sure to introduce yourself!
We also recommend putting the customer into a campaign for gentle follow up. See our suggested campaign verbiage here.
Setting Up
Setting Up Hatch Chat is easy! It just might require a little work from the team that handles your website.
Creating the Snippet
Before installing the snippet, you'll need to create a snippet unique to your account.
- Determine which Hatch Workspace you would like the leads to come into. Then, ask your Customer Success Manager what your Hatch Board Number is.
- Copy the snippet that reflects your Hatch version and replace Workspace_ID with your Hatch Workspace Number.
Snippet
<script type="text/javascript">function _loadHatchScripts(t){try{var e=document,n=e.createElement("script");n.src=t,n.async=!0,n.defer=!0,n.dataset.hatchid="BOARD_ID";var a=e.getElementsByTagName("script")[0];a.parentNode.insertBefore(n,a)}catch(t){}}window.addEventListener("WebComponentsReady",function(){_loadHatchScripts("https://hatch-javascript.s3.amazonaws.com/hatchChat-app.js")}),"attachShadow"in Element.prototype?document.dispatchEvent(new CustomEvent("WebComponentsReady",{bubbles:!0})):_loadHatchScripts("https://unpkg.com/@webcomponents/webcomponentsjs@2.2.10/webcomponents-bundle.js");</script>
Installing the Snippet
Once you have your unique snippet created, then it is time to install Hatch Chat. We recommend using Google Tag Manager or installing the snippet directly into your <head> tag on your website.
- Go to tagmanager.google.com and login to your account.
- Select Add a New Tag.
- Name the tag “Hatch" (or whatever you'd like).
- Select Choose a Tag Type and choose Custom HTML.
- Paste the Hatch Chat Snippet you generated above. Make sure "BOARD_ID” is replaced with the board number you’d like messages to go to.
- Scroll down and select Triggering. We want to create a trigger that tells the tag to fire (load) after the page is fully loaded. This will ensure all your site’s content loads before Hatch Chat.
- Select + to add a new trigger.
- Name your trigger “Window Loaded” and select Choose a trigger type.
- Select Window Loaded.
- Click Save
- When you’re ready to deploy the tag on your website, hit Submit.
- Confirm that Hatch Chat is displaying on your site. Once you have the snippet installed, the Hatch Chat widget will be visible on the bottom right of your website.
- Identify the <head> tag section of your website.
- Paste the Hatch Chat Snippet you generated above. Make sure "BOARD_ID” is replaced with the 8-digit board number you’d like messages to go to.
- Publish your changes.
- Confirm that Hatch Chat is displaying on your site. Once you have the snippet installed, the Hatch Chat widget will be visible on the bottom right of your website.
Putting Contacts into Campaign
You can use Instant Lead Engagement to allow Hatch to automatically follow up with contacts with text and/or voicemail after they fill out the form on your website.
Here is our recommended verbiage for Hatch Chat follow-up:
|
Touch 1, When Lead Comes In Hi, this is [[User First Name]] with [[Details Company Name]]. Thanks for texting us! Can you tell me more about what you need help with? If you'd rather not talk over text, reply END. |
|
Touch 2, Day 2 at 10:00 AM Thanks again for texting us the other day. I didn’t hear back from you, text me back with what you need help with, I'm here to help. |
|
Touch 3, Day 3 at 2:00 PM Hi [[Contact First Name]], it's [[Details Company Name]]. Text me back when you have some time so I can help you out! |
|
Touch 4, Day 5 at 9:00 AM Hi [[Contact First Name]], it's [[Details Company Name]]. If you ever need help with anything, text me at this number! |
Work with your Customer Success Manager to customize your messaging based on the needs of your business.
Frequently Asked Questions
How do I adjust the user image that shows?
The image that shows in the Hatch Chat Embed can be set by uploading a profile image to the first user in your Hatch Account.
Can I adjust the verbiage in the pop-up?
At this time, the verbiage can not be adjusted.
Can I change the color of the pop-up on my site?
At this time, the color can not be changed.