How can I link my help center to my website?

Question

How can I link my help center to my website? I want to redirect my customers to my help center when they click on the Contact button on my website.

Answer

You can link your help center to your website by making changes to the website's code and brand your current help center theme for a seamless experience. There are three steps to achieve this workflow:

1. Customizing your help center
2. Host mapping (optional)
3. Linking your website to your help center

Customizing your help center

Customize the theme of your help center by adding a logo, a home banner, and by changing the theme's colors. For more information, see this article: Branding your help center. For more advanced customizations, access the page templates to edit the HTML, CSS, and JavaScript of your help center. / theming center and edit the Help Center's HTML, CSS, and Javascript templates. For more information, see this article: Customizing your help center theme.

Host mapping (optional)

By default, the address of your help center contains your Zendesk subdomain, such as "mycompany" in mycompany.zendesk.com. However, you can map a subdomain of your own domain, such as support.mycompany.com, to your default Zendesk address. This way, your customers will not see your Zendesk subdomain. This is called host mapping and for more information on this, see this article: Host mapping - Changing the URL of your help center.

Linking your website to your help center

Link your help center on your website. If you don't feel comfortable working with HTML, reach out to an experienced web designer to assist you. Generally, your website may have a 'Contact' or 'Support' button located in the navigation bar, which you can link to your help center. An example of what this looks like can be found below.

A navigation bar is basically a list of links, so these HTML elements are normally used <ul> and <li>. The HTML <a> element, the anchor element, creates a hyperlink to other web pages, files, locations within the same page, or any other URL.

Here is an example of the HTML code which is usually located in the header:

<ul>
<li><a href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#support">Support</a></li>
<li><a href="#about">About</a></li></ul>
</ul>

To set up a redirect, replace the part <a href="#support"> with <a href="https://mysubdomain.zendesk.com/hc/en-us">. 

The example below shows how this would look within the code block, using a host-mapped domain. 

<ul>
<li><a href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="https://support.games.com/hc/en-us">Support</a></li>
<li><a href="#about">About</a></li></ul>
</ul>

If the 'Contact' or 'Support' button is not present, add one quickly into your navigation bar following the steps above.

Disclaimer: The solution below is an example of one way you might update the code on your website, which Zendesk does not support or guarantee. Post any issues you have in the comments section or try searching for a solution online.