Help with "Prism Syntax Highlighter" does not work right

1

I have a problem adding "Pre Code" to my blogger.

When I add codes in the "language-css" tag, for example, the added codes work perfectly, but when adding html languages in the "markup" markup, it buga, as shown in the image below:

Andtherightthingtodoistostaythatway:

HereisthecodeIusetoaddHTMLLanguages:

<pre title="HTML" data-codetype ="HTMLku"><code class="language-markup"> ...Código HTML... </code></pre>

Where is "... HTML code ..." I replace with any HTML codes for the "Pre Code" marking like this:

<div class="testprecode">Testando Código HTML</div>

Instead of the whole code, only "Testing HTML Code" appears.

This only happens when I add in the markup language-markup.

When I add css in the "language-css" tag, it looks good, perfect.

I would appreciate it if anyone helps me, I need this a lot on my Blog.

    
asked by anonymous 10.12.2016 / 19:17

1 answer

4

The problem is that you are merging the HTML that is to be displayed with the HTML that mounts the page.

The solution is to get escape from internal HTML like this:

<pre title="HTML" data-codetype ="HTMLku"><code class="language-markup">
    &lt;ul id=&quot;arlina-desing&quot;&gt;
      &lt;li class=&quot;active&quot;&gt;
        &lt;a href=&quot;#&quot;&gt;Top&lt;/a&gt;
      &lt;/li&gt;
    &lt;/ul&gt;
</code></pre>

Here is a tool that does this conversion for you:

  

link

Remember that in addition, the white space setting of the main CSS must be correct to preserve line breaks and indentation spaces.

When you use a server side language, such as PHP, you have ready-made functions such as htmlentities( ) for example.

    
10.12.2016 / 19:48