It can highlight various program source code syntax in a Web page. Supports the various programming languages that are currently popular: C #, CSS, C + +, Delphi, Java, JavaScript, PHP, Python, Ruby, SQL, Visual Basic, xml/html
Download Address: http://www.dreamprojections.com/syntaxhighlighter/
or http://code.google.com/p/syntaxhighlighter/
Demo Address: http://www.dreamprojections.com/syntaxhighlighter/Tests/PHP.html
The tool core is based on JavaScript and is simple to use:
1, assume that the Web page file test.htm stored in a directory, will dp.syntaxhighlighter uncompressed, and copy the Scripts folder and styles folder, ensure and test.html under the same directory.
2, insert the following code between the <link type= "Text/css" rel= "stylesheet" href= "Styles/syntaxhighlighter.css" ></link>
3, in the page to display the source code of the program to insert the following code, if HTML type, with XML (other such as class= "JS" to show the source code JS syntax, other can be set the class value of C #, CSS, C, Elphi, Java, JS, PHP, Python, Ruby, SQL, VB, xml:
<textarea name= "code" class= "JS" rows= "cols=" >
The program source code is here.
</textarea>
Description
Name= "code" is necessary and cannot be changed;
Class= "XML" is a way of coloring, that is, the type of code that needs to be shaded and changed as needed.
4. Insert the following code before </body> at the end of the page:
<script class= "javascript" src= "Scripts/shcore.js" ></script>
<script class= "javascript" src= "Scripts/shbrushcsharp.js" ></script>
<script class= "javascript" src= "Scripts/shbrushphp.js" ></script>
<script class= "javascript" src= "Scripts/shbrushjscript.js" ></script>
<script class= "javascript" src= "Scripts/shbrushjava.js" ></script>
<script class= "javascript" src= "Scripts/shbrushvb.js" ></script>
<script class= "javascript" src= "Scripts/shbrushsql.js" ></script>
<script class= "javascript" src= "Scripts/shbrushxml.js" ></script>
<script class= "javascript" src= "Scripts/shbrushdelphi.js" ></script>
<script class= "javascript" src= "Scripts/shbrushpython.js" ></script>
<script class= "javascript" src= "Scripts/shbrushruby.js" ></script>
<script class= "javascript" src= "Scripts/shbrushcss.js" ></script>
<script class= "javascript" src= "Scripts/shbrushcpp.js" ></script>
<script class= "JavaScript" >
Dp. Syntaxhighlighter.highlightall (' Code ');
</script>
A page can contain any number of code segments that need to be shaded;
There are all kinds of coloring cases in the package that you can use for reference.
Method Two:
1. First add the following code on the page (assuming the downloaded syntaxhighlighter is placed under the Syntaxhighlighter directory, note the directory structure):
<link type= "Text/css" rel= "stylesheet" href= "Syntaxhighlighter/styles/syntaxhighlighter.css" ></link>
<script language= "javascript" src= "Syntaxhighlighter/scripts/shcore.js" ></script>
<script language= "javascript" src= "Syntaxhighlighter/scripts/shbrushcsharp.js" ></script>
<script language= "javascript" src= "Syntaxhighlighter/scripts/shbrushxml.js" ></script>
<script language= "JavaScript" >
Window.onload = function () {
Dp. syntaxhighlighter.clipboardswf = ' syntaxhighlighter/scripts/clipboard.swf ';
Dp. Syntaxhighlighter.highlightall (' Code ');
}
</script>
There is no window.onload in the official installation, I think this is still needed, after all, I need to color the code when the page is loaded.
2. The following methods are used:
Method One: Use pre
<pre name= "code" class= "C-sharp" >
... some code here ...
</pre>
Method Two: Use textarea
<textarea name= "code" class= "C #" cols= "rows=" >
... some code here ...
</textarea>
In addition, there are some advanced features of the set up methods available for reference, such as code folding.
