Tips for using HTML to customize your knowledge base in Help Center

Have more questions? Submit a request


  • Brian Adkins

    Wow... we just switched to Help Center and the article formatting is terrible.

    In the old portal, I could click on some text and the formatting bar would tell me which heading style was used... no longer the case... you'll have to guess, reformat to test, or switch to html view and then search for your text to find out.

  • Andy Hoover

    I'm seeing the same thing as Oliver above--the articles as displayed don't completely correspond to the HTML I put in there.

    Also, I find that it's adding HTML tags that weren't in my original.

    For example, I have some unordered lists (<ul>) nested inside an ordered list (<ol>), but after I paste my html into the html box, when I open it again and view the html, there's yet another layer of <ul> nested in between, and it throws off the formatting I want to achieve. Is there a way to keep it from adding additional html tags, and just use the html I pasted in there the way I pasted it? And display the headings correctly?

  • Adam Meehan

    Hey Andy!

    Thanks for your feedback. I'd like to go ahead and explore your issue with tags being added erroneously in the WYSIWYG editor and try to work toward a solution with you, however my findings are quite a bit longer than is usual for a Help Centre response so I've gone ahead and opened a new ticket for us to resolve it in.

    Have a great week,

  • Julia Poulsen

    Was able to successfully change "Submit a request" to "Report and Issue" in the header using JS but cannot change the "Submit a Request" text on the body of the submit a request page.

    I can't seem to find where to edit the HTML.


  • Jessie Schutz

    Hi Julia!

    You'll need to use the drop down menu at the top left of the theme editor and select the New request page.

    The exact line that bit of code will show up on will probably vary depending on the theme you're using. All you have to do is edit the bit inside the curly brackets:

    Just make sure that you're previewing that page as an End-user; otherwise you won't be able to see it.

  • Mark Johnson

    I think the anchor part of the guide needs updating, the 'name' attribute no longer works and we have to use 'id' attribute instead. 

    for example:
    An anchor should be marked up as {{<a id="fragment-name"></a>}}.
    It's hyperlink would be {{<a href="#fragment-name">Go to anchor</a>}}.

  • Chellie Esters

    @MarkJohnson when did you realize the 'name' attribute stopped working? I have tried using 'id' instead but because I use bootstrap popover links 'id' tags do not work properly.

  • Mark Johnson

    Hey @Chellie, it was when we recently re-branded our help-centre, so i'm not sure if it's related to a newer theme that we're using or...? But our anchors stopped working - and were previously configured as described in the article. 

    My dev team gave me this info:

    "If I recall correctly, using the {{name}} attribute in anchors used to be the de facto way in the past (in earlier versions of HTML/XHTML) and may still be supported on older browsers. However, as browsers get updated over time, they begin to drop certain deprecated syntax; like the {{name}} attribute in {{<a>}} which no longer exists in the latest version of HTML.

    The way to mark up anchors in future would be to use {{id}} attribute instead of {{name}}.
    For example:
    An anchor should be marked up as {{<a id="fragment-name"></a>}}.
    It's hyperlink would be {{<a href="#fragment-name">Go to anchor</a>}}. "

  • Chellie Esters

    @MarkJohnson thanks for that info. Now that you've mentioned it, I do recall 'name' being identified as a depreciated HTML tag, which is what prompted me to research 'id' instead (months ago). There was something weird with using 'id' with Bootstrap popover links, which forced me to put it on hold.

    And yes, I agree, ZD's doc info needs updating.


  • Joe Bertoncin

    I've added a border to my picture by editing the source code of my article. The border shows in Edit mode:

    However, when I publish the article, no border exists:

    This has been tested in the latest versions of Chrome, Firefox, and IE, with the same result.

    My source code:
    <img style="border: 1px solid black;" src="/hc/en-us/article_attachments/218308267/ExamplePicture.png" />

    Can anyone explain this phenomenon and describe a fix?  Thanks in advance.

  • Chellie Esters

    @joebertoncin what code are you using for borders? (Edit: you updated your post with your code after I posted this, so I see it now.)

    Try this: <img style="border: 2px solid #b3b3b3;" src="/hc/en-us/article_attachments/0000000/yourimage.png" alt="Alt Title" width="xxx" height="xxx" /> (Edit: our code looks the same, you're not doing anything different.)

    Personally, I apply borders on the image itself and then import it with the border into the article. Border placement via HTML doesn't give me exactly what I want every time.

    Hope that helps.

  • Joe Bertoncin


    Hello. Thanks for the tip, but I got the same result. Border shows in edit mode, but does not transfer when published.

    My preferred method is adding a border in the article because a border within the image can get ugly when the image is resized.

  • Chellie Esters

    @joebertoncin: That's odd because it showed up in publish for me.

    I found this article that states the border tag is depreciated. Maybe browsers are quietly updating code to get rid of them? The same issue popped up (right above your initial question) on the 'name' tag.

  • Joe Bertoncin


    Thanks. I may have to go to borders within pictures, after all. I appreciate your help.

  • Vanessa Zambale

    Embedding a video didn't seem to work for me. I was able to embed the video and it shows during edit mode, however, it doesn't show when I preview.


  • Debbie van Cleef

    Hi! I am confused about the editor in HelpCenter.

    In Communities (like this forum) users can format text using the Paragraph styles button. When editing an article in the Knowledgebase the editor is different. The only option to format text is by using the Sizes combobox. This doesn't give the <h2> tags we want.

    2  questions:

    1. Why do you use different editors between knowledgebase and communities?

    2. Viewing the source code should be an option to work directly with HTML tags. However the source code editor is very much unworkable. Especially with large articles. Isn't it possible to use colours to identify the different tags? Like in Notepad++?



  • Joe Bertoncin

    You should be able to edit your code in Notepad++, then copy/paste it into Zendesk. You'll lose any code formatting (indentations, e.g.), but the code should work.

    It's not a perfect fix, but at least you can make the task of editing easier.

  • Tiffany McCluskey


    For all of you guys that are able to see your content when editing but not when published, make sure you're allowing unsafe content in your Help Center. As soon as I did all of my embedded PDFs displayed perfectly. (iframes)

    General > Help Center Settings > Display Unsafe Content

    Hope this helps!


  • Nicole - Community Manager

    Thanks for sharing, Tiffany!

  • Paul Wanless

    I had a question about the customization of the current Help Center Source code editor. 

    Is there a way to prevent the <p> element from automatically wrapping other elements or removing additional elements? 

    This is an annoyance to customize some of the articles as there doesn't seem to be anything apparent to override this. Any help would be welcomed.

  • Khoa Cao


    I added a hyperlink with (href: TEL and SMS) by editing the source code of article, and links not work, please help.

    - <a href="tel:XXXX">XXXX</a>

    - <a href="sms://XXXX">XXXX</a>


  • Vassilios Lourdas

    Hello, can't you implement an easier way to create anchor links without going to the HTML editor? :) Thanks!

  • Jessie Schutz

    Hi Khoa! Welcome to the Community!

    This is a really interesting question; I haven't actually tried to link to phone numbers in HTML before, so I had to do some poking around online. I learned today!

    What I was able to find out is that you need to format the number with a '+' and the country code. So, for a US number, I would code this is as:

    <a href="tel:+1-608-555-0000">Call us!</a>


    <a href="sms:+1-608-555-0000>Text us!</a>

    Based on what I read, this should do the trick!

  • Drew Hayes

    Has anyone found a way to wrap text around images? When I use standard HTML or CSS that would typically allow image wrapping, it looks fine on the Edit screen, but when I Update the article, the images are just inserted into the text and nothing is wrapped. 

    Anyone found a way to resolve this? 

  • Andrew J

    @Drew - I normally just HTML edit and add 'float:left' etc.

    How are you doing it?

  • Andrew J

    @Drew, a screenshot of the code and result would help.  Do you have the option checked as below?

  • Keith @ Zendesk

    It depends on how it's done.  @Drew does it change upon being published?  Are you putting in the CSS as the file or are you trying to do it inline in the article?

  • Tom

    Suggestion: consider avoiding the word "simply" ("Creating anchor links", step 3.1)

    I'm very new to HTML and none of this seems simple to me. Reading that word when I'm trying to wrap my mind around a new concept for the first time is a little alienating.

  • Cyrup

    Every time I've anchored text in Zendesk to other section of the page when selecting the link to jumps down the article and places you visually well below the link is. See this article for example: 


    How can this be fixed

  • Annie Ashenfelter

    Zendesk has changed the way anchor links are handled in Guide articles, and this has negatively impacted how I insert them.
    I have been following the instructions noted in the #anchor section above (which applies this same feature)

    In this way, I could insert source code:
    <p><a name="text"></a></p>
    And then when clicking the link button in the editor toolbar, I could choose this "text" as the anchor link. This allowed me to control the URL and use human-friendly format.
    Now, since the change, the above screenshot is replaced by the one below, where my only options are (1) to link to an external URL, or (2) to link to a Header within the article. Alternatively I could (3) manually code the anchor link as I wish it to appear.
    If I choose option (2), Zendesk generates a long string of characters such as
    <h3 id="h_ebe2646a-ba64-4835-b7f0-3d3adb739d24">
    This makes the anchor link unwieldy and unfriendly to humans. It would be fine if all anchor links were used only to navigate within the page, but sometimes I want to link from an external source. 

    I can still create the friendly anchor link manually via source code editor, but this is more time-consuming and introduces the possibility of typo errors.
    Please revert to the way this was previously handled, or improve the new link method you have implemented!


Please sign in to leave a comment.

Powered by Zendesk