How to Embed Forms in your Zendesk Help Center

You can use FormCrafts to create awesome Zendesk support ticket forms, as we have seen in this tutorial.

In this tutorial, we will learn how to embed these forms on our Zendesk help center.

Embedding the form

1. Copy the form embed code

Login to your FormCrafts dashboard and edit the form you wish to embed. On the form edit screen go to Share / Embed -> Embed (using JavaScript). Copy the embed code here.

2. Change Help Center settings

Login to your Zendesk help center / Zendesk Guide. Go to Settings and look for the option Display Unsafe Content under Security. Check this option.

Allow embed codes in Zendesk help center

Enabling this is required for FormCrafts to load forms on your help center.

3. Paste the embed code

Now edit the help center article where you want to embed the form. Click on the </> icon, and paste the embed code we copied in the first step. Click Ok and save the article.

This should embed the form on your Zendesk help center.

Embed support ticket form on Zendesk help center / Zendesk Guide

Note: you can also embed the form on a page in your Zendesk help center (like Create a Request page). Instead of editing the article you would edit the template file for that page, and paste the same embed code.

Pre-filling user information

If a user is logged in to your Zendesk Help Center then we can pre-fill their information into the form. This prevents the user from having to manually enter the information again.

Go back to editing your form on FormCrafts.com. Under Settings -> Others check the option Pre-fill fields from parent page.

Add two items.

Under (variable) type in HelpCenter.user.name and under (field) select the name field in your form. This could be an input field in your form or even a hidden field. Do the same for HelpCenter.user.email.

That's it! You don't even need to update the embed code while making these changes.