How can I use Javascript in my Help Center articles?

Respondida

24 Comentários

  • Tal Admon

    Hi Mollie,

    Please try to check the option "display unsafe content" under Security in the general help center settings:

    https://your_domain.zendesk.com/hc/admin/general_settings

    Update the settings page after you have checked this option and reload - you should get the script tag to work as expected.

    -Tal

    1
  • Mollie Swenson

    Tal, this worked -- thank you!!

    1
  • Benedict Noel

    Hi, I've checked "display unsafe content" and saved my settings but it's still wrapping my javascript in CDATA when I edit our articles. How can I get around this?

    1
  • Wolfgang Drechsel - Exactag GmbH

    Same here... "display unsafe content" checked but CDATA appears when clicking "Ok" after editing sourcecode. Any solution on this?

    1
  • Dan Ross
    Community Moderator

    Even after checking the unsafe content option, I get the same issue as the others. Any solution available?

    0
  • Keith @ Zendesk

    This question would require some deeper diving.  Hey Dan, would you mind if we took this to a Ticket and did some research?  Let us know when you can. :)

    0
  • Lars Klinggaard

    I'm having the same problem here. Any solution?

    0
  • Dan Ross
    Community Moderator

    I ended up having a ticket made and the conclusion was that the article editor doesn't properly support a lot of JS functionality (such as onClick). 

     

    We had to refactor our work to use jQuery. There was a lot of trial and error. I asked, but there is no actual documentation about which functions the Help Centre does or doesn't support, making future development tedious. 

    0
  • Nicole S.
    Zendesk Community Team

    Thanks, Dan. I'm sorry it was a tedious process. I've sent a note to our docs team that this might be an area we should create more information around going forward. 

    0
  • Lars Klinggaard

    Thanks for the answer, it turns out that it was my code was wrong and the JS is working fine now :)

    0
  • Nicole S.
    Zendesk Community Team

    Glad to hear you got it working, Lars!

    0
  • Neil Carmichael

    Could we use something like the javascript library "prism" to make our code more readable?

     

    https://prismjs.com/#features-full

    0
  • Bryan - Community Manager
    Zendesk Developer Support

    Hi Neil -- if you're talking about using Prism in your Help Center (HC) -- it's not supported by Zendesk, but you should be able to get it working. One way to try it out:

    1. Import your Prism files as assets into your HC theme

    2. Reference your prism files in your HC theme's document_head.hbs

    <link href="{{asset 'prism.css'}}" rel="stylesheet">
    <script src="{{asset 'prism.js'}}"></script>

    3. Hand modify your HC articles, surrounding them with the appropriate HTML tags as noted on the Prism site

    You'd probably have to contend with/reconcile competing CSS behavior that is part of your HC theme. If you get it working, let the community know!

     

    0
  • Neil Carmichael

    Great, thanks Bryan.

    So far on my own I have found the HTML5 tag "details" which gives you rollup text, next step prism!

     

    <details><summary>The name of your link</summary>
    <pre>
    Your code goes here
    </pre>
     
    </details>
    0
  • Bryan - Community Manager
    Zendesk Developer Support

    Thanks for the update Neil. As you found, the article would contain hand-written HTML modifications via the 'Source code' button in the article editor. Of course you can upload articles using Help Center APIs as well.

    Something like this for Prism:

    <pre><code class="language-javascript">
    var client = ZAFClient.init();
    client.invoke('resize', { width: '100%', height: '200px' });
    function buttonPress() {
      console.log("button pressed");
    }
    </code></pre>

     

    0
  • Niclas Kårlin

    Hello. I get this on the initial link

     

    oops

    You're not authorized to access this page

    0
  • Jessie Schutz
    Zendesk team member

    Hi Niclas!

    That post has been archived! It's referring to the functionality in the older version of our knowledge base product which was deprecated several years ago. I would recommend following the suggestions other users have made in the comments of this post. :)

    0
  • Saul Goodman

    Hi. I know this post is old, but the editor is still adding // <![CDATA[ when I add <script> tags. I've enabled "display unsafe content". is there any way to prevent this? Thanks!

    1
  • Devan - Community Manager
    Zendesk Community Team

    Hello Saul Goodman,

    This seems like some unexpected behavior, so I am going to open up a ticket on your behalf. You should receive an email shortly followed by a response from one of our specialists. 

    Best regards. 

    0
  • Romain Miroux

    Hi Devan,

    I'm having the same issue. I can share my javascript with you if you want to investigate why the editor is adding the // <![CDATA[ when I add <script> tags.

    Please let me know asap how to fix this.

    Thank you.
    Romain

    1
  • Nicole Gogel

    Hi Devan - Community Manager I'm also having the same issue as Romain and others on this thread: I have the "Display unsafe content" security setting checked. I see // <!CDATA[ in the <script> tag in my articles. For context, I'm importing from Adobe RoboHelp 2020 and using drop down/expanding text functionality. I believe the addition in the <script> is preventing the dropdowns from functioning.

    Please let me know how to resolve this.

    Thank you,

    Nicole

    1
  • Nicole Gogel

    I entered a ticket for this issue on May 20th 2021 and have not received any response. Is Zendesk support usually this slow?

    0
  • Dave Dyson
    Zendesk Community Team

    Hi Nicole –

    I'm sorry you've had to wait for a response. Generally, the fastest way to get a response from our support team is to contact them via live chat from within your Zendesk account (Option 1 here): Contacting Zendesk Customer Support

    However, because you're using a third-party tool here, I'm not sure our support team will have a lot of expertise to offer. But I found this Adobe RoboHelp site, and the video there does seem to indicate that it should be possible to include Javascript for drowdowns and other elements: Out-of-the-box support for Zendesk Help Center

    I think your best best is to make sure you're following the process laid out in this video, and if that still doesn't work, contact Adobe support directly via the email address provided at the end of the video. Since they built the integration, I think they should probably have a better idea what it can and can't do, and what to look for when troubleshooting.

    I hope this helps, and I'm sorry I can't provide a more definitive answer for you.

    0
  • Nicole Gogel

    Dave Dyson Hi Dave, my issue is the same as a few others on this thread: the addition of the // <!CDATA[ in the <script> tag in articles, so it doesn't appear to be specific to a third party tool. If that has indeed been resolved, I'd like to know the solution. I believe it's preventing my javascript elements from functioning/displaying properly, even with the appropriate settings to allow javascript. 

    I'd like to add that I entered a ticket because the chat bot wasn't helpful and my only option was to "leave a message". This was done on May 20th and I've received no response. This ticket is for an issue that is possibly related to this thread--I'm not sure because no one has gotten back to me to help.

    0

Por favor, entrar para comentar.

Powered by Zendesk