GeSHi (Generic Syntax Highlighter) แสดงโค้ดของโปรแกรมในเนื้อหาของเว็บไซต์

Submitted by nimitr on 31 ส.ค. 2011 - 09:05

เว็บไซต์ที่สอนเขียนโปรแกรมต่าง ๆ หากจำเป็นต้องแสดงโค้ดของโปรแกรมลงในเนื้อหาของเว็บไซต์ เพื่อให้อ่านเข้าใจง่ายขึ้น โดยจะเน้นสีที่แตกต่างกันในแต่ละส่วนของโค้ด

โมดูล GeSHi Filter มีความสามารถเหล่านี้โดยรองรับภาษาโปรแกรมต่าง ๆ กว่า 130 ภาษา

วิธีติดตั้ง

1. download และติดตั้งโมดูล GeSHi Filter จากhttp://drupal.org/project/geshifilter ก่อน

2. ติดตั้งไลบรารี GeSHi Syntax Highlighter จากhttp://qbnz.com/highlighter/

หรือhttp://sourceforge.net/projects/geshi/files/geshi

3. ติดตั้ง Content Construction Kit (CCK) จากhttp://drupal.org/project/cck

4. ติดตั้ง Views จากhttp://drupal.org/project/views

5. ใส่ geshi เข้าไปใน input filter ด้วย

6. ดูคู่มือการตั้งค่า (Configure) จากใน Help ของโมดูล GeSHi เช่น www.nimitr.com/q=admin/help/geshifilter

7. ดู Tips ต่าง ๆ ในwww.nimitr.com/q=filter/tips

8. ดูวิธีใช้จากhttp://www.codenone.com/node/20

9.ตรงนี้สำคัญนิดนึง คือInput Format ต้องเข้าไปเปิดให้ใช้งาน GeSHi ในadmin/settings/Input format > Filtered HTML ด้วย

แต่พอตั้งค่า GeSHi เปลี่ยนไปเปลี่ยนมาแล้ว จะเกิดผลกระทบกับ เนื้อหาเก่า ๆ ทำให้แสดงผลเพี้ยนไปจากเดิม

ทางแก้คือสร้าง Input format ใหม่ ผ่านadmin/settings/Input format
ตั้งให้สามารถใช้งาน GeSHi ได้ (โดยยกเลิกการใช้งาน GeSHi กับ Input Format อันเก่า (Filtered HTML) เพื่อให้ไม่ต้องตามไปแก้งานเก่า)
ตั้งชื่อว่าGeSHi Filtered HTML
สำหรับงานใหม่ที่จะต้องการใช้ Syntax Highlight ก็ค่อยมาเลือกใช้ Input format แบบนี้

___________

ปัญหา

1. จะแสดงแท็ก <p></p> ขึ้นมาด้วย

2. ไม่ย่อหน้าให้ตามที่ post ไว้