การสืบทอดเทมเพลตด้วย extends และ block
สร้างเค้าโครงพื้นฐานและเขียนทับส่วนต่าง ๆ
การสืบทอดเทมเพลตด้วย extends และ block เป็นบทเรียน Django Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน Django Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส Django Academy มีบทเรียนทั้งหมด 4 บทเรียน
บางส่วนของบทเรียนนี้ยังไม่ได้รับการแปล และแสดงเป็นภาษาอังกฤษ
Stop Repeating Layout
Every page shares a header, nav, and footer. Template inheritance lets you write that shell once and reuse it everywhere. 🧱
Start with a Base
A base template holds the common HTML skeleton. Child pages will plug their unique content into spots you leave open.
base.htmlDefine a block
A block marks a section a child can replace. You name it, leave optional default content, then close it with endblock.
{% block content %}{% endblock %}A Minimal Base File
This base wraps a title block and a content block in real HTML. Children will fill those two named holes.
<html><head><title>{% block title %}Site{% endblock %}</title></head>
<body>{% block content %}{% endblock %}</body></html>Children Use extends
The extends tag must be the first line of a child template. It tells Django which base layout to build upon.
{% extends "base.html" %}Override a block
In the child you redefine a block with the same name. Whatever you put inside replaces the base default for that page.
{% extends "base.html" %}
{% block content %}<h1>Welcome</h1>{% endblock %}Unfilled Blocks Use Defaults
If a child skips a block, the base content shows instead. That makes a default a safe placeholder for shared text.
Keep Parent Content with super
Call block.super to keep the parent block content and add your own around it, instead of replacing it entirely.
{% block content %}{{ block.super }}<p>Extra</p>{% endblock %}Inheritance Can Nest
A child can itself be a base for deeper pages. Layered layouts let sections share a sub-shell while still using the global one.
extends Goes First
Only one extends is allowed and it must lead the file. Anything before it, even a comment, breaks the inheritance.
Blocks Build Pages
Think of a page as a base full of blocks that children fill. This keeps every page consistent and edits in one place.
Quick Check
Recall how a child connects to its layout.
Recap: Write Layout Once
You learned to define blocks in a base and fill them with extends in children, even keeping parent content via block.super. Next: linking routes and assets.
คำถามที่พบบ่อย
บทเรียน “การสืบทอดเทมเพลตด้วย extends และ block” ฟรีหรือไม่
ใช่ — ข้อความเต็มของ “การสืบทอดเทมเพลตด้วย extends และ block” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส Django Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส Django Academy มีบทเรียนทั้งหมด 4 บทเรียน
คุณจะเรียนรู้อะไรในบทเรียน “การสืบทอดเทมเพลตด้วย extends และ block”
สร้างเค้าโครงพื้นฐานและเขียนทับส่วนต่าง ๆ คุณปฏิบัติ Django Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน
คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน Django Academy หรือไม่
ไม่จำเป็นต้องมีประสบการณ์มาก่อน Django Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน
บทเรียน “การสืบทอดเทมเพลตด้วย extends และ block” ใช้เวลานานแค่ไหน
บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย
ฉันเขียนและรันโค้ดในบทเรียน Django Academy นี้ได้ไหม
ได้ บทเรียน Django Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ
บทเรียนทั้งหมดในหลักสูตรนี้
- render() และบริบทของเทมเพลต
- แท็กและตัวกรองของเทมเพลต
- การสืบทอดเทมเพลตด้วย extends และ block
- แท็ก url และแท็ก static