Articles on: Branded Tracking Page

Add Support Chat Widget to Branded Tracking Page

Plans: Premium, Enterprise Standard, Enterprise Advance Platforms: All platforms


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 to the tracking page


  1. Go to Tracking pages ** > **Page variations in the AfterShip Tracking admin



  1. Select the tracking page to which you want to add the chat widget. Click Actions > Edit
  2. On the side panel, click the second option, Widgets > Add widget > Support chat button



  1. The support chat widget will open. Configure the following settings to activate the chat support button on your tracking page
  2. 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


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.


  1. Select Zendesk Web Widget as the Chat type from the dropdown
  2. 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


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


  1. 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:



  1. Help center search and suggested articles
  2. Zendesk Chat for live chat with a support agent
  3. Zendesk Talk for requesting a callback from an agent or viewing a phone number to call
  4. Contact forms for filing a ticket for order-related queries
  5. Style including Theme color, Theme text color, Web Widget button text etc.


Find more instructions ** here **


C. Install Gorgias Chat Widget



  1. Select Gorgias Chat Widget as the Chat type from the dropdown
  2. 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.


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


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


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


  1. Zendesk



  1. 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: 18/07/2024