Zendesk Chat There Was an Error Processing Your Request Please Try Again Later

How to observe and access theme.liquid files
- Boosted instructions for Shopify
Using the Gorgias Chat JavaScript API
Advanced Personalization
- Disable auto open
- Remove 'Powered past Gorgias' branding
- Create an "open up chat" link on your page
- Hiding the chat on mobile
- Brandish the conversation widget afterwards some time spent on the website
- Remove the chat outside business hours
- Set custom business organisation hours
- Adjust chat default text values
- Display currently used text values
- Toggle the display of translation keys/text values in the chat
- Add custom CSS
- Supercede the chat widget button
Chat interactions with JavaScript
- Configuring the chat with URL query parameters
- Pre-fill the user bulletin
- Bank check if the chat is open up or airtight
- Check whether the current time is in business organization hours
- Disable the Self-service Portal
- Fix the current folio of the chat
- Subscribe to chat events
- Programmatically transport a message
- Programmatically capture an email
- Programmatically capture the Shopify cart
Boosted features
- Disable Segment
- Remove the chat based on country code
Troubleshooting
- Uncaught ReferenceError: GorgiasChat is non defined
- The chat is conflicting with other widgets

If y'all would like to further customize the chat widget, you tin follow the instructions below. Withal, y'all may starting time want to check out this guide on how to set up some bones chat customization.

This commodity is meant to serve simply as a reference signal for you and your team and following these instructions will require knowledge of HTML, JavaScript, and Shopify Liquid if you use Shopify.

If you lot're using BigCommerce, please keep in mind that BC has a 'Manage Code' feature that allows you to place simply <script> codes. This means that you will be able to place the default conversation code and only a few other customization codes in that location.
For any not-script codes, like the one that changes the z-alphabetize in the style, you lot take to become into their 'Theme Managing director → Edit Theme' and detect the habitation.html file.

Disclaimer: The suggestions below are not formally features of our chat widget, just suggestions on how to further customize it. Equally such, our support for these types of customization is limited.
We recommend for these steps to exist performed by someone with a technical background as you're experimenting with the chat set-upwardly.

How to find and access theme.liquid files

Every code snippet used to customize the widget should exist placed just below the conversation installation script between the '<torso>' and '</torso>' tag. To find the script and place any custom code, yous will need to find your Shopify store'stheme.liquid files. Here's how to get there:

From the Shopify admin, go toOnline Store →Themes.
ClickDeportment →Edit lawmaking.

Detailed instructions in Shopify's FAQs here.

Additional instructions for Shopify

Get to your Shopify store's theme.liquid to edit the code.
Navigate to your Shopify domicile screen.
Click on ' Online Shop' on the left.
Select Pages → The folio where you want to add the link (Ex. Contact United states page).
Add the code:
1. Re-create the code above (choose the lawmaking depending on what you desire to do).
2. In the text box under Content, click on the ' <>' icon (it says 'Evidence HTML' on hover). This will switch your view from text but to HTML view.
3. Paste the code.
Edit the text (optional):
1. Go back to the original view past clicking on the ' <>' icon again.
2. By default, it will say, 'Outset a chat with our team!', just you lot may customize this text if you want to.
Click ' Relieve'.

Using the Gorgias Chat JavaScript API

The Gorgias Chat Javascript API helps you configure and customize your chat in some pretty avant-garde means. The Chat API is bachelor in Javascript from the GorgiasChat object as a member of the Window Object.

Earlier y'all call any methods, you need to make sure the chat is fully initialized, this is done with the GorgiasChat.init() method:

// Make sure that Gorgias Chat code snippet is called before your advanced code:
<script id="gorgias-conversation-widget-install-v2" src="https://config.gorgias.conversation/gorgias-chat-bundle-loader.js?applicationId=XXX"></script>// Avant-garde code:
<script>
GorgiasChat.init().then(part() {
            // Use GorgiasChat API here, at present that the conversation is fully initialized.
})
</script>

You lot must never telephone call GorgiasChat without the init().then(...) callback in an HTML script tag <script></script> considering your script code might run earlier the chat is downloaded and initialized.

Avant-garde Personalization

Disable car open

Except when using a mobile device, the chat window will car open for returning customers if they left the chat window opened and their final visit was non more than 4 days ago. You tin prevent this using the following method:

<script>
          window.GORGIASCHAT_DISABLE_AUTO_OPEN = true
</script>

Remove 'Powered by Gorgias' branding

You tin can remove the 'Powered by Gorgias' branding using the post-obit method:

<script>
          GorgiasChat.init().so(function() {
          GorgiasChat.hidePoweredBy(true)
          })
</script>

The branding is displayed in the conversation and the chat campaigns.

Create an "open chat" link on your page

If you want to add a link on your page to open the chat when clicked, apply the code below:

<a onclick="GorgiasChat.open();">Start a chat with our team</a>

Likewise, you tin also have a link to close the chat:

<a onclick="GorgiasChat.close();">Shut the chat</a>

Hiding the chat on mobile

To hide the chat on mobile, utilize the following method:

<script>
GorgiasChat.init().and then(function() {
          GorgiasChat.hideOnMobile(true) // true to hide on mobile, false to testify on mobile.
})
</script>

Brandish the chat widget after some fourth dimension spent on the website

To only display the chat subsequently a sure amount of time, utilize the following method:

<script>
GorgiasChat.init().then(async office() {
          var chatElem = document.getElementById("gorgias-chat-container")
          chatElem.style.display = "none";            part sleep(seconds) {
            return new Hope(resolve => setTimeout(resolve, seconds * 1000));
            }
                      wait sleep(v) // CHANGE THIS VALUE TO THE NUMBER OF SECONDS TO WAIT Earlier SHOWING THE Conversation BUBBLE            
            chatElem.style.display = "";
})
</script>

Remove the conversation outside concern hours

The following method can be used to hibernate the conversation outside your business organisation hours:

<script>
GorgiasChat.init().so(function() {
          GorgiasChat.hideOutsideBusinessHours(true) // true to hide when outside of business concern hours,     false to show.
          })
</script>

Ready custom business hours

The post-obit method tin be used to set custom business hours for your chat:

<script>
          GorgiasChat.init().and so(role () {
          // Edit business organisation hours on the go, if `Hide chat exterior of business organisation hours` is enabled, the chat volition automatically appear or disappear.
          GorgiasChat.setCustomBusinessHours({
          // Using a timezone from https://en.wikipedia.org/wiki/List_of_tz_database_time_zones
          // Day 1 represents Monday
          timezone: "Commonwealth of australia/Sydney",          
          businessHours: [
          { days: [one, 2, three], fromTime: "08:xv", toTime: "17:50" },
          { days: [4, 5], fromTime: "08:15", toTime: "12:00" }
          ]
          })
          });
</script>

Adjust conversation default text values

It is possible to accommodate the hardcoded text values used by the chat. Simply update the values below in the dictionary containing the texts and insert the script in your HTML.

You can change the post-obit hardcoded text values on the chat widget using the code below:

Online and offline introduction text
Message input placeholder
Email capture placeholder
E-mail capture input label
E-mail capture online trigger text
Email capture online thanks text
E-mail capture offline trigger text
Email capture offline thanks text
Electronic mail capture required e-mail placeholder
Email capture required message placeholder

window.GORGIAS_CHAT_TEXTS = chatDict
GorgiasChat.updateTexts(chatDict)
})
</script>

You don't need to provide all the available text keys when updating the texts. Y'all can provide us merely the relevant custom texts, the rest volition employ the default text values.

If yous take enabled the Self-service feature on the conversation, you can utilise the following script, that allows adjusting both the Chat and Self-service wordings:

var sspDict = {
applyPromoCode: "Apply promo code",
april: "Apr",
articleRecommendationInputPlaceholder: "Need more assistance? Ask us a question!",
attemptedDelivery: "Attempted delivery",
august: "Aug",
backToHome: "Back To Home",
billingInformation: "Billing data",
abolish: "Cancel",
cancelFulfillment: "Cancel fulfillment",
cancelMessageDescription: "I'd like to cancel the following fulfillment",
cancelOrder: "Abolish an order",
canceled: "Canceled",
cancelled: "Cancelled",
cantSignIn: "Can't sign in?",
changeShippingAddress: "I'd like to alter my shipping accost",
checkSpamFolder: "If yous tin can't observe the verification email, please check your spam and junk folders.",
checkpointAttemptFail: "Failed endeavor",
checkpointAvailableForPickup: "Bachelor for pickup",
checkpointDelivered: "Delivered",
checkpointException: "Exception",
checkpointException_001: "Exception",
checkpointException_002: "Client moved",
checkpointException_003: "Customer refused delivery",
checkpointException_004: "Delayed (Customs clearance)",
checkpointException_005: "Delayed (External factors)",
checkpointException_006: "Held for payment",
checkpointException_007: "Incorrect Address",
checkpointException_008: "Pick upwards missed",
checkpointException_009: "Rejected by carrier",
checkpointException_010: "Returning to sender",
checkpointException_011: "Returned to sender",
checkpointException_012: "Shipment damage",
checkpointException_013: "Shipment lost",
checkpointExpired: "Expired",
checkpointInTransit: "In transit",
checkpointInfoReceived: "Info received",
checkpointOrderPlaced: "Club placed",
checkpointOutForDelivery: "Out for delivery",
checkpointPending: "Awaiting",
codeExpiresIn: "Code expires in",
codeSentTo: "Code sent to",
codeWillExpire: "This code will expire in x minutes. If you didn't initiate this request, please let our support agents know.",
confirmed: "Confirmed",
createdAt: "Created at",
customerHasNoOrdersEmail: "No orders establish for this electronic mail",
customerHasNoOrdersPhone: "No orders establish for this phone number",
damagedInDelivery: "My lodge was damaged in delivery",
dec: "Dec",
delivered: "Delivered",
deliveredAt: "at",
deliveredOn: "Delivered on",
deliveredVia: "Shipped via",
editOrder: "Edit order",
email: "Email",
errorFetchingOrders: "An error occurred while fetching your orders",
errorSendingReportIssue: "Something went wrong while sending the report issue.",
estimatedDelivery: "Estimated delivery",
etaProvidedBy: "ETA provided by",
expectToBeDeliveredBy: "by",
failedDelivery: "Failed commitment",
failedFulfillment: "Failed fulfillment",
failure: "Failure",
february: "Feb",
fillYourEmailToTalkToAnAgent: "Fill your electronic mail to talk to an agent",
findOrder: "Find your social club",
fulfillment: "Fulfillment",
fulfillmentDetails: "Fulfillment details",
happyToHelp: "Happy to help, have a smashing twenty-four hours!",
hiFirstname: "Hullo {{firstName}},",
howCanIHelp: "How tin can we help?",
iHaveTheFollowingIssue: "I have the following Issue:",
iWouldLikeToCancelTheFollowingOrder: "I'd similar to cancel the following order",
iWouldLikeToReturnTheFollowingItems: "I'd like to render the post-obit items",
inTransit: "In transit",
inTransitVia: "In-transit via",
incorrectOrder: "I did not receive the correct society",
invalidCode: "Invalid code",
invalidPhoneNumber: "Invalid telephone number",
itemNames: "Item names",
itemsRequestedForReturn: "Items requested for render",
january: "Jan",
july: "Jul",
june: "June",
labelPrinted: "Characterization printed",
labelPurchased: "Label purchased",
lastUpdated: "Last updated",
learnMore: "Learn more",
lostOrderDetails: "Lost your order details? Talk to an agent",
manageYourOrders: "Manage your orders",
march: "Mar",
maxVerificationAttemptsReached: "Maximum verification attempts reached",
may: "May",
needHelp: "Demand more than help?",
noCustomerAssociatedEmail: "No client associated with this email",
noCustomerAssociatedPhone: "No customer associated with this telephone number",
noINeedMoreHelp: "No, I need more than help",
november: "Nov",
october: "Oct",
oneItemSelected: "1 item selected",
order: "Social club",
orderCreated: "Order Created",
orderNotFound: "We have no record of that social club number and e-mail combination. Please try again or ",
orderNumber: "Order number",
orderPlaced: "Society placed",
other: "Other",
outForDelivery: "Out for delivery",
outForDeliveryVia: "Out for commitment via",
partiallyRefunded: "Partially refunded",
pastDeliveryDate: "I'm past my expected delivery date",
payment: "Payment",
pendingDelivery: "Pending delivery",
pleaseRefreshPageToUseChat: "Please refresh your page to continue using the chat.",
pleaseUseVerificationCodeToLogIn: "Please use this verification code to complete your log-in:",
previousConversation: "Previous Conversation",
processing: "Processing",
processingFulfillment: "Processing fulfillment",
provideEmailAndOrderNumber: "Yous must provide an email and an order number",
quantityToReturn: "Quantity to return",
quickAnswers: "Quick answers",
readyForPickup: "Ready for pickup",
reasonCancelOrder: "I'd like to cancel my order",
reasonCancelSubscription: "I'd like to cancel my subscription",
reasonChangeDeliveryDate: "I'd like to change the delivery date",
reasonChangeShippingAddress: "I'd like to change my shipping address",
reasonDidNotReceiveRefund: "I didn't get my refund",
reasonDiscountNotWorking: "My discount code is not working",
reasonEditOrder: "I'd like to edit my order",
reasonEditSubscription: "I'd similar to edit my subscription",
reasonExchangeRequest: "I'd similar to commutation items in my social club",
reasonForgotToUseDiscount: "I forgot to apply my discount code",
reasonIncorrectItems: "The items are different from what I ordered",
reasonItemsMissing: "Some items are missing from my order",
reasonNotHappy: "I'thou not happy with the product I received 👎",
reasonOrderDamaged: "My order was damaged in delivery",
reasonOrderDefective: "The items in my order are defective",
reasonOrderStillNotShipped: "My order should take shipped by now",
reasonOrderStuckInTransit: "My gild has been stuck in transit",
reasonOther: "Other",
reasonPastExpectedDeliveryDate: "I'k past my expected commitment date",
reasonReorderItems: "I'd like to reorder some items",
reasonReplaceItemsRequest: "I'd like to replace items in my social club",
reasonRequestDiscount: "I'd similar a discount lawmaking",
reasonRequestRefund: "I'd like to go a refund for this order",
reasonReturnProduct: "I'd like to render a product",
reasonVeryHappy: "I'yard very happy with the product I received 👍",
reasonWhereIsMyOrder: "Where is my gild?",
refunded: "Refunded",
reportAnIssueWithOrder: "Study an event with an guild",
reportIssue: "Report issue",
requestCancellation: "Request Cancellation",
requestReturn: "Request Return",
resendCode: "Resend code",
return: "Return",
returnItems: "Render items",
returnOrder: "Return an order",
see1MoreItem: "one more item",
see1MoreOrder: "See 1 more order",
seeMoreItems: "{moreItemsCount} more items",
seeMoreOrders: "Encounter {nextPageOrderCount} more than orders",
seeOrders: "Come across your orders",
selectAll: "Select all",
sendCode: "Ship code",
sendUsAMessage: "Send us a message",
sent: "Sent",
september: "Sept",
severalItemsSelected: "{itemsSelectedCount} items selected",
shipmentBeingDelivered: "Order shipment is beingness delivered to its final destination.",
shipping: "Shipping",
shippingAddress: "Shipping address",
shippingInformation: "Shipping data",
showLessItems: "Show less",
signIn: "Sign in",
sincerely: "Sincerely,",
sms: "SMS",
sorryToHearThatEmailNotRequired: "Sorry to hear that! Someone will exist with y'all soon.",
sorryToHearThatEmailRequired: "Lamentable to hear that. Go out us your email and we'll get back to yous.",
sorryToHearThatOfflineEmailCaptured: "Sorry to hear that, we'll get back to you by email.",
sorryToHearThatOnlineEmailCaptured: "I'1000 lamentable to hear that. An agent will exist with y'all in a few minutes.",
startConversation: "Start chat",
stuckInTransit: "My order has been stuck in transit for several days",
subtotal: "Subtotal (Inc. tax)",
summary: "Summary",
supportTeam: "The {{shopFriendlyName}} support team",
talkToLiveAgent: "talk to a alive agent",
thanksOurTeamWillRespond: "Thanks, our squad volition respond soon.",
total: "Full",
track: "Rail",
trackOrder: "Rails an order",
trackingNumber: "Tracking number",
trackingNumberPrefix: "Tracking no.",
trackingUrl: "Tracking Url",
trySigningInWithOrderNumber: "Try signing in with guild number",
unavailable: "Unavailable",
unfulfilled: "Unfulfilled",
verificationCodeField: "6-digit code",
wasThisHelpful: "Was this helpful?",
whatIsWrongWithOrder: "What is wrong with your order?",
yesThankYou: "Aye, thanks",
youWillGetRepliesByEmail: "Thanks! You'll become replies by e-mail.",
youWillGetRepliesHereAndByEmail: "Thanks! Yous'll go replies hither and by email.",
yourEmail: "Your electronic mail",
yourOrders: "Your orders",
yourPhoneNumber: "Your phone number"
}

window.GORGIAS_CHAT_TEXTS = chatDict
GorgiasChat.updateTexts(chatDict)
GorgiasChat.updateSSPTexts(sspDict)
})
</script>

Instructions for Shopify:

Get to your Shopify'south theme.liquid to edit the lawmaking.
1. Navigate to your Shopify dwelling house screen.
2. Click on ' Online Store' on the left.
3. Select Themes → Actions → Edit lawmaking.
4. Under Layout, choose theme.liquid.
Add the code:
1. Re-create the code above.
2. Paste the code at the last line of the text lawmaking box.
Edit the text of the item that you want to alter.
1. For example, yous desire to edit the bulletin input placeholder ("Type a message...").
  1. If you desire to change this, erase the text between the quotation marks.
Click ' Relieve'.

Brandish currently used text values

If you lot wish to brandish the electric current text values, run the following in the console:

window.GorgiasChat.printLabelDictionary()

Toggle the brandish of translation keys/text values in the chat

If y'all wish to display the translation keys in the chat instead of the text values, run the following in the panel:

window.GorgiasChat.showTranslationKeys(true)

In a similar fashion, you lot can go back to text values with the following code:

window.GorgiasChat.showTranslationKeys(false)

Add custom CSS

If you wish to customize the visual aspect of the chat widget, you lot can add additional CSS rules to each of the three following sections: the chat button, chat window, and chat campaigns.

Add the following script to your spider web page where the chat is installed and alter the lines xxxStyle.textContent = '...', replacing the content with your ain CSS rules:

// Use this script to customize the conversation button.
          <script>
          GorgiasChat.init().then(office () {            var timer = setInterval(role () {
            var chatButtonHead = document.querySelector('#gorgias-chat-container')?.querySelector('#conversation-button')?.contentWindow.document.querySelector('head');
            if (![...chatButtonHead?.children].some(x => ten.getAttribute("data-emotion"))) {
            render;
            }
            clearInterval(timer);
                      var buttonStyle = document.createElement('style');
            buttonStyle.textContent = '#gorgias-chat-messenger-button {background-color: orangish; transition: groundwork-colour 200ms ease;}'; // the custom CSS for the chat button
            chatButtonHead.appendChild(buttonStyle);
            }, 50);
            })
            </script>
          // Employ this script to customize the chat window.
            <script>
            GorgiasChat.init().so(part () {
            GorgiasChat.on('widget:opened', function () {
            var timer = setInterval(function () {
            var chatWindowHead = document.querySelector('#gorgias-chat-container')?.querySelector('#chat-window')?.contentWindow.certificate.querySelector('head');
            if (![...chatWindowHead?.children].some(10 => x.getAttribute("information-emotion"))) {
            return;
            }
            clearInterval(timer);
                      var chatStyle = document.createElement('fashion');
            chatStyle.textContent = '.message-window-iframe-1g7otri {box-shadow: none; background-color: lawngreen}'; // window header green
            chatWindowHead.appendChild(chatStyle);
            }, 50);
            })
                      })
            </script>

Replace the chat widget button

Y'all have the power to replace our chat widget push with your own by providing some custom code. The following custom script would replace the original widget button with a custom push element.

<script>
GorgiasChat.init().and so(function () {          
          var timer = setInterval(function () {          
          var chatButtonHead = certificate.querySelector('#gorgias-conversation-container')?.querySelector('#chat-button')?.contentWindow.document.querySelector('head');          
          if (!chatButtonHead?.children.length) {          
          return;          
          }          
          clearInterval(timer);                      var chatButtonIframe = document.querySelector('#chat-button');            
            chatButtonIframe.manner = "brandish:none;"          
                              // supercede our button with your ain var myButton = document.createElement('push');            
            myButton.style = `            
            position: fixed;            
            correct: 100px; bottom: 10px;            
            z-index: 2147483000;            
            width: 50px;            
            peak: 50px;            
            border-radius: 10px;            
            background-color: blue;
            `          
                      // onClick, behave like a chat opener            
            myButton.onclick = function () {            
            if (GorgiasChat.isOpen()) {            
            GorgiasChat.shut();            
            } else {            
            GorgiasChat.open();            
            }            
            }            
            document.body.appendChild(myButton);            
            }, 50);            
});
</script>

Conversation interactions with JavaScript

Configuring the chat with URL query parameters

You may configure the chat behavior with URL query parameters to share such links with your customers.

Let's assume that your store's URL is www.my-shop.com:

Opening the chat automatically

You can make the conversation open automatically on page load by adding the gs_open_chat parameter to your URL (discover the gs_ which stands for 'gorgias'). The resulting store URL is now www.my-shop.com?gs_open_chat.

Setting the default chat page

You can set up a conversation page that will be showing past default for your customers with the query parameter gs_chat_page. The value can be either conversation (for the chat letters page) or homepage (for the cocky-service folio, to fall back to the chat letters page if cocky-service is disabled).

For instance, world wide web.my-store.com?gs_chat_page=conversationsets the conversation folio as the default one. world wide web.my-store.com?gs_chat_page=homepage sets the self-service folio every bit the default 1.

Pre-filling the user bulletin

You can direct your customers to a URL where the chat will have a pre-filled message by using the query parameter gs_chat_message=mymessagewhere 'mymessage' is your custom bulletin. Note that the message must exist URL encoded. For example, the bulletin ' I desire information on product...' must be URL-encoded as I%20want%20information%20on%20product....

The resulting URL to your store would be www.my-store.com?gs_chat_message=I%20want%20information%20on%20product...

Y'all tin apply online tools to encode a string such as urlencoder.org.

Using more than one parameter at the same time

Allow's say that yous want to open the conversation automatically, and as well set the default page every bit conversation, and pre-fill the user bulletin with ' Hi'. You can combine all the parameters together in a single URL past separating them with an ' &'.

For case: www.my-store.com?gs_open_chat&gs_chat_page=chat&gs_chat_message=Hello

Yous are now ready to share these links with your users!

Pre-fill the user message

If you want to pre-fill up the user bulletin input field, you can utilise the following method with a string parameter:

<script>
GorgiasChat.init().and then(part() {
          GorgiasChat.setCurrentInput('Hello !')
})
</script>

Check if the chat is open or closed

You may use the following method to decide whether the chat is in an open or airtight state:

<script>
GorgiasChat.init().then(office() {
          GorgiasChat.isOpen() // Will return true or imitation.
})
</script>

Bank check whether the electric current time is in business organization hours

You may use the post-obit method to make up one's mind whether the chat business hours (as defined in the helpdesk) are displayed correctly. Please just keep in mind that this variable is only trustworthy after chat initialization:

<script>
GorgiasChat.init().then(function() {
          GorgiasChat.isBusinessHours() // Will return true or faux.
})
</script>

Disable the Self-service Portal

If y'all have the self-service features enabled, only you wish to hide self-service on sure pages, it is possible to add the post-obit script to disable the Self-service Portal:

<script>
GorgiasChat.init().then(role() {
          GorgiasChat.disableSSP()
})
</script>

Set the current page of the chat

You can modify the current page of the chat with this method:

<script>
GorgiasChat.init().then(part() {
          // To testify the conversation page.
          GorgiasChat.setPage('conversation')            // To show the self-service screen.            
            GorgiasChat.setPage('homepage') // Notation that the conversation page is showed if the self-service is disabled.
})
</script>

Subscribe to chat events

Sometimes it'south useful to exercise something specific when the chat widget is open up or airtight. You tin employ the example below to do that.

<script>
GorgiasChat.init().and then(function() {
          GorgiasChat.on('EVENT_NAME', function(data) {
          // your code should go hither
          })
})
</script>

Gorgias Chat supports the following events:

A ready event is triggered when the chat is rendered.
A destroy event is triggered when the chat is unmounted.
A message:received event is triggered when a message is received. The data parameter volition contain the message attributes.
A bulletin:sent effect is triggered when a message is received. The information parameter volition incorporate the message attributes.
A message result is triggered when a message is sent or received. The data parameter will contain the message attributes.
An unreadCount event is triggered when the unread bulletin count changes. The data parameter will incorporate the new number of unread messages.
A widget:opened event is triggered when the chat window is opened.
A widget:airtight consequence is triggered when the chat window is closed.
A connected issue is triggered when a connection to the chat server is established.
A disconnected effect is triggered when a connectedness to the chat server is lost.
A typing:commencement event is triggered when an agent begins typing their message.
A typing:stop effect is triggered when an amanuensis stops typing their bulletin.

It is as well possible to deregister an effect listener using the GorgiasChat.off('EVENT_NAME', listener). The listener argument must be the function that was previously registered to subscribe to the event.

Programmatically south terminate a message

To send a message from the user via the conversation programmatically, you may use this method with a string parameter:

<script>
GorgiasChat.init().then(function() {
          GorgiasChat.sendMessage('the message')
})
</script>

Note that if the conversation is notwithstanding closed, the bulletin will wait for the user to open the conversation before sending. If the chat remains always closed, the message will never be sent. If y'all want to send a message no matter what, force the opening of the chat kickoff with GorgiasChat.open up().

Programmatically capture an electronic mail

You may desire to set up the shopper's email programmatically. To do so, nosotros exposed the captureUserEmail method that allows y'all to change the user email associated to the electric current chat conversation.

<script>
GorgiasChat.init().so(role() {
          GorgiasChat.captureUserEmail('user@instance.com');
})
</script>

Programmatically capture the Shopify cart

Yous may want to link a specific cart with the current chat user. To do and so, we expose the captureShopifyCart method that allows you to provide the Shopify Cart of the Shopify user currently using the chat. The cart details volition be displayed in the sidebar of the ticket on the helpdesk awarding.

<script>
async role getCart(url = '/cart.json') {
          const response = look fetch(url, {
          method: 'GET',
          });
          render response.json();
}GorgiasChat.init().and then(role() {
            getCart().then(function(cart) {
            GorgiasChat.captureShopifyCart(cart);
            });
})
</script>

Boosted features

Disable Segment

To disable Segment (a script used to gather analytics) use the following script:

<script>
GorgiasChat.init().then(function() {
          GorgiasChat.disableSegment()
})
</script>

Annotation that it should exist placed at the top of the customisation scripts, so that the script doesn't get triggered by another API request.

Remove the conversation based on country code

This characteristic requires an ipstack business relationship. Free accounts are limited to 5,000 requests. If you lot exceed this limit, you will need to upgrade to a paid account.

If you only work with certain countries yous might want to just handle chat messages coming from those countries. The lawmaking beneath hides the chat for ALL countries except United States (US) and Mexico (MX):

<script src="https://code.jquery.com/jquery-ii.2.4.min.js"></script>
<script>
// gear up your ipstack API key
var ipstackAPIKey = 'YOUR_API_KEY'
// set your country lawmaking whitelist
var countryCodeWhiteList = ['US', 'MX']
// set this to fake if you simply have a costless tier account for ipstack
var useHttps = truefunction removeGorgiasChat(countryCode) {
            GorgiasChat.init().and so(function() {
            var container = document.querySelector('#gorgias-chat-container');
            if (container && !countryCodeWhiteList.includes(countryCode)) {
            container.remove()
            }
            })
}
          var countryCode = window.localStorage.getItem('countryCode')
if (!countryCode) {
            protocol = useHttps ? 'https' : 'http'
            $.ajax({
            url: protocol + '://api.ipstack.com/cheque?access_key=' + ipstackAPIKey + '&fields=country_code',
            dataType: 'jsonp',
            success: function (json) {
            if (json && json.country_code) {
            countryCode = json.country_code
            } else {
            countryCode = 'unknown'
            }
            window.localStorage.setItem('countryCode', countryCode)
            removeGorgiasChat(countryCode)
            },
            error: office (request, condition, error) {
            console.fault(request.responseText);
            window.localStorage.setItem('countryCode', 'unknown')
            removeGorgiasChat('unknown')
            }
            })
} else {
            removeGorgiasChat(countryCode)
}
</script>

Instructions for Shopify:

Get to your Shopify store'south theme.liquid to edit the code.
1. Navigate to your Shopify home screen.
2. Click on ' Online Store' on the left.
3. Select Themes → Actions → Edit lawmaking.
4. Under Layout, cull theme.liquid.
Add the code:
1. Copy the code in a higher place and paste it on the code text box.
2. Enter your ipstack API cardinal where the code says 'YOUR_API_KEY'.
3. Enter the country code/south where y'all only want to display the chat widget where information technology says ['Us', 'MX'].
4. In the part where it says 'var useHttps = truthful', change it from 'true' to 'false' if you're using a free account on ipstack. Otherwise, feel free to just leave it exist.
Click on ' Save'. The chat won't be available to anyone except for shoppers from the countries you entered.

Troubleshooting

Uncaught ReferenceError: GorgiasChat is non defined

This console error means that the Gorgias Conversation code snippet is either missing in the page, or called afterwards the custom script. Lastly, please verify that you are well using the Gorgias chat packet loader version 2 by checking that yous have gorgias-chat-widget-install-v2 in the script.

Uninstalling and reinstalling the Chat from Shopify using the I-click installation tin can crusade this. Delight review the theme files scripts order.

The chat is conflicting with other widgets

If your conversation widget is conflicting or is hidden backside some other elements on the page, like the accessibility widget, rewards widget, etc., irresolute the z-index should overlay the chat on elevation of any other element. To do this, add this code to your site:

<way>
#gorgias-conversation-container iframe#chat-window,
#gorgias-chat-container iframe#chat-campaigns {
          z-alphabetize: 2147483647 !of import;
}
#gorgias-chat-container iframe#chat-button {
          z-alphabetize: 2147483646 !of import;
}
</style>

If you lot are using Shopify, the lawmaking needs to be added under theme.liquid files. Information technology would exist best if you add it somewhere close to the existent chat lawmaking, simply for easier organization.