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

70 Comments

  • Siegfred Winkler
    Comment actions Permalink

    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
    Comment actions Permalink

    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
    Comment actions Permalink

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

    1
  • mgz
    Comment actions Permalink

    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
    Comment actions Permalink

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

    0
  • Samson Tan
    Comment actions Permalink

    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
    Comment actions Permalink

    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
    Comment actions Permalink

    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
    Comment actions Permalink

    @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
    Comment actions Permalink

    I tried with Prism.js. It works but there is a small compatibility issue between Prism.js Coy theme and Zendesk css code which creates underlining artifacts on all comments for C/C++/java languages, the lines being drawn at the next code line. This deteriorates code reading. I didn't tried with other Prism.js themes yet.

    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. So why not Zendesk Guide?

    My trial period is ending and for now I think I will go back to Freshdesk because of this kind of stuff.

    0

Please sign in to leave a comment.

Powered by Zendesk