Integrating Zight with Zendesk Forms

Overview

Zight enhances Zendesk Forms by allowing seamless integration of customer videos directly into support forms. This integration is ideal for support teams looking to streamline communication and improve customer service efficiency by reducing unnecessary back-and-forth interactions.

• Quickly capture customer issues with video support.
• Improve response times and service quality.
• Enhance user interaction with visual feedback.

Including the Zight Snippet in footer.hbs

In your form's footer.hbs, you need to include the following script once you have your API_KEY and added the allowed hosts (the urls in which you will add the snippet to). It can be found under Zight's settings (go to https://share.zight.com/account/settings/profile then navigate to "API Keys"

<!-- Zendesk Forms --> <script src="https://downloads.zight.com/webrecorde

Video Tutorials

Watch our comprehensive video tutorial to guide you through the integration process step-by-step.

Here is a 5-minute video walkthrough:

Steps to Integrate

1. Introduction

   Add a script tag to your Zendesk template to enable Zight integration.

2. Navigate to the Knowledge Center

   Go to the Knowledge Center to begin your integration.

3. Access the Knowledge Admin

   Close any previews and navigate to the Knowledge Admin for your team.

   

4. Edit the Footer Code

   Find and edit the footer.hbs file in your code to add the script.

   

5. Paste the Script

   Insert the following script at the bottom of the footer file:

   <!-- Zendesk Forms --> <script src="https://downloads.zight.com/webrecorder-launcher/latest/webrecorder-launcher.js" data-api-key="API_KEY"></script>

   

6. Set the API Key

   Ensure the API key is correctly set in the script's data attribute.

   

7. Obtain an API Key

   Create or obtain your API key from your account under API Keys.

   

8. Copy and Use the API Key

   Ensure domain settings are correct to avoid 403 errors and use the copied key.

   

9. Verify the Button Visibility

   Initially, confirm that the button is not visible in the request creation process.

   

10. Verify Loading

    Check that the script loads correctly to confirm the API key is functional.

    

11. Publish Changes

    Save or publish the changes to update the button label.

    

12. Test the Recording

    After recording, ensure the shareable URL is inserted into the editor.

    

Tips & Best Practices

• Ensure your API key is securely stored and not exposed in public code.
• Regularly update the script to the latest version for optimal performance.
• Test the integration in a staging environment before deploying to production.

Troubleshooting

• If the button is not visible → Ensure that the script is correctly placed in the footer.hbs file.
• Receiving 403 errors → Verify that the domain settings are correct for the API key.
• Script not loading → Check the console for errors and ensure the API key is accurate.

See the full video: https://share.zight.com/kpuxzz85?sa=step_by_step_guide