วิธีสร้าง Child Template ใน Joomla

สร้าง Child Template ได้จากหน้าจัดการไฟล์เทมเพลตของ Joomla โดยเลือกเทมเพลตหลัก สั่งสร้างเทมเพลตลูก แล้วเพิ่มไฟล์ที่ต้องการปรับ เช่น user.css วิธีนี้ช่วยเก็บการปรับแต่งไว้ในเทมเพลตแยกจากไฟล์หลัก

❶ เตรียมก่อนสร้าง Child Template

เลือก Site Template ที่ต้องการใช้เป็นต้นแบบ และสำรองเว็บไซต์ก่อนเริ่มปรับแต่ง หากต้องการทดสอบ ให้สร้าง Child Template บนเว็บไซต์สำเนาก่อน

① ตรวจว่าเทมเพลตมีคำสั่งสร้าง Child Template

ฟังก์ชันนี้อยู่ในหน้าจัดการไฟล์เทมเพลตของ Joomla หากไม่พบปุ่ม Create Child Template ให้ตรวจเวอร์ชัน Joomla และข้อมูลจากผู้พัฒนาเทมเพลต

② วางแผนว่าจะปรับแต่งอะไร

จดรายการไฟล์หรือส่วนที่ต้องการเปลี่ยน เช่น สีและระยะห่างผ่าน CSS หรือ Layout ของหน้า เพื่อสร้างเฉพาะไฟล์ที่จำเป็น

❷ สร้าง Child Template

① เปิด Site Template

ใน Joomla 5 ไปที่ System → Templates Panel → Site Templates แล้วเลือกเทมเพลตหลักที่ต้องการ

② เลือก Create Child Template

ในหน้ารายละเอียดไฟล์ของเทมเพลต เลือก Create Child Template เมื่อหน้าต่างสร้างเทมเพลตปรากฏขึ้น ให้ตั้งชื่อ Child Template แล้วกดยืนยัน

③ เปิด Child Template ที่สร้างแล้ว

ปิดหน้ารายละเอียดเทมเพลตหลัก กลับไปที่รายการ Site Templates แล้วเปิดชื่อ Child Template ที่เพิ่งสร้าง เพื่อตรวจโครงสร้างไฟล์และเพิ่มการปรับแต่ง

❸ เพิ่มไฟล์ CSS กำหนดเอง

ตัวอย่างนี้ใช้ user.css เพื่อเปลี่ยนสีหัวข้อในเทมเพลตที่ใช้โครงสร้างเดียวกับ Cassiopeia

① สร้างไฟล์ในโฟลเดอร์ css

จากหน้ารายละเอียดไฟล์ของ Child Template เลือก New File แล้วเลือกโฟลเดอร์ css ตั้งชื่อไฟล์เป็น user เลือกชนิดไฟล์ .css จากนั้นกดสร้าง

② เพิ่ม CSS ที่ต้องการ

ตัวอย่าง CSS เปลี่ยนสีหัวข้อ:

h1,
h2,
h3 {
  color: #174a7e;
}

บันทึกไฟล์และตรวจว่า CSS ที่เพิ่มใช้กับโครงสร้างของเทมเพลตนั้นได้จริง หากชื่อคลาสหรือรูปแบบ HTML ต่างกัน อาจต้องปรับตัวเลือก CSS

③ ทดสอบการแสดงผล

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

❹ เลือกหน้าให้ใช้ Child Template

หลังสร้าง Child Template แล้ว ให้ตรวจว่ามี Template Style ของเทมเพลตลูกอยู่ในรายการ

① เปิดรายการ Site Templates Styles

ไปที่ System → Templates Panel → Site Templates Styles แล้วค้นหาสไตล์ของ Child Template

② เลือกว่าจะใช้กับหน้าใด

หากต้องการใช้ทั้งเว็บไซต์ ให้กำหนดสไตล์เป็น Default หากต้องการใช้เฉพาะบางหน้า ให้เปิดสไตล์แล้วเลือกเมนูในส่วน Menu Assignment

③ ตรวจหน้าเว็บหลังบันทึก

เปิดหน้าที่กำหนดไว้และตรวจว่าเทมเพลตลูกทำงานตามต้องการ หากไม่เห็นผล ให้ตรวจว่าเมนูหน้านั้นใช้ Template Style ที่ถูกต้อง

❺ เช็กก่อนใช้งานจริง

• สำรองข้อมูลก่อนสร้างหรือแก้ไฟล์
• สร้างเฉพาะไฟล์ที่จำเป็นใน Child Template
• ตรวจว่าไฟล์อยู่ในโฟลเดอร์และชนิดที่ถูกต้อง
• ทดสอบ CSS และ Layout บนหน้าสำคัญ
• ตรวจผลบนมือถือและคอมพิวเตอร์
• ทดสอบหลังอัปเดต Joomla หรือเทมเพลตหลัก

สำหรับเว็บไซต์ที่ ComSiam ดูแล ควรบันทึกชื่อ Child Template และรายการไฟล์ที่ปรับไว้ เพื่อให้ตรวจสอบและแก้ไขต่อได้สะดวก

❻ สรุป

ไปที่ Site Templates เปิดเทมเพลตหลัก แล้วเลือก Create Child Template จากนั้นเปิดเทมเพลตลูก เพิ่มไฟล์กำหนดเอง เช่น user.css และกำหนด Template Style ให้กับหน้าที่ต้องการ ก่อนใช้งานจริงให้ทดสอบหน้าเว็บและสำรองข้อมูลไว้ การแยกไฟล์ปรับแต่งไว้ใน Child Template ช่วยให้ ComSiam จัดการการเปลี่ยนแปลงโดยไม่ต้องแก้ไฟล์หลักโดยตรง