highlightjs with html code

javascript html syntax-highlighting prettify

Kalzem · Feb 27, 2014 · Viewed 12.9k times · Source

How do I put my HTML code so that highlight.js prettify it ?

I tried

<pre>
    <code>
        <!-- HTML Prettify -->
        <div>
            <pre class="pre-code-ception"><code> haha </code></pre>
        </div>
    </code>
</pre>

I did put at the end of my file :

<script type="text/javascript">
    hljs.initHighlightingOnLoad();
</script>

But everything is shown as plain HTML.

Answer

Oh, I think I understand the problem. You need to escape the HTML within the <code> element, otherwise it will be interpreted as HTML instead of text (you want the HTML displayed literally, not interpreted as part of the webpage structure).

Change every < to < and > to >, as well as any other special HTML characters in your code sample. (If you're generating the page on the fly, most languages have a utility function to escape the HTML for you.)

highlightjs with html code

Answer

Related questions