Add Support Chat Widget to Branded Tracking Page
Plans: Premium, Enterprise Standard, Enterprise Advance Platforms: All platforms
Add AfterShip Tracking’s Support Chat Widget to your branded tracking pages to reduce the number of support calls and improve customer satisfaction while they track their orders.
By enabling the Chat Support Widget, customers have the opportunity to chat with a live support agent for a faster, easier resolution to their order-related questions and concerns, leading to an overall better experience. When the help widget is active, it will appear in the bottom right corner of your branded tracking pages.
Only the Admin, Owner, and Manager can edit the tracking page
The Support Chat Widget is available only for the Sake and Hero themes
In this article, we will show you:
Add a support chat widget
Link a webpage to the chat button
Install Zendesk Web Widget
Install Gorgias Chat Widget
FAQs
Go to Tracking pages > Page variations in the AfterShip Tracking admin
Select the tracking page to which you want to add the chat widget. Click Actions > Edit
On the side panel, click the second option, Widgets > Add widget > Support chat button
The support chat widget will open. Configure the following settings to activate the chat support button on your tracking page
Chat type: AfterShip’s tracking page editor supports three types of chat support options
The Chat page option allows you to add a link to your website’s chat page URL, Q&A page, contact us page, or FAQs section to allow customers to self-resolve their queries or reach out to you via the chat button, in case they need further assistance.
Add the Chat page URL where you want to redirect customers for assistance
The support chat button will only appear on your tracking page when a valid chat page URL is entered in the given field.
Edit the Button text (optional) that will appear on the chat support button
Upload an icon for the chat button to make it more visually appealing. AfterShip provides you with a default icon image, in case you don’t have one available right away
You can replace image to add a new one or remove image if you don’t want any
Choose the position of the chat button on the tracking page
Hit Save
The Zendesk Web Widget allows you to install the Zendesk’s messaging web widget to your tracking page as a chat support option to help customers the moment they need it on your website and connect with a live support agent for assistance they need.
We support Zendesk’s messaging Web Widget and Web Widget Classic.
Select Zendesk Web Widget as the Chat type from the dropdown
Add the Zendesk Web Widget code in the defined field, which can be found in your Zendesk account
Follow the instructions below to find the Zendesk’s messaging web widget code for both Web Widget and Web Widget (Classic) users.
1. Web Widget User
Installing the Web Widget on branded tracking page requires some basic familiarity with your website's code. Following instructions apply to accounts using the messaging Web Widget
To find the Web Widget code
In Admin Center, click Channels in the sidebar, then select Messaging and social > Messaging
You can select the existing widget to install
Scroll down to the Installation tab, and click Copy code at the bottom of the code snippet frame
Navigate to the Style tab, and customize the style of the button and header that synchronize with your branded tracking page.
Paste the copied web widget code on the AfterShip’s tracking page editor under the Widget code section
You can create a new widget to install
Click Add channels
Click the Copy icon at the bottom of the code snippet frame
Customize the Style of the button and header that synchronizes with your branded tracking page.
Find more instructions here
2. Web Widget (Classic) User
Installing the Web Widget on branded tracking page requires some basic familiarity with your website's code. Following instructions apply to accounts using the messaging Web Widget Classic version
To find Web Widget (Classic) code:
In the Admin Center, click the Channels icon in the sidebar, then select Classic > Web Widget
Click the Setup tab, if it is not already selected
Under the code box, click Copy to clipboard
Configure components in Web Widget (Classic) by following the Zendesk instructions , following is the snippet of info that you can configure:
Help center search and suggested articles
Zendesk Chat for live chat with a support agent
Zendesk Talk for requesting a callback from an agent or viewing a phone number to call
Contact forms for filing a ticket for order-related queries
Style including Theme color, Theme text color, Web Widget button text etc.
Find more instructions here
Select Gorgias Chat Widget as the Chat type from the dropdown
Add the Gorgias Chat Widget code in the defined field, which can be found in your Zendesk account
Installing the Web Widget on branded tracking page requires some basic familiarity with your website's code.
To find Gorgias Chat Widget:
Navigate to Settings > Channels > Chat
Click Installation tab
Click the arrow next to the Manual installation section at the bottom to expand the custom instructions.
Click Any other websites
Click Copy code
Customize the Appearance of the button and header that synchronize with you Branded tracking page. Following are the info you can customize:
Edit the chat title and select the language
Pick your chats’ main color along with the conversation color and font
Upload your company logo
Position the chat widget's placement on your page
Choose the avatar for the support agents and configure settings accordingly
Customize the Preferences as your requirements
Tips:
Hide your chat outside of your business hours
Configure your Auto-Responder
Pick the associated email integration with your chat
Find more instructions here
This could be because of the following reasons
A. You must have configured your Visibility option to “Hide chat” or “Hide outside of business hours” at your Gorgias or Zendesk admin
For example, if you select Hide outside of business hours, AfterShip Tracking will not display the chat button at Editor, Preview or the Live page.
Zendesk
Gorgias
B. You have enabled Allowlist, but you have not included AfterShip’s site inside.
It takes somewhere around 10-20 minutes to sync the changes to your tracking page from Zendesk and Gorgias.
Overview
Add AfterShip Tracking’s Support Chat Widget to your branded tracking pages to reduce the number of support calls and improve customer satisfaction while they track their orders.
By enabling the Chat Support Widget, customers have the opportunity to chat with a live support agent for a faster, easier resolution to their order-related questions and concerns, leading to an overall better experience. When the help widget is active, it will appear in the bottom right corner of your branded tracking pages.
Additional considerations
Only the Admin, Owner, and Manager can edit the tracking page
The Support Chat Widget is available only for the Sake and Hero themes
What you’ll learn
In this article, we will show you:
Add a support chat widget
Link a webpage to the chat button
Install Zendesk Web Widget
Install Gorgias Chat Widget
FAQs
Add a support chat widget to the tracking page
Go to Tracking pages > Page variations in the AfterShip Tracking admin
Select the tracking page to which you want to add the chat widget. Click Actions > Edit
On the side panel, click the second option, Widgets > Add widget > Support chat button
The support chat widget will open. Configure the following settings to activate the chat support button on your tracking page
Chat type: AfterShip’s tracking page editor supports three types of chat support options
A. Link a webpage to the chat button
The Chat page option allows you to add a link to your website’s chat page URL, Q&A page, contact us page, or FAQs section to allow customers to self-resolve their queries or reach out to you via the chat button, in case they need further assistance.
Add the Chat page URL where you want to redirect customers for assistance
The support chat button will only appear on your tracking page when a valid chat page URL is entered in the given field.
Edit the Button text (optional) that will appear on the chat support button
Upload an icon for the chat button to make it more visually appealing. AfterShip provides you with a default icon image, in case you don’t have one available right away
You can replace image to add a new one or remove image if you don’t want any
Choose the position of the chat button on the tracking page
Hit Save
B. Install Zendesk Web Widget
The Zendesk Web Widget allows you to install the Zendesk’s messaging web widget to your tracking page as a chat support option to help customers the moment they need it on your website and connect with a live support agent for assistance they need.
We support Zendesk’s messaging Web Widget and Web Widget Classic.
Select Zendesk Web Widget as the Chat type from the dropdown
Add the Zendesk Web Widget code in the defined field, which can be found in your Zendesk account
Find Zendesk Web Widget code
Follow the instructions below to find the Zendesk’s messaging web widget code for both Web Widget and Web Widget (Classic) users.
1. Web Widget User
Installing the Web Widget on branded tracking page requires some basic familiarity with your website's code. Following instructions apply to accounts using the messaging Web Widget
To find the Web Widget code
In Admin Center, click Channels in the sidebar, then select Messaging and social > Messaging
You can select the existing widget to install
Scroll down to the Installation tab, and click Copy code at the bottom of the code snippet frame
Navigate to the Style tab, and customize the style of the button and header that synchronize with your branded tracking page.
Paste the copied web widget code on the AfterShip’s tracking page editor under the Widget code section
You can create a new widget to install
Click Add channels
Click the Copy icon at the bottom of the code snippet frame
Customize the Style of the button and header that synchronizes with your branded tracking page.
Find more instructions here
2. Web Widget (Classic) User
Installing the Web Widget on branded tracking page requires some basic familiarity with your website's code. Following instructions apply to accounts using the messaging Web Widget Classic version
To find Web Widget (Classic) code:
In the Admin Center, click the Channels icon in the sidebar, then select Classic > Web Widget
Click the Setup tab, if it is not already selected
Under the code box, click Copy to clipboard
Configure components in Web Widget (Classic) by following the Zendesk instructions , following is the snippet of info that you can configure:
Help center search and suggested articles
Zendesk Chat for live chat with a support agent
Zendesk Talk for requesting a callback from an agent or viewing a phone number to call
Contact forms for filing a ticket for order-related queries
Style including Theme color, Theme text color, Web Widget button text etc.
Find more instructions here
C. Install Gorgias Chat Widget
Select Gorgias Chat Widget as the Chat type from the dropdown
Add the Gorgias Chat Widget code in the defined field, which can be found in your Zendesk account
Installing the Web Widget on branded tracking page requires some basic familiarity with your website's code.
To find Gorgias Chat Widget:
Navigate to Settings > Channels > Chat
Click Installation tab
Click the arrow next to the Manual installation section at the bottom to expand the custom instructions.
Click Any other websites
Click Copy code
Customize the Appearance of the button and header that synchronize with you Branded tracking page. Following are the info you can customize:
Edit the chat title and select the language
Pick your chats’ main color along with the conversation color and font
Upload your company logo
Position the chat widget's placement on your page
Choose the avatar for the support agents and configure settings accordingly
Customize the Preferences as your requirements
Tips:
Hide your chat outside of your business hours
Configure your Auto-Responder
Pick the associated email integration with your chat
Find more instructions here
FAQs
1. The support chat widget isn't showing on the tracking page after adding the Zendesk and Gorgias web widget code
This could be because of the following reasons
A. You must have configured your Visibility option to “Hide chat” or “Hide outside of business hours” at your Gorgias or Zendesk admin
For example, if you select Hide outside of business hours, AfterShip Tracking will not display the chat button at Editor, Preview or the Live page.
Zendesk
Gorgias
B. You have enabled Allowlist, but you have not included AfterShip’s site inside.
2. The chat button Preferences I’ve set at Zendesk andGorgias are not reflecting on my tracking page.
It takes somewhere around 10-20 minutes to sync the changes to your tracking page from Zendesk and Gorgias.
Updated on: 03/02/2024
Thank you!