การ post source code บน WordPress

Byphunsanit

การ post source code บน WordPress

เราสามารถ post code บน WordPress ได้อยู่แล้วแต่จะอ่านยากมาก ไม่มีทั้งบรรทัด ทั้งสีสันอะไรเลย จะจัดเองก็ลำบาก จะให้เค้า copy ก็ไม่สะดวกเท่าที่ควร tag code ก็ใช้ได้ไม่ตรงวัตถุประสงค์เท่าไหร่

wordpress version ใหม่เพิ่มให้ใช้ Code Block โดยไม่ต้องลง plugin แต่มันไม่สวยเลย

ความจริง WorldPress ได้มีตัวช่วยอำนวยความสะดวกแบบนี้ให้อยู่แล้ว ถ้าใช้ wordpress.com จะติดตั้งเอาไว้ให้แล้วแต่ถ้าลง WordPress บน server ของตัวเองก็ต้องลง plugin SyntaxHighlighter Evolved ก่อนครับ ตัวมันจะไม่มี gui ให้ ต้องพิมพ์

[sourcecode language="ภาษาของ code"]
พิมพ์ code ไว้ตรงนี้
[/sourcecode]

(พิมพ์ [ ติดกับ sourcecode นะครับ)
โดยสามารถเลือกแสดงภาษาต่างๆ จากด้านล่าง

  • ActionScript
  • Arduino
  • BASH / Shell
  • C / C++
  • C#
  • Clojure
  • ColdFusion
  • CSS
  • Delphi / Pascal
  • diff / patch
  • Erlang
  • F#
  • Go
  • Groovy
  • Haskell
  • HTML / XHTML / XML / XSLT
  • Java
  • JavaFX
  • JavaScript
  • LaTeX
  • MATLAB
  • Objective-C
  • Perl
  • PHP
  • Plain Text
  • PowerShell
  • Python
  • R
  • Ruby / Ruby on Rails
  • Scala
  • SQL
  • Swift
  • Visual Basic
  • YAML

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

ตัวแปรหน้าที่ตัวเลือกค่าตั้งต้น
autolinksทำให้ Uri ภายในสามารถ คลิกได้true/falsetrue
collapseจะยุบส่วนแสดง code เอาไว้ก่อน ต้องกดดูจึงจะเห็นtrue/falseFalse.
firstlineตัวเลขบรรทัดตัวเลข1
gutterแสดงตัวเลขบรรทัดtrue/falseTrue
highlightHighlight บรรทัดที่ต้องการตัวเลขบรรทัดคั่นด้วย , 
htmlscriptHighlight ส่วนที่เป็น html มีประโยชน์เวลาเขียน html ปนกับภาษาอื่นๆtrue/falseFalse
lightจะซ่อนส่วนแสดงเลขบรรทัดและ toolbar ถ้ามีไม่กี่บรรทัดtrue/falseFalse
padlinenumbersควบคุมการระยะห่างการแสดงเลขบรรทัด
  • true จะปรับระยะโดยอัตโนมัติ
  • false จะไม่ปรับระยะให้
  • ตัวเลข กำหนดเอง
true/false/ตัวเลข 
titleแสดง titlestring
toolbarแสดง toolbartrue/falseTrue
wraplinesสลับสีของแต่ละบรรทัดtrue/falseTrue

ถ้ากำหนด

[sourcecode language="php" htmlscript="true" firstline="24"]
<?php
echo 'สวัสดีชาวโลก';
[/sourcecode]

(พิมพ์ [ ติดกับ sourcecode ไม่ต้องเว้นวรรค) จะได้

<?php
echo 'สวัสดีชาวโลก';

อ่านเพิ่มเติม

About the author

phunsanit administrator

    Leave a Reply