ทำไมควรสร้าง Child Theme และเคล็ดลับทำให้ง่ายขึ้น [WordPress]

WordPress ขับเคลื่อนเว็บไซต์ประมาณ 23% ผู้ใช้มักต้องปรับแต่งธีม การแก้ไขไฟล์ธีมโดยตรงมีปัญหาใหญ่: เมื่ออัปเดทธีม การปรับแต่งทั้งหมดจะหายไป นี่คือที่มาของการสร้าง Child Theme

Child Theme คืออะไร?

Child Theme เป็นธีมกำหนดเองที่สืบทอดฟังก์ชันและสไตล์จากธีมหลัก (Parent Theme) การสร้าง Child Theme ให้ปรับแต่งธีมหลักได้ และเก็บการเปลี่ยนแปลงไว้แม้ธีมหลักอัปเดท

ตอนนี้รู้ Child Theme แล้ว มาดูวิธีสร้างและแนวทางปฏิบัติที่ดีที่สุด

เริ่มต้น

ใช้ธีม Twenty Fifteen สำหรับบทช่วยสอนนี้ แต่ใช้ได้กับธีมใดก็ได้

สร้าง Child Theme: ไปที่ไดเรกทอรี "wp-content/themes" สร้างโฟลเดอร์ใหม่ เช่น "twentyfifteen-child"

สร้างไฟล์ "style.css" ในโฟลเดอร์ Child Theme ใส่เนื้อหาดังนี้:

/* Theme Name: Twenty Fifteen Child Theme URI: https://www.maketecheasier.com Description: Twenty Fifteen Child Author: Ayo Isaiah URI: https://www.maketecheasier.com/author/ayoisaiah Template: twentyfifteen Version: 1.0.0 */

เปลี่ยนชื่อธีม URI คำอธิบาย ชื่อผู้เขียน ให้เกี่ยวข้องกับ Child Theme ของคุณ ส่วน "Template" ต้องเป็นชื่อไดเรกทอรีของธีมหลัก ในกรณีนี้คือ "twentyfifteen" หากใช้ธีมอื่น อย่าลืมอัปเดต Template ไม่งั้น Child Theme จะเสีย

ขั้นตอนต่อไปคือการ enqueue ไฟล์สไตล์ของธีมหลักอย่างถูกต้อง เพื่อ Child Theme สืบทอดสไตล์และต่อยอดจากที่นี่ บางเว็บแนะนำใช้ @import แต่ไม่ใช่แนวทางปฏิบัติที่ดีที่สุดแล้ว ควรหลีกเลี่ยง

วิธีที่ดีที่สุดคือสร้างไฟล์ "functions.php" ในโฟลเดอร์ Child Theme ใส่โค้ด:

<?php add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' ); function theme_enqueue_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); } ?>

ทริคคือแทนที่ "parent-style" ด้วยไดเรกทอรีธีมหลักพร้อม "-css" ท้าย ในกรณีนี้ "parent-style" จะเป็น "twentyfifteen-css"

เสร็จแล้ว Child Theme พร้อมเปิดใช้งาน

เปิดใช้งาน Child Theme

การเปิดใช้งาน Child Theme เหมือนธีมทั่วไป ไปที่ "หน้าตา -> ธีม" บนแดชบอร์ด WordPress และเปิดใช้งาน Child Theme

สร้าง Child Theme ด้วยปลั๊กอิน

หากต้องการเร่งกระบวนการ ใช้ปลั๊กอินฟรีสร้างอัตโนมัติ One-Click Child Theme ทำได้คลิกเดียว ติดตั้งและเปิดใช้งาน แล้วไป "หน้าตา -> Child Theme" บนแดชบอร์ด กรอกฟอร์มรายละเอียด Child Theme กด "Create Child" เพื่อสร้างและเปิดใช้งาน

การปรับแต่ง

ตอนนี้ธีมเปิดใช้งานแล้ว ดูเว็บไซต์จะเหมือนธีมหลัก จากจุดนี้ เพิ่ม CSS กำหนดเองใน style.css ของ Child Theme เพื่อทับสไตล์ธีมหลัก สไตล์ที่ประกาศใน Child Theme จะมีความสำคัญกว่า และอัปเดทธีมหลักได้โดยไม่กลัวหายงาน

หากต้องการเพิ่มฟังก์ชันใหม่ ให้ประกาศฟังก์ชันใน "functions.php" ของ Child Theme จะโหลดพร้อมกับ functions.php ของธีมหลัก

ไฟล์เทมเพลตอื่นๆ

ไฟล์ PHP อื่นๆ ต้องคัดลอกไปไดเรกทอรี Child Theme แล้วปรับแต่งที่นี่ เพราะไม่เหมือน functions.php ไฟล์เทมเพลตของธีมหลักจะถูกละเว้น ใช้ไฟล์ของคุณแทน ต้องวางไฟล์ต้นฉบับในตำแหน่งเดียวกันใน Child Theme เหมือนธีมหลัก เพื่อให้ทำงานราบรื่น

สรุป

ตอนนี้รู้ว่าทำไม Child Theme จำเป็นสำหรับการปรับแต่งเว็บไซต์ และวิธีสร้างแล้ว ไม่มีเหตุผลให้แก้ไขไฟล์ธีมโดยตรง หากต้องการขclaircเพิ่ม แจ้งในความคิดเห็น หรืออ่าน WordPress Codex สำหรับข้อมูลเพิ่มเติมเกี่ยวกับ Child Theme