เห็นถามเกี่ยวกับการเพิ่มลด อะไรต่อมิอะไรใน template กันมามากพอสมควร ไอ้เราก็บอกไม่ถูก ต้องมีไฟล์ template ให้พินิจวิเคราะห์ ถึงจะบอกได้ถูกว่าควรจะเพิ่มที่ตำแหน่งไหนบ้าง ก็เลยแนะนำโปรแกรมนี้เอาไว้ใช้งานกันโปรแกรมนี้ชื่อว่า firebug เป็นโปรแกรมติดตั้งก็มีแต่ที่ผมใช้เป็น add on ของ fire fox จะสะดวกมากกว่า ก่อนอื่นก็เข้าไปดาวน์โหลดแล้วติดตั้งที่  https://addons.mozilla.org/en-US/firefox/addon/1843

คลิ๊กที่ add to firefox โปรแกรมก็จะดาวน์โหลดและติดตั้งให้จากนั้นก็ restart fire fox ก็จะสามารถใช้งานโปรแกรมได้แล้วครับ

จะมีรูปแมลงปีกแข็งอยู่ที่มุมขวาด้านล่าง จะใช้งานก็คลิ๊กที่นี่

หรือคลิ๊กขวา ไปที่ Inspect Element

ส่วนต่าง ๆ ของโปรแกรม
ส่วนแรกเป็น html code ที่ใช้แสดงผลในหน้าเพจนั้น ๆ
ส่วนที่สองเป็น css จะบอกถึงคุณสมบัติต่าง ๆ และชื่อไฟล์ css ที่ใช้งาน

การใช้งานก็เพียงแต่คลิ๊กที่เป็นรูปสี่เหลี่ยมที่ด้านซ้ายมือจากนั้นก็คลิ๊กเลือกตำแหน่งที่ต้องการดูบนหน้าเว็บเพจ

มาดูด้าน css สามารถคลิ๊กเลือกปิด property ต่าง ๆ ของ css ได้

เมื่อชี้ที่โค๊ดสีก็จะเห็นสีนั้น ๆ

คลิ๊กเลือกที่ property แล้วทำการเปลี่ยนค่าได้

จากที่เปลี่ยนค่า ค่านั้นก็จะแสดงผลบนหน้าเพจ

ดูขนาดของ layout

หรือลบ โค๊ด html บางบรรทัดก็ทำได้โดยการคลิ๊กเลือกที่บรรทัดที่ต้องการจากนั้น กด delete

เพิ่ม property โดยการดับเบิ้ลคลิ๊กแล้วพิมพ์ property ที่ต้องการ

และอื่น ๆ เช่น จัดการเกี่ยวกับ java script , DOM

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