การทำ Syntax Highlighter ใน blog

// sql code
SELECT * FROM Table_Name
WHERE Column_Name not in ('Test')

ขั้นแรกให้นำโค๊ดข้างล่างไปใส่บน </head> ของเว็บ

Code

1. <script type="text/javascript" src="http://bc46.com/syntaxhighlighter/scripts//shCore.js"></script>
   <script type="text/javascript" src="http://bc46.com/syntaxhighlighter/scripts//shBrushAll.js"></script>
   
   <link type="text/css" rel="stylesheet" href="http://bc46.com/syntaxhighlighter/styles/shCore.css"/>
   <link type="text/css" rel="stylesheet" href="http://bc46.com/syntaxhighlighter/styles/shThemeDefault.css"/>
   
   <script type="text/javascript">
   SyntaxHighlighter.config.clipboardSwf = 'http://bc46.com/syntaxhighlighter/scripts//clipboard.swf';
   SyntaxHighlighter.all();
   </script>

ต่อไปก็เป็นการใส่ syntaxhighlighter กับข้อความของเราด้วยโค้ด 

ในตัวอย่างข้างล่างผมกำหนด class="brush: php;" ก็จะได้ syntaxhighlighter ของ PHP 

Code

1. <pre class="brush: php;">
           // test php code
    if ($you == 'สาวแว่น'){
   $sql="INSERT INTO urHeart SET ที่ว่าง = '$Me' ";
   $result_insert = mysql_query($sql) or die("can't query to urHeart.");
    }
   </pre>

ผลลัพธ์

// test php code
  if ($you == 'สาวแว่น'){
  $sql="INSERT INTO urHeart SET ที่ว่าง = '$Me' ";
  $result_insert = mysql_query($sql) or die("can't query to urHeart.");
  }

*   ภาษาที่ syntaxhighlighter รองรับมีอะไรบ้าง
          o bash , shell
          o cpp , c
          o c# , c-sharp , csharp
          o css
          o delphi , pascal
          o diff , patch
          o groovy
          o java
          o js , jscript , javascript
          o perl , Perl , pl
          o php
          o text , plain
          o py , python
          o ruby , rails , ror
          o scala
          o sql
          o vb , vbnet
          o xml , xhtml , xslt , html , xhtml

    หมายเหตุ ชื่อด้านบนคือชื่อที่ใช้อ้างอิงในโค้ด เช่น ต้องการ syntaxhighlighter ของ javascriptก็สามารถใช้ได้ทั้ง  class="brush: js;"  /  class="brush: jscript;"  /  class="brush: javascript;" 


นอกจากนั้น syntaxhighlighter ยังสามารถกำหนดบรรทัดเริ่มต้นและ highlight บรรทัดได้ 

Code

1. <pre class="brush: php; first-line: 10; highlight: [13]">
           // test php code
    if ($you == 'สาวแว่น'){
   $sql="INSERT INTO urHeart SET ที่ว่าง = '$Me' ";
   $result_insert = mysql_query($sql) or die("can't query to urHeart.");
    }
   </pre>

ผลลัพธ์

// test php code
  if ($you == 'สาวแว่น'){
  $sql="INSERT INTO urHeart SET ที่ว่าง = '$Me' ";
  $result_insert = mysql_query($sql) or die("can't query to urHeart.");
  }

หากต้องการไฟล์ java และ styles ของ Syntax Highlighter  ดาวน์โหลดได้ที่นี่ครับ : http://bc46.com/Bc46_Upload/download.php?file=2cd03598c671aa88984c22d750e462d8


อ้างอิง : http://tonhor.exteen.com/20090411/howto-syntax-highlighter-on-exteen