Help Center Article Editor needs to support (easy) source code formatting

71 Comments

  • Siegfred Winkler

    What could be prioritized would be the ability to do the same formatting in Helpcenter as the editor of Support Tickets. Much needed are the inline-codes. Actually, it doesn't quite make sense, that these two editors have different editing options.

    1
  • mgz

    Best solution I found is to use Prism.js
    https://prismjs.com/
    Download the code from the Prismjs.com website. 
    Then Zendesk Admin can inject the code of Prism.js and Prism.css files to the Zendesk Theme of their knowledgebase. 
    As Admin go to the Knowledgebase. Edit Theme -> Edit Code
    Open file: script.js. Insert the prism.js file at the end. click Publish
    Open file: style.css Insert the prism.css at the end of the file. click Publish.
    Now, you can insert code snippets using the guidelines from prism.js website.

    However, it would be great if Zendesk dev team would incorporate Prism.js natively. Especially because the library was released under open source MIT license. 
    https://github.com/PrismJS
    The effort seems minimal. Maybe Product Manager can help here ?

    1
  • Bryan Matias

    +1. ZD Support supports something similar, would be great to have that in the KB.

    1
  • mgz

    The code block from Zendesk is not the same. it doesn't highlight code according to what programming language is used. all it does is to arrange the code in a distinct section. Hard to read the code in this way, especially when the code section is long.
    also, there is no option to switch seeing a different code when a different programming language is used, 

    2
  • Saptara Gupta

    This helps: <span class="wysiwyg-color-black"><code>Some code</code></span>

    0
  • Samson Tan

    We had previously opted out of using the help center for a good portion of our client facing pages, precisely due to the lack of good support for the code block and code snippets. The code block option that is there now is a good start, but still leave room for improvement.

    Currently, it doesn't seem to take any tabs/spaces that we copy/paste in from our code editors. This makes the code in the code block a bit tedious to read unless we manually go in an re-edit all the code for better spacing.


    0
  • Sean Leonard

    I moved from Freshdesk to guide, was surprised to see that guide does not have support for code snippets Freshdesk's portal product has very nice code formatting etc when embedding in articles:

    Having to embed screenshots is a horrible solution. The reason you embed code in an article is so that the client can copy it from the article. I am missing this feature on a lot of my support portal articles.

    0
  • Ryan McGrew
    Zendesk Product Manager

    Hey Sean Leonard

    We added support for code block snippets in the editor a little while back. It doesn't natively support code highlighting in the theme, but that can be added with the usage of of prism.js or hightlight.js in your theme. It doesn't yet support inline code snippets if that's what you need.  

    If this doesn't support your needs, please let me know more about what you need out of it.

    Thanks!

    0
  • mgz

    @RyanMcGrew,
     The code snippets that you mentioned are basic. Would be nice if Zendesk KnowledgeBase would support something like prism.js natively and not as part of additions to themes. 
    Often, the person that tries to edit the knowledge base is not the person that is responsible for the theme of the knowledge base. 
    In addition, these days,  when a code snippet is provided, there is a need to provide several tabs for different languages. 
    For example, it is impossible to do an API Spec in Zendesk Knowledgebase. It doesn't look good. 

    0
  • Christophe LANDRET

    There is a conflict between Prism.js and Zendesk which creates artifacts which deteriorates code reading. Zendesk Support confirmed this conflict but does not support this as Prism.js is a third party software that is not declared as officially compatible...

    The fact that we have to deal with Zendesk code and possibly meet compatibility issue is a problem. A web developper is required to tackle all this stuff. And it takes time...

    I really think Zendesk Guide should integrate code snippet hightlighting instead of relying on other open-source libraries for this purpose. Freshdesk does it perfectly and it is so easy with it. So why not Zendesk Guide?

    0
  • Daniel Wood

    Have to admit, I am kind of amazed that it does not seem possible to create my own custom styles to be applied via the WYSIWYG drop-down, but am instead stuck with only 4 header styles.

    I mean, what do you guys imagine a good help article to look like, format-wise, in 2020? Because I'm guessing it involves more than 4 different header sizes and the occasional bullet point list.

    The fact that switching to code view does/can not grab my cursor position is just icing on the time-wasting cake. Hundreds and thousands of human-hours, wasted every day in this product, just scrolling back down through the Code View trying to find the paragraph or header where you need to apply that custom style... 

    1

Please sign in to leave a comment.

Powered by Zendesk