SyntaxHighlighter code coloring method

It can highlight various program source code syntaxes on the webpage. Supports various popular programming languages: C #, CSS, C ++, Delphi, Java, JavaScript, PHP, Python, Ruby, SQL, Visual Basic, XML/HTML

: Http://www.dreamprojections.com/syntaxhighlighter/
Or http://code.google.com/p/syntaxhighlighter/
Demo address: http://www.dreamprojections.com/syntaxhighlighter/Tests/PHP.html

The tool is based on javascript and is easy to use:


The partition is under the same directory.

2. Insert the following code between <Link type = "text/css" rel = "stylesheet" href = "Styles/SyntaxHighlighter.css"> </link>

3. Insert the following code where the source code of the program is to be displayed on the webpage. If the source code is HTML type, use XML (other class = "js" indicates displaying the source code with js syntax, other configurable class values are c #, css, c, elphi, java, js, php, python, ruby, SQL, vb, and xml ):

<Textarea name = "code" class = "js" rows = "15" cols = "100">
Put the program source code here
</Textarea>

Note:
Name = "code" is required and cannot be changed;
Class = "xml" is the coloring method, that is, the type of the Code to be colored, which can be changed as needed.

4. Insert the following code before </body> at the end of the webpage:

<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 to be colored;
The compressed package contains various coloring code types for your reference.


Method 2:

1. First Add the following code on the page (assuming that the downloaded SyntaxHighlighter is placed under the SyntaxHighlighter directory, pay attention to 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 required. After all, I need to color the code when loading the page.

2. Use the following method:

Method 1: Use pre

<Pre name = "code" class = "c-sharp">
... Some code here...
</Pre>


Method 2: Use textarea

<Textarea name = "code" class = "c #" cols = "60" rows = "10">
... Some code here...
</Textarea>


In addition, there are some advanced settings for reference, such as code folding.