Lead Sources
      Back to home
      1. Help Center
      2. Integrations
      3. Lead Sources

      Hatch Chat Overview

      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.  

      chat2.png

      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.  

      chat3.png

      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.  

        1. You can have them show up in your Hatch workspace, in the INBOUND column, where you can easily text those customers back. 
        2. 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. 

      1. Determine which Hatch Board you would like the leads to come into. Then, ask your Customer Success Manager what your Hatch Board Number is.
      2. Double-check with them for which version of Hatch you're using - if you're a new customer as of April 2021, it is the Modern version. Some older customers before April 2021 are using the Legacy version. This will determine which snippet below to use.
      3. Copy the snippet that reflects your Hatch version and replace BOARD_ID with your Hatch Board Number. 

        Modern
        <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. 

       Google Tag Manager
      1. Go to tagmanager.google.com and login to your account.
      2. Select Add a New Tag. Screen_Shot_2020-06-16_at_2.59.25_PM.png
      3. Name the tag “Hatch" (or whatever you'd like). 
      4. Select Choose a Tag Type and choose Custom HTML. Screen_Shot_2020-06-16_at_2.59.34_PM.png
      5. 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. Screen_Shot_2020-06-16_at_2.59.42_PM.png
      6. 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.
      7. Select + to add a new trigger.
      8. Name your trigger “Window Loaded” and select Choose a trigger type.
      9. Select Window Loaded. Screen_Shot_2020-06-16_at_2.59.49_PM.png
      10. Click Save
      11. When you’re ready to deploy the tag on your website, hit Submit. 
      12. 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.   
       Head Tag
      1. Identify the <head> tag section of your website.
      2. 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.
      3. Publish your changes.
      4. 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] - thanks for contacting us!  I can help you set an appointment for your project.  Tell me what you are looking to get done. 

      Touch 2, Day 2 at 9:00 AM

      Hi, this is [User First Name] - thanks for reaching out to us the other day.  I never heard back from you, how can I help you?

      Touch 3, Day 3 at 2:00 PM 

      Hello again, this is [User First Name] - thanks for reaching out to us the other day.  I never heard back from you, how can I help you?

      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.