Customizing your Help Center theme (Guide Professional and Enterprise)

Return to top
Have more questions? Submit a request

143 Comments

  • Erika Camille Sundian
    Zendesk Community Team

    Hello Mihaly,

    If you want your end-users to be able to add their phone number from the registration form in your Help Center, you can use a custom field for this. You can add custom fields to users under the Admin icon in the sidebar, then select User Fields and make sure that you set it to Editable for end-users and Required to submit request. This will require your end-users to add phone numbers.

     

    0
  • Pedro Reis

    Hi, 

    I want to change the Spanish text due to overlapping, not sure how can I do it on our custom theme. I was able to find the English version, but no idea how to locate the other language we support. Any help will be appreciated

     

    0
  • Elissa
    Zendesk Community Team

    Hello Pedro Reis


    I've done a bit of investigation and have a couple things that should help!

    First, there is not a different location for the different languages. The way it works is the string is written in english and putting the "t" in front of it means "translate this". So having the "t" in front of the string will make it translate into your different languages automatically based on what language the customer is viewing your help center in.

    Second, the string for  "Usuarios a los que les pareció útil: 1 de 6", is not specifically written in the code unfortunately. It shows up as part of this string "{{vote'label' class='article-vote-label'}}". 

    The overlap issue you are seeing is likely actually the result of customizations to your CSS, rather than the article_page.hbs template. So either you could try and work with the custom CSS to fix the issue, or maybe consider removing the string entirely and not have that on your page as shown below. Or (if you have the coding abilities) remove that string and manually code in your own string. These all are just some general ideas though! Customization of code is beyond our realm of support so I can't really say what will work the best or how that will turn out. But hopefully that helps get you some options and on the right track!

     

    0
  • Jordan Dayton

    The existing style.css file is extremely large (4,000+ lines of CSS).

    How can we create a new stylesheet to keep track of our overrides in one convenient custom file?

    Let's say we want to create a file called:  override-styles.css

    Where could we put that file and how could we place the stylesheet to run, after all other CSS?

    e.g. would we put  something like this in the /Head?

    • <link type="text/css" rel="stylesheet" href="__path__/__path_/__path_/override-styles.css">
    0
  • Ifra Saqlain
    Community Moderator

    Hey Jordan,

    You can try these steps:

    Step 1 : Create custom_stylesheet.

    Step 2 : Add that custom stylesheet in your assets folder.

    Step 3 : Map that stylesheet on document_head.hbs or footer_page.hbs template as other libraries::

    <link type="text/cssrel="stylesheet"  href="{{custom_stylesheet.css}}"  />

    You can find your added custom stylesheet in your assets folder on your HC. 

     

    If that's not work after adding on document_head.hbs page then remove there and add on footer_page.hbs page.

     

    I hope it will resolved your query :)

    Thanks

    Team

    1
  • Jordan Dayton

    You nailed it Ifra Saqlain! Thank you so much for those step-by-step instructions!!

    After uploading my file: doc-repo-custom-styles.css to the Assets folder, I saw these options:

    So I used the $assets-doc-repo-custom-styles-css  to replace this bit, in the snippet you provided: {{custom_stylesheet.css}}

    So I simply added the following to my document_head.hbs file:

    <link type="text/css" rel="stylesheet" href="$assets-doc-repo-custom-styles-css" />

    ––––––––––––––––––––––––––––––––––––

    I have one other question... 

    I really wanted a solution that would allow me to manage my custom CSS the same way I'm able to modify the style.css file that's natively in my ZD theme. 

    Doing this method of adding an external .css file to my "Assets" folder is not quite ideal b/c I can't edit the CSS in the system. I can only edit the file externally, then "replace" the existing file. 

    So my question comes back to... can I create AND REFERENCE a custom CSS file, that is editable in ZD, like the original style.css file?

    If not... then I wonder if there are other options like a github repo that auto syncs with the ZD and we can just keep our repo updated. ¯\_(ツ)_/¯ 

    But again... i think the best solution would be to be able to natively mod the CSS in ZD.

    0
  • Ifra Saqlain
    Community Moderator

    First thing is you need add custom stylesheet like this on document_head.hbs template:

    <link type="text/css" rel="stylesheet" href="{{asset 'assets-doc-repo-custom-styles.css'}}" />

     

    In the case of GitHub, I didn't try that kind of process as you explained above that update custom stylesheet by github but yes you should try that process and I'm sure that would work :) 

     

    0
  • Dan

    How does this feature relate to Team level account?

    On support pricing page I see Essential, Team, Pro, Enterprise, Elite - so where does this feature stand for Essential and Team? assuming Pro+ have access to it

    0
  • Dan Ross
    Community Moderator

    Hey Dan. This is separate from the Zendesk Support plans (essential, team, pro etc). Guide is a separate product from Zendesk has its own package tiering. In this case, you need Guide Pro or Guide Enterprise, these are separate from whatever Zendesk Support package you have.

    0
  • Timo Klok

    Hi,

    Is there a way to change the localized term for 'request' in in Guide customer interface? In Dutch it's 'aanvraag', and it doesn't really suit our company/usecase. I figured this is not something that can be set in a theme, or is it?

    0
  • Karen Snyder
    Community Moderator

    Timo Klok

    This article explains how to rename and translate default links in the Help Center, which I believe is what you're looking for.

    0
  • Timo Klok

    Thanks Karen. I was hoping there was a single place where I could change the translation for "request", instead of having to change the text of all links seperately. But your suggestion will also work!

    0
  • Karen Snyder
    Community Moderator

    Hi Timo, the article also mentions using a dynamic content helper. In that case, you would have to change the text of all the links to use the dynamic content helper, but then you would need to put the translation in only one place, in the dynamic content helper.

    0
  • george jackson

    Hi,

    I want to have 2 different ticket forms presented to users at 2 different url's. Each form would also use a different theme (so that I can use different code). How can I do this?

    Thx.

    0
  • Dan Ross
    Community Moderator

    @ gil alvarez
    This sounds like something you might want to look at the Multibrand feature for. You can have Guides with different URLs, code and form configurations

    0
  • Anais

    Hi,

    Where do we upload images to customize the helpcenter's homepage ?

    I would like to add pictos.on some buttons. 

    0
  • Brett Bowser
    Zendesk Community Team

    Hey Anais,

    I was able to track down the following community tip that may help point you in the right direction: Adding Navigation Images to Help Center (with use of dynamic content)

    You can also find a full list of useful Guide tips here: Guide community tips for Help Center

    Cheers!

    0
  • Anais

    Hey Brett,

    Thanks for your prompt assistance.

    I feel dummy but I haven't found where and how to upload images yet in your links.

    In Adding Navigation Images to Help Center (with use of dynamic content), it is written 'The images are hosted on our own server. ' and in another article titled 'Adding icons into your theme ', they are using Font Awesome CDN.

    Do I have to understand that there's no possibility of uploading images to Zendesk server ? (Actually I uploaded images in an article visible only to agents, but apparently end-users don't see these images).

    I wonder if I upload them via an article visible to end-users and put "display:none" in that article that would work...

     

     

    0
  • Marci Abraham

    Hey @... you might be looking for the "assets" folder...which took me forever to locate! lol 

    When you are editing your theme, you'll find it on the right sidebar. When you open it, you'll see a link to "Add asset" and that's how you upload an image. Then you can use that image for whatever purposes you need it.

    If that's not what you're looking for...well maybe it will help someone else like me who was hunting all over tarnation for this simple option ;-)


    2
  • Anais

    Hey Marci,

    Yes, yes, that was exactly what I was looking for !!!

    And I was about to be desperate !

    I find it crazy that it's written nowhere in Zendesk's documentation or so hard to find...

    Thank you so much Marci !!!

    I think you will be saving many people's time !

     

    0
  • Marci Abraham

    Awesome! Glad I could help :)

    And I agree...sometimes the documentation of the simplest things seems to be missing. Yesterday I clicked through 3 different articles that had links to "see this article for how to do X" embedded in them, but never found that any of them actually showed me the steps to do X...they were all just explaining more about the concept, not the steps. 

    If the documentation team is listening...it would be great to have a whole section of the HC dedicated to just "how to" steps with screenshots :)

    1
  • Pablo Gomez

    Hi!

     

    Where can I edit the {{name}} expression? I'm looking at replacing every instance of "Request(s)" with "Case(s)". In the Requests page (requests_page.hbs), I see {{name}} being used to pull in My Requests and Requests I'm CC'd on. Ideally I'd like to change this to My Cases and Cases I'm CC'd on.

    Is this possible by changing the {{name}} expression for the Requests Page or is there another method of doing so?

    0
  • Chris Stock
    Community Moderator

    Hi Pablo Gomez, I don't think it's possible to change the value for the {{name}} helper. It's part of the Filters object and it also contains all the baked-in translations as well.

    I think you have two options, one is to use javascript to change the text after the elements have been loaded (not ideal as there might be a slight delay as the name is updated). The second is to hard code the names of the filters rather than using the helper.

    0

Please sign in to leave a comment.

Powered by Zendesk