Adding the Web Widget to your website or Help Center

The Web Widget can be added to any page of your website, or to your Zendesk Support Help Center.

The Web Widget is fully optimized for the mobile experience and does not affect page load times. The widget is presented in the end user’s language, according to the language setting for end user’s web browser. You can force the widget to always appear in a specific language (see Displaying your widget in a different language).

This article contains the following topics:

• Adding the widget to your website
• Adding the widget to your Help Center

Related articles:

• Using Web Widget to embed customer service in your website
• Advanced customization of your Web Widget

You cannot use SSO authentication in the Web Widget itself. However, you can restrict access by setting up SSO on your Help Center, or on the website hosting the widget. See Single sign-on options in Zendesk and Using restricted Help Center content with the Web Widget.

Adding the widget to your website

You can add the Web Widget to any page of your website. After you add the code, you manage changes in Zendesk Support and with the Advanced Customization JavaScript APIs, and updates are reflected in the widget wherever it appears.

To add the Web Widget to your website

1. Click the Admin icon () in the sidebar, then select Channels > Widget.
2. Click the Setup tab, if it is not already selected.
3. Under the code box, click Copy to clipboard.
4. If you want to add the widget to your website, go to the web page where you want to add the widget, then paste the code before the closing HTML </HEAD> tag.

   Inserting the widget code before the </HEAD> tag ensures that the Web Widget API is ready for use by JavaScript in your HTML page. See Web Widget API in the developer docs. If you prefer, you can paste the code before the closing HTML </BODY> tag. In that case, make sure any API method calls occur after the widget code.

   You need to add the code to every web page where you want the widget to appear.

   If you haven't already, make sure you configure the components in your widget.

Tip: If the Web Widget does not appear on pages outside your Help Center, you most likely have the Require sign option enabled in your Guide security settings (see Restricting Help Center access to signed-in end-users).

The Web Widget displays Help Center content that the user is allowed to see. When Require sign in is enabled, and only the Help Center and Contextual Help toggles are on in your Web Widget admin settings, the Web Widget will not load for non-authenticated users. If you enabled other options in your Web Widget admin settings, such as Contact form, the Web Widget does appear.

Adding the widget to your Help Center

Adding the Web Widget to your Help Center also allows you to monitor usage initiated from the widget. For more information on using Insights to track Web Widget usage, see the following articles:

• Analyzing Help Center search results
• Analyzing Help Center community and knowledge base activity

To add the Web Widget to your Help Center

1. Click the Admin icon () in the sidebar, then select Channels > Widget.
2. Click the Setup tab, if it is not already selected.
3. Click the Add to Help Center toggle.

   

   This adds the Web Widget to the Help Center header document_head.hbs, and displays the widget on every page of your Help Center. For information more, see Customizing your Help Center theme (Guide Professional and Enterprise).

If you're on a Team, Professional, or Enterprise Support plan, you can restrict the pages where the Web Widget appears in your Help Center by using the zE.hide() method of the Web Widget API. See Advanced Customization of your Web Widget and the Web Widget API documentation for more information.