SyntaxHighlighter bu adresten indirebilirsiniz : http://alexgorbatchev.com/SyntaxHighlighter/download/
indirilen zip bir klasöre atılırsa içindeki index.html açılarak basit bir örnek gösterilebilir. Bu sayfanın kodu örnek yaratmak için kullanabilir. Örnek aşağıdaki gibidir:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Hello SyntaxHighlighter</title>
<script type="text/javascript" src="scripts/shCore.js"></script>
<script type="text/javascript" src="scripts/shBrushJScript.js"></script>
<link type="text/css" rel="stylesheet" href="styles/shCoreDefault.css"/>
<script type="text/javascript">SyntaxHighlighter.all();</script>
</head>
<body style="background: white; font-family: Helvetica">
<h1>Hello SyntaxHighlighter</h1>
<pre class="brush: js;">
function helloSyntaxHighlighter()
{
return "hi!";
}
</pre>
</html>
Yukarıda <pre class="brush: js;"> ile başlayan ve </pre> ile biten biçimlenmesi gereken kod bloğudur. Aşağıdaki js dosyası head içinde eklenmektedir :
Biçimlendirmek istenilen dile göre ayrı shBrushDİL.js dosyaları bulunur. Aşağıdakiler de eklenmelidir
<script type="text/javascript" src="scripts/shBrushJScript.js"></script>
<link type="text/css" rel="stylesheet" href="styles/shCoreDefault.css"/>
<script type="text/javascript">SyntaxHighlighter.all();</script>
Benzer bir örneği java kodu için yapabiliriz. Kod aşağıdaki gibi olsun :
package com.fibiler.test;
public class HelloWorld {
public static void main(String[] args) {
System.out.println("Hello World");
}
}
Bu kodu biçimlendiren sayfa kodu aşağıdaki gibi olacaktır :
<html>
<head>
</head>
<body>
<p>Java kod biçimlendirme örneği aşağıdaki gibidir :
<script type="text/javascript" src="shCore.js"></script>
<script type="text/javascript" src="shBrushJava.js"></script>
<link type="text/css" rel="stylesheet" href="shCore.css"/>
<link type="text/css" rel="stylesheet" href="shCoreDefault.css"/>
<link type="text/css" rel="stylesheet" href="shThemeDefault.css"/>
<pre class="brush: java">
package com.fibiler.test;
public class HelloWorld {
public static void main(String[] args) {
System.out.println("Hello World");
}
}
</pre>
<script type="text/javascript">SyntaxHighlighter.all();</script>
</body>
</html>
html, iki js ve bir css dosyası aynı klasörde olması durumunda yukarıdaki örnek çalışacaktır
