Question
How can I link my Help Center to my website? I want to redirect my customers to my Help Center (e.g. mysubdomain.zendesk.com/hc/en-us) when they click on the "Contact/Support" 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. This can be done by:
1. Customizing your Help Center
If you are looking to style your Help Center to match your company's branding guidelines, you can start with customizing your theme by adding a logo, a home banner and change theme's colors. For more advanced customizations, you can access the Theming Center and edit the Help Center's HTML, CSS and Javascript templates. Refer to these articles for more information:
2. Host Mapping (optional)
The next step is to customize your Help Center’s domain to look like your own domain URL. 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, so customers will not see your Zendesk subdomain. This is called "host mapping", for more information on this see Changing the address of your Help Center subdomain (host mapping).
3. Linking your website to your Help Center
The final step is to link to your Help Center in your website. If you don't feel comfortable working with HTML, we would suggest to reach out to an experienced Web Designer to assist you with this task. Generally, your website may have a "Contact/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 (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 setup a redirect, you will want to 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/Support" button is not present, you can add one quickly into your navigation bar following the steps above.
13 Comments
Is there any option to link back to my homepage from the help center? F.e. I like to link to my main hompage by clicking on the logo instead to the help center?
Hello,
There is indeed a way to do this! :)
You will need to adapt your Help Center code a little bit to make this work. Below you will find some simple instructions which should help you get started, however I would recommend to reach out to a Web Designer if you need further assistance:
1. Go to your "Guide Dashboard > Guide Admin > Customise Design > View Theme > Edit Code".
2. Next, if you are using our standard theme (Copenhagen) just simply open the template "header.hbs" and adapt the following section (screenshot):
3. Basically, you will need to replace the Link Helper (e.g. link 'help_center' - more about this Helper here) with the code shown below:
Note: Where you see the URL for Google, just paste your own URL here.
4. Click now on "Publish" to save your changes.
Hopefully this helps!
Awesome!!! Thank you :)
fantasitc!!!
I love this idea above and i suck at html - QUESTION: How can i achieve the same (a link to a outside page) as a new header item (rather than having the logo link the to there)? Is that possible?
If not via that method, then maybe a button?
I would like to add a link to my Feature Request intake form form Smartsheet.
Any help would be appreciated :)
Hi Mark!
Just to clarify...do you mean that you'd like that link to appear alongside the "Community", "Submit a Request", and "Sign in/user profile" links at the top of your Help Center?
Hi,
Thank you for a great question and great answers!
A bit of a deviation from the main question here, but I reacted to "link my Help center to my site".
Can you help me understand if there is a way to embed links to Help Center articles into my site so that people could click the link and get navigated to a specific article, but without any additional sign-in to Help Center? They are already signed in into the site.
If this has been already discussed, I would really appreciate the links to these resources. I haven't managed to sift through all the search results I get for "embed links" or "authorization".
Regards,
Elena
Hi Elena!
Are the articles on your site restricted so only signed in users can see them? If not, you can just add the links to your site using HTML and direct the link to the URL of the article you wish.
Thanks for the replies - I was able to pull this off in both the header and on the home page itself in my rudimentary code:
Header:
<nav class="user-nav" id="user-nav">
<a href='https://mywebsitelink'>New Feature Request</a>
And on the Home page:
<div class="container">
<h2 style="display: block; text-align: center; margin: 10px 100px 10px 100px; font-size: 14px;" >
<a href='https://mywebsitelink'>New: Click Here to submit a NEW FEATURE request</a><h2>
</div>
Hi Mark! I'm glad you were able to get it working.
Thanks for sharing your solution!
How can I include a link to my Website from my Help Centre without customizing the Copenhagen theme?
I liked the solution suggested by Mayda above but this means missing out on theme updates etc. and I don't have skill/resource to manage that manually.
Thanks!
Hey Adam,
I'm afraid there's no way to link to your external website outside of editing your Guide theme. For additional guidance on how to customize your theme, you'll want to take a look at the following article: Customizing your Help Center theme (Guide Professional and Enterprise)
Let me know if you have any other questions!
Hey Ursula,
Are you still experiencing issues with the above code provided by Mayda? Any chance you could provide a screenshot of the error you're receiving as that may help others jump in and provide a solution.
I've also attached some useful articles that may help below:
Customizing your Help Center theme (Guide Professional and Enterprise)
Help Center CSS Cookbook
Help Center Templates Introduction
Help Center Javascript Cookbook
Tips for using HTML to customize your Help Center
Cheers!
Please sign in to leave a comment.