อะแฮ่มๆ สวัสดีวันใหม่ครับ อีกไม่นานก็จะถึงวันคริสต์มาส จากนั้นก็วันสิ้นปีแล้วนะครับ เร็วดีเนอะ หยุดปีใหม่พี่น้องไปเที่ยวไหนกันบ้างครับ บักสนเองก็จะสู่มาตุภูมิ ไปรับลมหนาวเต็มที่ครับ ฮ่าๆ สำหรับวันนี้ผมมีภาพ infographic เกี่ยวกับ WordPress Theme มาฝากครับ
ถ้าหากว่าคุณผู้อ่านสนใจที่อยากจะทำ ธีมของ WordPress เป็น อย่างแรกที่เราจำเป็น “ต้องรู้” โครงสร้างของ WordPress ว่าแต่ละส่วน “เรียกว่า” อะไร จากนั้นดูว่ามัน “ทำงาน” อย่างไร ใช้ “คำสั่ง” แบบไหน เพียงแค่นี้เราก็จะทำธีมได้เองแล้วแหล่ะครับ บางคนบอกว่าศึกษามานานแต่ก็ยังทำธีมเองไม่เป็นสักกะที จริงๆแล้ว เท่าที่ผมสังเกตและอาศัยประสบการณ์ส่วนตัว มันมาจาก เราพากันเรียนหรือศึกษาโดย “ไร้ขั้นตอน” หมายความว่า ที่เราอ่านกันเยอะแต่ยังทำไม่เป็นสักกะที เพราะว่าเราเรียนรู้แบบสะเปะสะปะ อ่ะครับ เหมือนนับเลข 1 3 4 9 7 6 2 5 4 อะไรแบบนี้ครับ คือนับครบ แต่อาจจะเรียงลำดับความคิดผิด ทำให้ดูสับสนงงงวยกับชีวิต วันนี้ผมจะมาบอกครับว่าคุณควรรู้อะไร หากอยากเป็นนักพัฒนาธีม WordPress
[thetext]Anatomy of a WordPress theme[/thetext]
การจะสร้าง theme wordpress มาสักธีม มันจะมีไฟล์ที่สำคัญๆอยู่ 4 อย่างครับ นั่นคือไฟล์ Header.php ไฟล์ index.php ไฟล์ style.css และไฟล์ footer.php ครับผม (ซึ่งจากสามไฟล์นี้มันก็ค่อยๆแตกตัวออกเป็นไฟล์อื่นๆได้อีกเรื่อยๆ แต่หลักๆ มีแค่สามไฟล์นี้ธีมเราก็ใช้งานได้แล้ว .. แต่ก็ได้แค่แบบเบสิกมาก) มาดูกันว่าแต่ละไฟล์มันคืออะไร
[thetext]header.php[/thetext]
ไฟล์นี้มันเป็นไฟล์ที่ใช้งาน Global ในเว็บของเราเลยครับ ส่วนมากจะเอาไว้เก็บค่าพวก header และเมนูต่าง ถ้าหากคิดถึงภาษา HTML มันก็คือตั้งแต่เริ่มต้นตั้งแต่ <html> ไล่ไปจนถึง </header> หรือจะต่อไป <body> xxx อะไรก็ว่ากันไปครับ
[thetext]index.php[/thetext]
ไฟล์นี้คือไฟล์ “หน้าหลัก” ของเว็บไซต์ครับ เราอยากให้เว็บหน้าแรกของเราเป็นอย่างไร ก็เขียนลงในไฟล์ index.php นี่แหล่ะครับ ไฟล์นี้เป้นไฟล์ “สุดท้าย” ที่ WordPress จะเรียกใช้งาน (หากอยากรุ้ว่าลำดับการเรียกไฟล์ของ WordPress เป็นอย่างไร ให้ค้นหาคำว่า WordPress Hierarchy ใน google ดูนะครับ) อีกอย่างหนึ่งที่ผมอยากให้ท่านผู้อ่านรู้ก็คือ “ลำดับ” การเรียกไฟล์ของ WordPress ครับ เราต้องเข้าใจว่า ไฟล์แรกที่ WordPress เรียกคือไฟล์ไหน ถ้าไม่เจอมันจะเรียกตัวไหนแทน แล้วถ้าไม่เจอตัวต่อมา มันจะเรียกตัวไหนมาแทนอีก ซึ่งแบบนี้เราเรียกว่า Hierarchy นั่นเอง
** Hierarchy ก็ยกตัวอย่างเช่น เหมือนกับว่า เรากำลังจะเรียกใช้คนจากกลุ่มๆหนึ่ง ที่มีสมาชิก 5 คน ตอนแรกเรียก นาย A ให้มาทำงานให้ แต่นาย A ไม่อยู่ เราก็เรียกนาย B แทน ถ้า B ไม่อยู่ ก็เรียกนาย C แทน แบบนี้ไปเรื่อยๆ จนกระทั่งเรียกคนในกลุ่มนั้นจนครบ หากไม่อยู่สักคน งานก็จะทำไม่ได้ ธีมเราก็จะ “เจ๊ง” นั่นเองครับ ซึ่งหากเปรียบกับ WordPress คนสุดท้ายที่จะถูกเรียกก็คือ index.php นั่นเอง (ดังนั้นไฟล์อื่นๆไม่มีไม่เป็นไร แต่ index.php จำเป็นต้องมี ไม่งั้น ก็เจ๊ง)
[thetext]footer.php[/thetext]
สำหรับไฟล์นี้ไม่มีอะไรมากครับ ก็เอาไว้เขียนภาษา HTML ทั่วไป จนกระทั่งถึง </body></html> นั่นเอง แ่ต่มันก็เป็นไฟล์ Global ของธีมเหมือนไฟล์ Header.php ครับ จำเป็นต้องมี
[thetext]style.css[/thetext]
ไฟล์นี้เป็นไฟล์ style sheet เอาไว้เขียนควบคุมการแสดงผลในเว็บเรานั่นเองครับ ไฟล์นี้จะถูกเรียกใช้ในส่วนของ header.php นั่นเอง
ซึ่งหลักๆ ไฟล์พวกนี้มันเป็นไฟล์พื้นฐานของ WordPress อยู่่แล้ว ถ้าเราต้องการเว็บที่มีความสามารถมากกว่านี้ เราก็ต้องเขียนไฟล์อื่นๆเพิ่มขึ้นมาเพื่อใช้งานเฉพาะเจาะจง เช่น sing.php page.php category.php comment.php functions.php ซึ่งอันนี้ท่านผุ้อ่านต้องดูจาก hierarchy ของธีม WordPress อย่างที่ผมแนะนำไปตามด้านบนครับ ลองอ่านแล้วทำตามดู ผมว่าไม่นานเราก็จะพัฒนาธีม WordPress ได้แล้วครับ
[thetext]บทส่งท้าย[/thetext]
สำหรับคนที่อยากทำ WordPress Theme ได้ เราต้อง “จัดลำดับความคิด” ให้เหมาะสม รู้ว่าควรรู้ตรงไหนก่อน แล้วค่อยทำขั้นตอนต่อไป แบบนี้จะทำให้เรารู้และเข้าใจกระบวนการทำงานได้ดียิ่งขึ้นครับ สำหรับคำแนะนำของผมก็คือ “ให้รู้ว่ามีไฟล์อะไรบ้าง” “แต่ละไฟล์ทำงานอย่างไร” “หากไม่มีไฟล์นี้จะใช้ไฟล์ไหนแทน” แค่นี้แหล่ะครับ ลองดูเน้อ แล้วเจอกันใหม่บทความหน้าครับผม
** ขอบคุณรูปภาพประกอบ โดยคุณ Joost de Valk
