ในการเขียนบทความนั้น บางบทความอาจจะมีความยาวพอสมควรและแบ่งแยกเนื้อหาออกเป็นส่วน ๆ เช่น บทความเกี่ยวกับโครงการหนึ่ง ๆก็อาจจะประกอบไปด้วย วัตถุประสงค์ของโครงการ, เป้าหมาย, เนื้อหา, การดำเนินการ, บุคลากร เป็นต้น ซึ่งแต่ละส่วนก็จะมีเนื้อหาแตกต่างกันออกไป
เมื่อผู้ชมอ่านบทความ การที่จะรู้รายละเอียดทุกภาคส่วนก็จะต้องเลื่อนจอภาพอ่านทั้งบทความ หากเราได้จัดบทความออกเป็นส่วน ๆและแสดงเป็นสารบัญให้ผู้ชมได้ทราบว่า ในบทความนี้มีหัวข้อใดบ้างและข้ามไปอ่านยังหัวข้อน่าสนใจที่ต้องการจะอ่านนับว่าเป็นการสร้างความสะดวกให้กับผู้ชมไม่น้อยซึ่งก็เป็นเหมือนกับสารบัญของหนังสือนั่นเอง
ถ้ายังนึกภาพไม่ออก ดูตัวอย่างภาพด้านล่างประกอบ (จับภาพจากเว็บไซต์ผู้พัฒนา-หากินง่ายดี)
จากภาพตัวอย่างจะเห็นได้ว่า ผู้อ่านสามารถรู้ได้ทันทีว่า ในบทความมีหัวข้อใดบ้างและสามารถข้ามไปยังบทความที่น่าสนใจได้ทันทีปลั๊กอินที่ช่วยให้เราทำสารบัญได้อย่างนี้ นั่นคือTable of Contents Generatorการติดตั้งก็ทำได้ง่ายมีเพียงไฟล์เดียวเท่านั้น อัพโหลดใส่โฟลเดอร์ plugins แล้วก็เรียกใช้งาน ซึ่งการสร้างสารบัญนี้ สร้างได้ทั้งใน posts และ pages
การใช้งานก็ไม่ยาก เพียงแต่อยากให้มีสารบัญในบทความ (posts) หรือหน้า (pages) ไหน ก็ใส่โค้ด
ไว้ ณ ส่วนที่อยากให้มีสารบัญ อาจจะเป็นต้นบทความ หรือท้ายบทความก็ได้โค้ดนี้ต้องใส่ในบทความขณะอยู่ในโหมด HTML นะครับ ใส่ในโหมด Visual มันจะไม่บังเกิดผล อันนี้เป็นส่วนของการกำหนดการแสดงสารบัญ
อีกส่วนหนึ่งก็คือส่วนของการกำหนดรายการสารบัญต่าง ๆ ซึ่งกำหนดด้วยการใส่ HTML Headings Tags นั่นก็คือ H3 และ H4 ซึ่ง H3 กำหนดสำหรับส่วนที่เป็นหัวข้อหลัก (เช่นห้วข้อ 1.) ส่วน H4 สำหรับส่วนที่เป็นหัวข้อย่อย (เช่น หัวข้อ 1.1) ใส่ tags H3 คลุมหัวข้อหลัก และ H4 คลุมหัวข้อย่อย ปลั๊กอินจะสร้างสารบัญให้โดยอัตโนมัติ
ภาพตัวอย่างการใช้ HTML Heading Tags
ภาพตัวอย่างของการสร้างสารบัญหลังจากใส่ HTML Heading Tags ไปแล้ว
ค่าเดิม ๆ ในการแสดงผลของสารบัญอาจจะไม่สวยงามถูกใจเราเราก็สามารถปรับแต่งให้สวยงามได้ โดยการใส่โค้ด CSS ด้านล่างนี้ไว้ในไฟล์ style.css ที่อยู่ในธีมที่เรากำลังใช้อยู่
view source
print?
PGNvZGU+DQogICAgLnRvYyB7DQogICAgYmFja2dyb3VuZC1jb2xvcjogI2YwZjBmZjsNCiAgICBib3JkZXI6ICNkMGQwZGQgc29saWQgMXB4Ow0KICAgIGZsb2F0OiByaWdodDsNCiAgICBmb250LXNpemU6IC45ZW07DQogICAgbWFyZ2luOiAxMnB4IDAgNXB4IDEycHg7DQogICAgd2lkdGg6IDIwMHB4Ow0KfQ0KDQoudG9jIG9sIHsNCiAgICBtYXJnaW46IDVweDsNCiAgICBwYWRkaW5nLWxlZnQ6IDMwcHg7DQp9DQoNCi5lbnRyeSA+IC50b2Mgew0KICAgIG1hcmdpbi10b3A6IDBweDsNCn08L2NvZGU+
เมื่อใส่ไปแล้ว การแสดงผลก็จะมีความสวยงามยิ่งขึ้น สามารถปรับแต่งได้ตามต้องการซึ่งการใช้ปลั๊กอินนี้ในการเขียนบทความ จะเห็นได้ว่าทำให้บทความดูน่าอ่านยิ่งขึ้นเพราะสามารถเห็นภาพรวมต่าง ๆของบทความได้อย่างชัดเจน
สรุปบทความอีกครั้ง ในการสร้างสารบัญทำดังนี้
1. ใส่โค้ดไว้ในบทความในโหมด HTML ณจุดที่ต้องการให้แสดงสารบัญ
2. ใส่ tags
และ
คลุมหัวข้อหลัก และ
และ
คลุมหัวข้อย่อย
ส่วน css นั้นจะแก้ไขหรือไม่แก้ไขก็ได้เป็นการปรับแต่งเพื่อการแสดงผลที่สวยงามเท่านั้น
หมายเหตุ: โค้ด css นี้ได้นำมาจากไฟล์ style.css ของผู้พัฒนาเองครับ
เรียนรู้ wordpess กับสรินญา 