ในบทความนี้ ฉันจะแสดงวิธีง่ายๆ ในการสร้างธีมลูกเมื่อใช้ WordPress Block Themes

สารบัญ

บล็อกภาพรวมโดยย่อของธีม

ด้วยการเปิดตัว WordPress 6.0 ทีมงาน WordPress ได้ทุ่มเทให้กับ Block Themes เพื่อทำให้การออกแบบและปรับแต่งเว็บไซต์ง่ายขึ้นกว่าที่เคยโดยไม่ต้องใช้โค้ดเพียงเล็กน้อยหรือไม่มีเลย Block Themes ใช้ “Block Editor” หรือที่เรียกว่า “Gutenberg Block Editor” เพื่อให้ผู้ใช้สามารถลากและวางองค์ประกอบการออกแบบลงบนหน้าเว็บ คุณสมบัตินี้ทำให้ WordPress สามารถแข่งขันกับผู้สร้างเว็บไซต์และผู้สร้างธีมได้มากขึ้น โดยเฉพาะอย่างยิ่งเนื่องจาก WordPress นั้นฟรีทั้งหมดและใช้งานไปแล้วกว่า 60% ของเว็บไซต์ 10 ล้านอันดับแรกบนอินเทอร์เน็ต

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

เหตุใดธีมเด็กจึงมีความสำคัญ

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

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

WordPress ประยุกต์: วิธีสร้างหลักสูตรเว็บไซต์ที่มีประสิทธิภาพโดย Davies Media Design

สร้างธีมลูกสำหรับธีมบล็อกของคุณ

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

สำหรับผู้เริ่มต้น ให้ลงชื่อเข้าใช้ WordPress Dashboard ของคุณและไปที่ Plugins>Add New (ลูกศรสีแดงในภาพด้านบน)

วิธีนี้ใช้ปลั๊กอินที่พัฒนาโดยทีม WordPress โดยตรง ซึ่งหมายความว่าปลั๊กอินได้รับการปรับให้ทำงานร่วมกับ WordPress และบล็อกธีมเวอร์ชันล่าสุด

จากพื้นที่ทำงาน "เพิ่มปลั๊กอิน" ให้ค้นหาปลั๊กอิน "สร้างบล็อกธีม" โดยใช้แถบค้นหา (แสดงเป็นสีเขียวในภาพด้านบน ไปทางขวาบน) เมื่อคุณเห็นปลั๊กอินอยู่ในผลการค้นหา ให้คลิก “ติดตั้งทันที” (ลูกศรสีแดง)

เมื่อติดตั้งปลั๊กอินเสร็จแล้ว ปุ่ม “ติดตั้งเดี๋ยวนี้” จะเปลี่ยนเป็นสีน้ำเงินและพูดว่า “เปิดใช้งาน” คลิกปุ่ม “เปิดใช้งาน” (ลูกศรสีแดงในภาพด้านบน)

เมื่อเปิดใช้งานปลั๊กอินเรียบร้อยแล้ว คุณจะเข้าสู่พื้นที่ทำงาน "ปลั๊กอิน" ของ WordPress และจะเห็นข้อความที่ระบุว่า "เปิดใช้งานปลั๊กอินแล้ว" ที่ด้านบน (ลูกศรสีเขียวในภาพด้านบน) จากที่นี่ ไปที่ลักษณะที่ปรากฏ>สร้างบล็อกธีม (ลูกศรสีแดง)

เมื่อเข้าไปในพื้นที่ทำงาน "สร้างชุดรูปแบบบล็อก" ให้เลือกตัวเลือกตัวเลือก "สร้างชุดรูปแบบลูกของ Twenty Twenty-Three" (หรือชื่อชุดรูปแบบใดก็ตามที่คุณกำลังสร้างชุดรูปแบบรอง - ลูกศรสีแดงในภาพด้านบน)

กล่องข้อความจำนวนมากจะปรากฏขึ้นทางด้านขวาของหน้าต่าง ช่องข้อความบนสุดที่มีป้ายกำกับว่า "ชื่อธีม" (ลูกศรสีน้ำเงิน) เท่านั้นที่บังคับ ที่เหลือเป็นทางเลือกทั้งหมด สำหรับชื่อธีมของคุณ เป็นแนวปฏิบัติมาตรฐานในการตั้งชื่อธีมย่อยของคุณว่า “TwentyTwentyThree-child” หากธีมหลักของคุณเรียกว่า “TwentyTwentyThree” เป็นต้น

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

คลิกปุ่ม "สร้าง" (ลูกศรสีเขียว)

การดำเนินการนี้จะเริ่มดาวน์โหลดไฟล์ zip ที่มีธีมลูกของคุณโดยอัตโนมัติ คุณสามารถคงชื่อไฟล์ตามที่ปรากฏ (ลูกศรสีแดงในภาพด้านบน) คลิก “บันทึก” เพื่อบันทึกไฟล์ลงในคอมพิวเตอร์ของคุณ (ลูกศรสีน้ำเงิน)

ไฟล์ zip จะถูกดาวน์โหลดไปยังคอมพิวเตอร์ของคุณ ในแถบดาวน์โหลดที่ด้านล่างของเบราว์เซอร์ ให้คลิกลูกศรถัดจากการดาวน์โหลดที่เสร็จสิ้น (ลูกศรสีเขียว) แล้วคลิก “แสดงในโฟลเดอร์” (ลูกศรสีแดง) เพื่อเปิดไฟล์ zip ที่ดาวน์โหลดมาในหน้าต่าง File Explorer ของคุณ (หากคุณ ใช้ Windows อีกครั้ง – บน MAC เปิดการดาวน์โหลดใน File Explorer ของคุณ)

เปิดหน้าต่าง File Explorer นี้ไว้และไฟล์ zip ที่มีธีมลูกของคุณเลือกไว้ (ลูกศรสีเขียว) - เราจะต้องใช้สิ่งนี้ในขั้นตอนต่อไป

กลับไปที่ WordPress และไปที่ส่วน "ธีม" ภายใต้ลักษณะที่ปรากฏ (ลูกศรสีแดงในภาพด้านบน) คลิกปุ่ม "เพิ่มใหม่" ทางด้านบนของพื้นที่ทำงานของธีม (ลูกศรสีน้ำเงิน)

ในพื้นที่ทำงาน "เพิ่มธีม" คุณจะเห็นช่องตรงกลางหน้าต่างพร้อมปุ่ม "เลือกไฟล์" (ลูกศรสีแดง) คุณสามารถคลิกปุ่มนี้และเลือกไฟล์ zip ที่เราเพิ่งดาวน์โหลดสำหรับธีมลูก หรือเปิดหน้าต่าง File Explorer ที่เรานำทางไปก่อนหน้านี้ แล้วลากและวางไฟล์ zip ที่ใดก็ได้ภายในช่องนี้

ในรูปภาพด้านบนนี้ คุณจะเห็นว่าฉันลากไฟล์ zip ไปที่ช่องโดยตรงแล้วปล่อยเมาส์

ตอนนี้ คุณจะเห็นไฟล์ธีม XNUMXtwentythreechild.zip แสดงอยู่ภายในกล่อง (ลูกศรสีเขียว) และปุ่ม "ติดตั้งเดี๋ยวนี้" ปรากฏขึ้น (ลูกศรสีแดง) คลิก “ติดตั้งทันที” เพื่อเริ่มการติดตั้งธีมลูก

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

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

เมื่อเปิดใช้งานธีมสำเร็จ คุณจะกลับไปที่พื้นที่ทำงาน "ธีม" ด้านบนจะมีข้อความแสดงข้อความว่า “เปิดใช้ธีมใหม่แล้ว (ระบุเป็นสีเขียวในภาพด้านบน) คุณจะเห็นรายการธีมแรกซึ่งตอนนี้ดูเหมือนจะเป็นธีมว่าง – แสดงโดยพื้นหลังกระดานหมากรุก ซึ่งมักจะแสดงถึงความโปร่งใสในโลกการออกแบบ ที่ด้านล่างของหน้าตัวอย่างธีมนี้ คุณจะเห็นข้อความว่า “คล่องแคล่ว: ยี่สิบยี่สิบสามลูก” (ลูกศรสีแดง)

หมายความว่าคุณได้ติดตั้งธีมลูกสำเร็จแล้ว! การแสดงตัวอย่างธีมแบบโปร่งใสแสดงถึงข้อเท็จจริงที่ว่าธีมลูกของคุณมีเพียงการปรับแต่งธีมเท่านั้น และองค์ประกอบสไตล์และการออกแบบอื่นๆ ทั้งหมดจะแสดงในธีมหลัก (ในกรณีนี้คือธีม “TwentyTwentyThree”) ตรวจสอบให้แน่ใจว่าคุณไม่ได้ลบธีมหลักเพราะจะทำให้ไซต์ของคุณเสียหาย นอกจากนี้ ตรวจสอบให้แน่ใจว่าคุณอัปเดตธีมหลักอยู่เสมอ (ด้วยเหตุผลด้านความปลอดภัย) โดยคลิกลิงก์อัปเดต/การแจ้งเตือนที่ปรากฏสำหรับธีม

คุณสามารถดูตัวอย่างไซต์ปัจจุบันของคุณโดยเปิดใช้ธีมย่อยโดยคลิกลิงก์ "เยี่ยมชมไซต์" ที่ปรากฏในข้อความแสดงความสำเร็จ (ลูกศรสีน้ำเงินในภาพด้านบน)

ในกรณีนี้ คุณจะเห็นไซต์ของฉันแสดงเป็นธีมเริ่มต้นของ TwentyTwentyThree (ธีมหลักของฉัน – ฉันไม่ได้ทำการเปลี่ยนแปลงใดๆ กับธีม TwentyTwentyThree ก่อนที่ฉันจะเริ่มบทช่วยสอนนี้) นั่นหมายความว่าธีมลูกติดตั้งสำเร็จแล้ว!

เพียงเท่านี้สำหรับบทช่วยสอนนี้ คุณสามารถตรวจสอบอื่น ๆ ของฉัน บทความช่วยเหลือ WordPress บนเว็บไซต์ของฉัน หรือเจาะลึกลงไปใน WordPress กับ my WordPress สำหรับผู้เริ่มต้น 2023 – ไม่มีรหัส WordPress Masterclass.

Davies Media Design จดหมายข่าวอีเมลแอปสร้างสรรค์ฟรี

สมัครรับจดหมายข่าว DMD

ลงทะเบียนเพื่อรับบทช่วยสอนใหม่ การอัปเดตหลักสูตร และข่าวสารล่าสุดเกี่ยวกับแอปสร้างสรรค์ที่คุณชื่นชอบฟรี!

คุณสมัครเรียบร้อยแล้ว!

Pin It เมื่อ Pinterest