Gorgias logo
Gorgias logo

All articles

Ada AI ChatbotUpdated 3 months ago

Ada AI chatbot can be used by non-technical CX teams can power personalized interactions for every customer using Ada’s codeless platform. Launch chat experiences your customers will love in under 30 days, with no dependence on IT.

How it works

You can also avoid WISMO questions, as Ada and Gorgias will provide instant, real-time responses using no-code integrations to your order management system including Shopify, Magento, and more. You can also use Gorgias and Ada to make the first move - reach out to customers on your site proactively with personalized information or offers.

You can also use Ada's AI Chatbot to handoff a customer to a Gorgias live agent when needed. Watch the video below for more details!

There are 2 main use cases for this integration: 1) integrating Ada with Gorgias chat & 2) integration Ada with Gorgias ticketing. Both are described separately below.

Setup instructions

Using Ada together with Gorgias Chat is a great combination to help your customers self-serve and be seamlessly handed off to your support team when needed.

  1. First, configure your Gorgias Chat integration, using the instructions here. Copy the Javascript code for installation.

  1. Next, embed Ada and Gorgias on each web page where you would like both to be implemented.
    Link to sample code: https://gist.github.com/kellylara/0f972cf7370e40fce91f6996429c7f0b 
    To do this:
    1. Add the style tag section from the above linked sample code to the <head> section of your page or add the recommended styles to your CSS style sheet. These styles will help display the appropriate chat buttons.
    2. Add the first two script tag sections from the above linked sample code to the bottom of your page (similar to how it is placed in the sample), and replace ADA_BOT_HANDLE with the handle of your Ada bot. This code will add Ada to your page, and display and hide the appropriate chat widget elements when needed.
  2. Then, replace the below comment with your Javascript snippet from step 1:
    <!-- <Gorgias Chat Widget Javascript snippet goes here> -->
  3. (Optional) Add this CSS to your page, to align Gorgias’ button with Ada’s:
1#gorgias-chat-container iframe#chat-button {
2 height: 64px !important;
3 width: 64px !important;
4 margin-bottom: 12px !important;
5}

Please note, you may need to adjust the height, width, and margin values according to the button size you have configured in Ada.

And that's all that’s needed to install Ada! Ada should now be installed on your site and ready to handoff to Gorgias Chat, which you’ll configure in the next section.

Configuring the handoff in Ada

In this section, we’ll configure an answer within Ada to handoff to Gorgias Chat.

To start, navigate to the answer flow in your Ada bot dashboard where you’d like to handoff to Gorgias Chat. Then, add each of the below blocks in the following order to build out this answer.

  1. Add any message about handing the chatter off to an agent.

  1. Add a 'Request' block to retrieve the chatter transcript from Ada and store it in a variable, with the following parameters:
  1. Following the above 'Request' block, add a second 'Request' block to pass the chatter transcript as a ticket in Gorgias, with the following parameters:

  1. Add any messages and quick replies welcoming the chatter back, after their session with Gorgias Chat is complete.

  1. (Optional) Add 'Capture Message' blocks to capture chatter information like the customer's email address. 
Please note, the name of the email variable name in the Ada Dashboard must match the email variable name in the embed script. These names are case sensitive - if the variable name in the Ada Dashboard is 'firstname', the variable can be accessed in the custom_handoff callback using the following format: 'event.user_data.global.firstname'.

  1. Following your 'Capture Message' blocks, add a 'Custom Handoff' block. This will trigger the custom_handoff event that we added the callback for in the embed script. Note that there are no settings to configure for this block within Ada.

  1. Add any messages and quick replies welcoming the chatter back, after their session with Gorgias Chat is complete.

And that’s it! When a chatter comes to your site, and launches Ada, Ada can now handoff to an agent using Gorgias Chat.

Configuring Gorgias Chat for a more seamless handoff

Here are a couple tips to make the handoff to Gorgias Chat even more seamless. They are not required for handing off to Gorgias, but just make the experience even more slick!

  • We recommend matching your main colour and conversation color in Gorgias Chatt to the colors you’re using in Ada

  • If you currently have self-service enabled for a Shopify store, we recommend turning it off, so chatters are passed directly to the chat within Gorgias. To do this, navigate to https://<YOUR-GORGIAS-DOMAIN>.gorgias.com/app/settings/self-service and disable it

Creating tickets in Gorgias with Ada

Using Ada together with Gorgias is a great way to help your customers get their questions answered through Ada and get support from your team through Gorgias.

Configuring Gorgias ticket creation in Ada

In this section, we’ll configure an answer within Ada to create a ticket in Gorgias.

To start, navigate to the answer flow in your Ada bot dashboard where you’d like to create a ticket. Then, add each of the below blocks in the following order to build out this answer.

  1. Add any messages about creating the support ticket, and if you haven’t done so already, ask the user for ticket details, including their email address, issue description, etc. 

  1. Add a Request block to retrieve the chatter transcript from Ada and store it in a variable, with the following parameters. This transcript will be passed to Gorgias and included in the ticket.

  1. Following the above Request block, add a second Request block to create the ticket in Gorgias, with the following parameters:

  1. Add any messages and quick replies to let them know their ticket has been created and let the continue the conversation with Ada in the meantime.

And that’s it! When a chatter needs support from your team, they can launch Ada, and Ada can now create a ticket for them directly in Gorgias.

Was this article helpful?
Yes
No