WordPress Child Theme คือ..

ลองนึกภาพดูว่าคุณได้ธีมง่ายๆ มาหนึ่งธีม เอามาปรับแต่งโน่นนี่ซะเยอะแยะ เวลาผ่านไปธีมนั้นมีการอัปเกรดเกิดขึ้น คุณก็จัดการอัปเกรดให้เป็นเวอร์ชั่นล่าสุดซะ แต่แล้วก็พบว่า ไอ้ที่คุณปรับแต่งไปแล้ว มันหายไปหมด นี่แหละคือปัญหาหลักที่ทำให้เกิดระบบ Parent/ Child Theme เข้ามาแก้ไข

Parent/ Child Theme

Parent Theme อย่างที่ชื่อบอก มันก็คือธีมหลักที่ต้องติดตั้งไว้เป็นพื้นฐานก่อน จากนั้นค่อย Activate Child Theme ที่จะทำงานเหมือนเป็นเสื้อผ้าหน้าผมให้ Parent Theme อีกทีหนึ่ง ถ้าปราศจาก Parent แล้ว Child ก็จะทำงานไม่ได้เลย ตรงส่วนของ Child Theme นี้เองที่จะเก็บข้อมูลการปรับแต่งธีมของคุณไว้ทั้งหมดโดยไม่ไปแตะต้องกับ Parent Theme ทำให้ Parent theme สามารถถูกอัปเกรดได้ตลอด โดยไม่ทำให้การปรับแต่งของคุณเสียหายไป

ติดตั้ง child theme - parent theme แยกกัน

การติดตั้ง

ถ้าคุณเผื่อไปซื้อ Theme ที่ใช้ระบบ Parent/ Child Theme อย่าง Wootheme Listing BookClub การติดตั้ง ก็ต้องทำให้แน่ใจว่าโฟล์เดอร์ของทั้งสองธีมนั้น อยู่คนละโฟล์เดอร์กันอย่างเหมือนไม่ได้รู้จักกันมาก่อนคือโฟล์เดอร์หนึ่ง: Listing Theme ก็ต้องใส่ไว้ใน wp-content/theme และอีกโฟล์เดอร์คือ B0okclub ก็จะอยู่ที่เดียวกันนี้เลย ไม่ใช่เอา Bookclub ไปใส่ไว้ในโฟล์เดอร์ Listing Theme อย่างที่ผมเองก็เคยเข้าใจผิด

สร้าง Child Theme ใช้เอง

Child theme จะใช้ฟังค์ชั่นการทำงานทั้งหมดจากแม่ของมัน และทั้งสองธีมจะทำงานร่วมกันได้ก็จากไฟล์ Style.css ทีนี้มาดูตัวอย่างกัน

สมมุติว่าผมจะสร้าง Child Theme ขึ้นมา ผมก็จะต้องมี Style.css ก่อน สร้างไฟล์นี้โดยเอามาจากธีมแม่อะไรก็ได้ที่คุณใช้ แล้วใส่โค้ดต่อไปนี้:

/*
Theme Name:	DML Premium - Child theme
Theme URI:	http://www.woothemes.com
Description:	A basic child theme for DML Premium
Author:		Joe
Author URI:	http://www.woothemes.com
Template:	my-parent
Version:	2.1
*/

ตรงบรรทัด Template: my-parent คือส่วนที่สำคัญที่จะบอกว่าแม่ของ Child theme นี้คือใคร (ต้องตรงกับชื่อโฟล์เดอร์ของ Parent Theme แปะๆ) ดังนั้นในกรณนี้ โฟล์เดอร์ของ Parent Theme จะชื่อ my-parent นั่นเองครับ

ต่อมา Child Theme จะต้องพึ่งพาฟังค์ชั่นของแม่มัน และเราก็ต้องป้องกันไม่ได้ Child Theme เขียน Style.css ไปทับกับ Parent ดังนี้น ธีมลูกจะต้องเรียกหาธีมแม่ ด้วยคำสั่ง:

@import url("../magazine-premium/style.css");

ซึ่งใส่ต่อเข้าไปในบรรทัด Version ได้เลย จากนั้นก็ Save ใส่เข้าไปใน Child Theme Folder เช่น My-Child-Theme/style.css ก็เป็นอันเสร็จเรียบร้อย ทีนี้พอคุณ Activate Child มันก็ควรจะมีหน้าตาเหมือนกับแม่มันไม่ผิดเพี้ยน และพร้อมให้คุณปรับแต่งได้โดยไม่ต้องห่วงว่าเวลาอัปเกรดธีมแม่ จะทำให้อะไรหายไปอีก

แน่นอนว่า การปรับแต่งธีมคงจะมีมากกว่าการเปลี่ยนค่าใน Style.css (ไฟล์ Style นี้เปลี่ยนได้แค่สีสัน ขนาด ประเภทฟอนต์ และอะไรที่เกียวกับหน้าตา ไม่ใช่การทำงานของธีม) อย่างถ้าคุณจะเปลี่ยนสัดส่วนขยับขยายเอา sidebar ออกจากหน้าแรก คุณต้องปรับจาก index.php ไฟล์โดยตรง เหมือนกับถ้าจะแปลงหน้าโพสเดี่ยวก็ต้องไปที่ single.php โดยตรง แล้วจะทำยังไงเพราะตอนนี้ Child theme มีแค่ style.css ไม่ยากครับ ก็ก็อปไฟล์ต่างๆ ที่ต้องการปรับแต่งมาจากธีมแม่ของมัน แค่นั้นเองจริงๆ อ่านเพิ่มเติมได้จาก http://codex.wordpress.org/Child_Themes

 

 

Leave a Reply

Your email address will not be published. Required fields are marked *