วิธีสร้างธีมลูกใน WordPress (โดยทางโปรแกรมและปลั๊กอิน)

เผยแพร่แล้ว: 2020-06-11

คุณต้องการปรับแต่งการออกแบบเว็บไซต์ของคุณและสร้างความประทับใจให้กับผู้เยี่ยมชมของคุณหรือไม่? ในคู่มือนี้ เราจะแสดง วิธีสร้างธีมลูกใน WordPress ทั้งที่มีการเข้ารหัสเล็กน้อย และด้วยปลั๊กอิน

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

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

ธีมเด็กคืออะไร?

พูดง่ายๆ ก็คือ ธีมลูกคือธีม เพิ่มเติม ที่คุณสร้างขึ้นซึ่งสืบทอดการออกแบบและรูปลักษณ์ของธีมหลักที่มีอยู่ ธีมลูกยังสืบทอดฟังก์ชันและคุณลักษณะทั้งหมดของธีมหลัก ซึ่งคุณสามารถแก้ไขได้ด้วย

แต่ถ้ามันมีการออกแบบและการทำงานเหมือนกับธีมหลัก ทำไมคุณถึงต้องการธีมลูก มีข้อดีบางประการในการสร้างธีมลูกใน WordPress ประการหนึ่ง คุณสามารถแยกการ ปรับแต่ง จากธีมหลักแยกกันและปรับแต่งทีละรายการได้ ตัวอย่างเช่น คุณสามารถเปลี่ยนแปลงโค้ดของธีมย่อยได้ และการปรับแต่งนี้จะยังคงแยกจากธีมหลัก ดังนั้นไฟล์ในธีมหลักจะไม่ได้รับผลกระทบ

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

นักพัฒนายังสามารถใช้ธีมลูกเพื่อสร้างการออกแบบธีมใหม่ได้อย่างรวดเร็ว เมื่อใช้ธีมลูก พวกเขาจะไม่ต้องเริ่มต้นใหม่ทั้งหมด และพวกเขาสามารถเลือกแก้ไขธีมหลักเพื่อให้เข้ากับการออกแบบธีมของพวกเขาได้เช่นกัน

ประโยชน์ของธีมลูก

สรุปได้ว่า ถ้าคุณต้องการความยืดหยุ่นที่ดีขึ้นสำหรับการปรับแต่งธีมของคุณ การใช้ธีมย่อยเป็นแนวคิดที่ยอดเยี่ยม ประโยชน์หลักบางประการเมื่อใช้ธีมลูกคือ:

  • การปรับแต่งใดๆ ที่คุณทำกับธีมย่อยจะแยกออกจากพาเรนต์ และจะไม่ถูกเปลี่ยนกลับหรือสูญหายหลังจากอัปเดต
  • ไม่มีความเสี่ยงที่จะทำลายธีมหลักหรือไฟล์ในธีมหลักของคุณโดยไม่ได้ตั้งใจ
  • นักพัฒนาสามารถใช้ธีมลูกและธีมหลักเพื่อประหยัดเวลาในการพัฒนาโดยการสร้างการออกแบบธีมที่ยืดหยุ่นและเฟรมเวิร์กของธีม
  • ธีมย่อยนั้นมีน้ำหนักเบามาก และคุณสามารถย้อนกลับการเปลี่ยนแปลงใด ๆ ได้เสมอโดยเพียงแค่ปิดการใช้งานหรือลบธีมย่อย

ตอนนี้เราได้อธิบายเหตุผลที่คุณควรพิจารณาใช้ธีมลูกแล้ว มาดูวิธีสร้างธีมลูกใน WordPress กันดีกว่า

วิธีสร้างธีมลูกใน WordPress

มี 2 ​​วิธีหลักในการสร้างธีมลูกใน WordPress:

  1. การใช้ปลั๊กอิน
  2. โดยทางโปรแกรม

ทั้งสองวิธีมีข้อดีและข้อเสีย ดังนั้นควรใช้วิธีที่เหมาะสมกับทักษะและความต้องการของคุณมากที่สุด

1) สร้างธีมลูกโดยใช้ปลั๊กอิน WordPress

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

สำหรับคู่มือนี้ เราจะใช้ปลั๊กอิน Child Theme Generator หากคุณต้องการดูตัวเลือกอื่นๆ เราขอแนะนำให้คุณตรวจสอบรายการปลั๊กอิน WordPress Child Theme ที่ดีที่สุด

หลังจากตัดสินใจเลือกส่วนเสริมที่คุณต้องการแล้ว คุณจำเป็นต้องติดตั้ง ดังนั้น เปิด WP Admin Dashboard ของคุณ วางเมาส์เหนือ Plugins แล้ว คลิก Add New จากนั้น ใช้แถบค้นหาที่ด้านบนขวาเพื่อค้นหาปลั๊กอินที่คุณกำลังจะติดตั้ง เรากำลังจะทำการติดตั้ง Child Theme Generator

สร้างธีมลูกใน WordPress - ชื่อปลั๊กอิน

จากนั้น ติดตั้ง ปลั๊กอินที่คุณต้องการ เมื่อการติดตั้งเสร็จสิ้น ให้กด เปิดใช้งาน อีกวิธีหนึ่ง คุณยังสามารถเปิด/ปิดใช้งานปลั๊กอินของคุณได้โดยไปที่ ปลั๊กอิน > ปลั๊กอินที่ติดตั้ง ในแถบด้านข้างของคุณ

สร้างธีมลูกใน WordPress - ติดตั้งปลั๊กอิน

วิธีสร้างธีมลูกด้วยปลั๊กอินสร้างธีมลูก

เมื่อคุณติดตั้งและเปิดใช้งานปลั๊กอินแล้ว ให้เปิดอินเทอร์เฟซของปลั๊กอินโดยคลิกที่ การตั้งค่า > Child-Theme Gen

สร้างธีมลูกใน WordPress - ส่วนต่อประสานปลั๊กอิน

จากนั้น ภายใต้แท็บ สร้างใหม่ คุณสามารถกรอกรายละเอียดต่างๆ เกี่ยวกับธีมลูกของคุณ

เพียงเลือกธีมที่คุณต้องการให้เป็นธีมหลัก เพิ่มส่วนหัวของธีม คำอธิบาย URL ของธีมย่อย ผู้แต่ง และรายละเอียดธีมอื่นๆ ที่นี่ คุณยังสามารถเลือกที่จะเพิ่มใบอนุญาต GNU GPL พร้อมกับไฟล์ธีมของคุณได้

เมื่อเสร็จแล้ว ให้คลิก สร้างธีมลูกใหม่ และธีมย่อยจะถูกสร้างขึ้นตามรายละเอียดที่คุณป้อน

จากนั้น คุณสามารถเปลี่ยนหรือเปิดใช้งานได้โดยไปที่ ลักษณะที่ ปรากฏ > ธีม เลือกธีมย่อยที่สร้างขึ้นใหม่ แล้ว เปิดใช้งาน

แค่นั้นแหละ! คุณเพิ่งสร้างธีมลูกของคุณ! ตอนนี้คุณสามารถปรับแต่งและทำการเปลี่ยนแปลงทั้งหมดที่คุณต้องการ

ตอนนี้ มาดูวิธีที่คุณสามารถสร้างธีมลูกโดยทางโปรแกรมโดยไม่ต้องใช้ปลั๊กอิน

2) สร้างธีมลูกโดยทางโปรแกรม

หากคุณไม่ต้องการติดตั้งปลั๊กอินใดๆ คุณสามารถ สร้างธีมลูกของ WordPress โดยทางโปรแกรม ต้องใช้การเข้ารหัสเล็กน้อย แต่ก็ยังค่อนข้างง่ายสำหรับผู้เริ่มต้น สิ่งที่คุณต้องทำคือสร้างโฟลเดอร์ของธีมลูกของคุณ และสร้างไฟล์สองสามไฟล์ในนั้น

เปิดใช้งานธีมหลัก

ดังนั้น ก่อนอื่น คุณต้อง เปิดใช้งานธีมหลัก ที่คุณต้องการสร้างธีมย่อยจากบนเว็บไซต์ของคุณ

จากนั้น คุณต้องใช้แผงควบคุมการโฮสต์เว็บของเว็บไซต์ของคุณและเข้าถึงโฟลเดอร์เซิร์ฟเวอร์ของคุณ คุณจะต้องใช้ตัวจัดการไฟล์ของแผงควบคุมหรือไคลเอนต์ FTP เพื่อเปิดโฟลเดอร์ธีมของไซต์ อยู่ภายใต้ public_html/wp-content/themes

ขั้นตอน

เมื่อคุณพบโฟลเดอร์ของธีมแล้ว ให้ทำตามขั้นตอนง่ายๆ เหล่านี้:

1) สร้างโฟลเดอร์ ภายในไดเร็กทอรีธีมด้วยชื่อธีมลูกของคุณ ในตอนนี้ เราจะใช้ Demo Child Theme คุณยังสามารถใช้ชื่อธีมหลักของคุณ ตามด้วยคำต่อท้ายย่อย เพื่อให้จัดการได้ง่ายขึ้น ตัวอย่างเช่น Flash-Child หรือ Blacklite-Child

2) จากนั้น สร้าง ไฟล์ style.css และคัดลอกโค้ดต่อไปนี้ภายในไฟล์ style.CSS

 /*
ชื่อธีม: ธีมย่อยสาธิต
แม่แบบ: Blacklite
URL ธีม: Quadlayers.com/blog
คำอธิบาย: Demo Child Theme
ผู้เขียนธีม: Quadlayers
URL ของผู้เขียน: Qualayers.com
เวอร์ชัน: 1.0.0
*/

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

3) ถัดไป สร้างไฟล์ชื่อ Functions.php ภายในโฟลเดอร์ธีมลูก และคัดลอกโค้ดต่อไปนี้:

 <?php
add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
ฟังก์ชัน enqueue_parent_styles () {
wp_enqueue_style( 'รูปแบบหลัก', get_template_directory_uri().'/style.css' );
}
?>

4) บันทึกทั้งสองไฟล์แล้วไปที่ Dashboard > Appearance > Themes คุณจะเห็นธีมลูกใหม่พร้อมคำอธิบายที่คุณแทรกไว้ในโฟลเดอร์ Style.CSS ของคุณ!

และนั่นคือวิธีที่คุณสร้างธีมลูกใน WordPress โดยทางโปรแกรม ทีนี้มาดูวิธีการปรับแต่งกัน

วิธีปรับแต่ง WordPress Child Theme ของคุณ?

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

ปรับแต่งธีม CSS . ของคุณ

ขั้นแรก ไปที่ ลักษณะที่ ปรากฏ > ปรับแต่ง เพื่อเปิดตัวปรับแต่งธีมของคุณ จากนั้นคลิก CSS เพิ่มเติม บนเมนูแถบด้านข้าง

สร้างธีมลูกใน WordPress - ตัวปรับแต่ง

ที่นี่ คุณสามารถเพิ่มโค้ด CSS ที่จะเขียนทับการตั้งค่าธีมของคุณได้โดยตรง ตัวอย่างเช่น คุณสามารถเพิ่มโค้ดเล็กๆ นี้:

 พี {
สี: เทา;
}
พี {
ตระกูลแบบอักษร: Helvetica;
ขนาดตัวอักษร: 18px;
}

และเมื่อคุณแทรกข้อมูลโค้ดเล็กๆ นั้น คุณจะเห็นการเปลี่ยนแปลงในเครื่องมือปรับแต่ง Live เราต้องการสีเพิ่มอีกเล็กน้อย เรามาเปลี่ยนสีพื้นหลังของแถบวิดเจ็ตของไซต์ของคุณกัน:

 .widget {
พื้นหลัง: #00FFFF;
ช่องว่างภายใน: 25px;
}

ตอนนี้ มาเพิ่มโค้ดพิเศษเพื่อลบส่วนท้ายลิขสิทธิ์ “ขับเคลื่อนโดย WordPress”:

 .site-info { แสดง: ไม่มี; }

เสร็จแล้ว คุณได้ปรับแต่งธีมลูกของคุณด้วย CSS เล็กน้อย นี่เป็นเพียงการเกาพื้นผิวของการดัดแปลงเหล่านี้ มีอีกมากที่คุณสามารถทำได้

ปรับแต่งไฟล์ Theme Functions.php ของคุณ

คุณสามารถปรับแต่งไฟล์ธีมของคุณได้โดยตรงโดยไปที่ Appearance > Theme Editor จากนั้นคลิกที่ไฟล์ Functions.php เพื่อเพิ่มฟังก์ชันที่กำหนดเองให้กับธีมของคุณ

สร้างธีมลูกใน WordPress - ฟังก์ชั่น

ตัวอย่างเช่น หากต้องการ ปิดใช้งานการคลิกขวา บนเว็บไซต์ของคุณ ให้เพิ่มบรรทัดของโค้ดเหล่านี้ลงในไฟล์ Functions.php ของคุณ:

 ฟังก์ชั่น your_function() {
?>
<script>
jQuery(เอกสาร).พร้อม(ฟังก์ชั่น(){
jQuery (เอกสาร). ผูก ("เมนูบริบท", ฟังก์ชั่น (จ) {
คืนค่าเท็จ;
});
});
</script>
<?php
}
add_action('wp_footer', 'your_function');

จากนั้นคลิก อัปเดตไฟล์

สุดท้าย หากคุณทำบางสิ่งผิดพลาด คุณสามารถลบธีมลูกของคุณ สร้างธีมใหม่ แล้วเริ่มต้นใหม่ทั้งหมดโดยไม่กระทบกับธีมหลักของคุณ

บทสรุป

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

นี้อาจฟังดูซับซ้อน แต่ก็ไม่ สิ่งที่ต้องทำคือเพิ่มโค้ดเล็กน้อยลงในไฟล์ธีมและจัดการสองโฟลเดอร์

อย่างไรก็ตาม ไม่ใช่ว่าผู้ใช้ทุกคนอาจพบว่าการสร้างและสร้างธีมย่อยโดยทางโปรแกรมเป็นเรื่องง่าย โดยเฉพาะสำหรับผู้เริ่มต้น หากเป็นกรณีของคุณ คุณสามารถใช้ปลั๊กอินเพื่อสร้างธีมได้ หากคุณประสบปัญหาใดๆ โปรดทิ้งความคิดเห็นไว้ แล้วเราจะแก้ไขให้ทันที

สุดท้ายนี้ หากคุณต้องการปรับแต่งธีมของคุณ ให้มากยิ่งขึ้น คุณสามารถดูคำแนะนำของเราเกี่ยวกับ วิธีแก้ไขส่วนท้าย และ วิธีปรับแต่งส่วนหัวใน WordPress