Would like to add syntax highlighting to JSON displayed in HTML

[jswift24]

I'm displaying a JSON snippet:

I'd like to add syntax highlighting, like what's described in the [docs ](https://django-datta-able-enh.appseed-srv1.com/elements-ac_syntax_highlighter.html but I can't get it working. Here's the code I'm using:

<pre><code id="json-output" class="json" style="font-size: 1rem;">{{ cohorts_json|json_format }}</code></pre>

<style>
pre {
    background-color: #f4f4f4;
    padding: 10px;
    border-radius: 5px;
}
pre code.json {
    font-family: monospace;
    white-space: pre-wrap;
}
</style>

Please help.

[app-generator]

Hello @jswift24

Try integrate this: http://www.eslinstructor.net/vkbeautify/

[jswift24]

Thanks. Looks like that plugin does pretty-printing. I'm looking for syntax highlighting (in colors). I thought this was built into the Datta Able template, doc link above?

[app-generator]

https://prismjs.com/plugins/jsonp-highlight/ might help

[jswift24]

That worked great! Thank you.