syntaxhighlighter on Wordpress

Posted by PunNeng, Mon Oct 09 01:10:00 UTC 2006

มีตัวช่วยมานำเสนออีกแล้ว หลังจากที่ AMp ได้บอกให้ลองใช้ textarea ที่มันแสดง highlight code ตามที่เว็บนี้ใช้ แล้วก็แงะไปแงะมา สืบสาวราวเรื่องได้ว่า มันคือ syntaxhighlighter เสร็จไอ่เหน่งครับ

มาดูกันว่าตัว syntaxhighlighter มัน highlight อะไรไ้ดบ้าง ตามนี้เลย

  • C#
  • CSS
  • C++
  • VB & VB.NET
  • Delphi, Pascal
  • Java
  • JavaScript
  • PHP
  • Python
  • Ruby
  • SQL
  • XML, HTML, XSLT and any other XML style code

สำหรับวิธีใช้งาน ก็ไม่ยาก เพียงแค่ include ตัว css มาัก่อน

แล้วตรงท้าย page ของเรา ให้ include javascript ตามนี้

ดังนั้น textarea อะไรที่อยู่หลัง js ชุดนี้ มันจะไม่ทำการ render ออกมาเป็นหน้าตาอย่างตัวข้างบน

คราวนี้ เข้ามาที่ตัว textarea ว่าควรจะต้องใส่อะไรไปบ้าง ง่ายนิดเดียว

เพียงแค่เพิ่ม

name="code" class="ruby"

attr name จะเป็น code ส่วน class จะเป็น stynax ของภาษานั้นๆ ที่เราจะต้องการ hightlight เสร็จสิ้น

แล้วมัน on Wordpress ยังไง ==' (เหมือนอันที่แล้วเลยแฮะ) ผมมี plugin อีกแล้วครับ เข้าไปที่นี่ แล้วไปโหลดมาติดตั้ง โดยการ upload wp-dp-syntaxhighlighter ไว้ใน plugin แล้วก็ไป activate มัน ก็เป็นอันเสร็จสิ้น วิธีการเรียกใช้ก็ใช้เหมือนเดิม

ปล. ผมเปลี่ยนเป็น Mephisto แล้ว ตัว highlighter ก็เปลี่ยนไปด้วย

แก้ไขล่าสุด วันที่ 16 กรกฏาคม 2550 เวลา 22.24 น.

Filed Under: General | Tags: cms javascript syntax highlighting weblog wordpress

Comments

codegent: we're hiring