Menu
I'd like to display code on a web page. However I'd like it to keep its spacing and be color coded by syntax.
Please do not respond with:
< This is not what I need: doing this removes all my line breaks and my spacing and provides no color<pre> <code> This totally fails it still tries to execute the HTML and PHPSee if I copy and paste code into here. It gives me exactly what I want on my site nicely color coded and with the white space maintained.
<span style="color:#FE7A15;font-size:140%">■</span> <a href="http://stackoverflow.com">stackoverflow.com</a>
<span style="color:#FE7A15;font-size:140%">■</span> <a href="http://stackapps.com">api/apps</a>
<span style="color:#FE7A15;font-size:140%">■</span> <a href="http://careers.stackoverflow.com">careers</a>
<span style="color:#E8272C;font-size:140%">■</span> <a href="http://serverfault.com">serverfault.com</a>
<span style="color:#00AFEF;font-size:140%">■</span> <a href="http://superuser.com">superuser.com</a>
<span style="color:#969696;font-size:140%">■</span> <a href="http://meta.stackoverflow.com">meta</a>
<span style="color:#46937D;font-size:140%">■</span> <a href="http://area51.stackexchange.com">area 51</a>
<span style="color:#C0D0DC;font-size:140%">■</span> <a href="http://webapps.stackexchange.com">webapps</a>
<span style="color:#000000;font-size:140%">■</span> <a href="http://gaming.stackexchange.com">gaming</a>
<span style="color:#dd4814;font-size:140%">■</span> <a href="http://askubuntu.com">ubuntu</a>
<span style="color:#9ce4fe;font-size:140%">■</span> <a href="http://webmasters.stackexchange.com">webmasters</a>
<span style="color:#cf4d3f;font-size:140%">■</span> <a href="http://cooking.stackexchange.com">cooking</a>
<span style="color:#f4f28d;font-size:140%">■</span> <a href="http://gamedev.stackexchange.com">game development</a>
<span style="color:#0f3559;font-size:140%">■</span> <a href="http://math.stackexchange.com">math</a>
<span style="color:#f2f2f2;font-size:140%">■</span> <a href="http://photo.stackexchange.com">photography</a>
<span style="color:#037187;font-size:140%">■</span> <a href="http://stats.stackexchange.com">stats</a>
<span style="color:#f1e7cc;font-size:140%">■</span> <a href="http://tex.stackexchange.com">tex</a>
<span style="color:#e1cdae;font-size:140%">■</span> <a href="http://english.stackexchange.com">english</a>
<span style="color:#a2d9f6;font-size:140%">■</span> <a href="http://cstheory.stackexchange.com">theoretical cs</a>
<span style="color:#1b3e6c;font-size:140%">■</span> <a href="http://programmers.stackexchange.com">programmers</a>
<span style="color:#293a5d;font-size:140%">■</span> <a href="http://unix.stackexchange.com">unix</a>
<span style="color:#bec0cb;font-size:140%">■</span> <a href="http://apple.stackexchange.com">apple</a>
<span style="color:#939185;font-size:140%">■</span> <a href="http://wordpress.stackexchange.com">wordpress</a>
I'm looking for a way to display code (without it executing) and have the color coded syntax just like this website does, or like TextWrangler (the text editor) does. Often this will be the code of the whole page from doc type to html.
I've seen color coded display of code on many developer websites, so I know it's doable, but any Google Search ends up bringing me to the billion pages on how to change font color and such in HTML.
I need this to work for PHP HTML at a minimum and preferably CSS, JavaScript, and jQuery as well.
PS: the color coded syntax is not necessary, but keeping my format (line breaks spacing white space, etc.) is absolutely necessary and with the amount of code it posts, it is not feasible to do so manually.
950
I use the syntax highlighter from Alex Gorbatchev (JavaScript).
See http://alexgorbatchev.com/SyntaxHighlighter/manual/installation.html for instructions. But if you need to support displaying HTML containing script elements, you'll need to fall back to the <pre> method, and thus escape <, > and &.
157
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
