Adding the Web Widget to a website

Article author
Will Gates

The Web Widget can be added to any page of your website or to your 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).

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 (Manage 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 </body> tag. 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. For information about configuring the Web Widget using JavaScript APIs, see the developer docs.

If the Web Widget does not appear on pages outside your Help Center, you most likely have the Require sign in 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

You can add the Web Widget to your Help Center, so that it appears on every page of your Help Center. If you’re on the Team, Professional, or Enterprise Support plan, you can restrict the pages where the Web Widget appears in your Help Center by using the Web Widget API.

To add the Web Widget to your Help Center

  1. Click the Admin icon (Manage 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.

    Widget snippet

    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 more information, see Customizing your Help Center theme (Guide Professional and Enterprise).

If you’re on the 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.

Was this article helpful?