در طراحی وب‌سایت‌ها با استفاده از فریم‌ورک جنگو، یکی از مراحل پر اهمیت و اساسی، استفاده از تمپلیت‌های اصلی است. تمپلیت اصلی به شما اجازه می‌دهد تا بخش‌های مشترک و ثابت درونی صفحات وب‌سایت خود را در یک فایل جداگانه تعریف کنید و از تکرار کدهای مشابه در صفحات مختلف جلوگیری کنید.
به عنوان مثال، سربرگ و پانوشت (footer) هر صفحه وب معمولا یکسان است. با استفاده از تمپلیت‌های اصلی، می‌توانید این قسمت‌ها را در یک فایل ذخیره کرده و در سایر صفحات به سادگی از آن‌ها استفاده کنید. به این ترتیب، تمامی صفحات شما از یک قالب واحد پیروی می‌کنند و اگر نیاز به تغییر در ساختار کلی داشته باشید، کافی است تنها در فایل تمپلیت اصلی تغییرات را انجام دهید.
در جنگو، این قابلیت با استفاده از ارث‌بری تمپلیت‌ها (template inheritance) امکان‌پذیر است. در ادامه نحوه افزودن تمپلیت اصلی در جنگو را با مثالی ساده بررسی خواهیم کرد.
برای شروع، ابتدا یک فایل HTML با ساختار کلی صفحه خود به عنوان تمپلیت اصلی تعریف کنید. این فایل می‌تواند شامل سربرگ، نوار کناری (sidebar)، و پانوشت باشد. در این فایل از بلوک‌های مختلف استفاده کنید تا بخش‌های متغیر صفحات دیگر در آن قرار گیرد.
سپس از ارث‌بری تمپلیت در فایل‌های HTML صفحات مختلف استفاده کنید تا محتوای خاص هر صفحه در مکان‌های تعریف شده، قرار گیرد.
<!-- base.html -->
<!DOCTYPE html>
<html lang="fa">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>صفحه اصلی</title>
</head>
<body>
<header>
<h1>سایت من</h1>
</header>
<nav>
<ul>
<li><a href="/">خانه</a></li>
<li><a href="/about">درباره ما</a></li>
</ul>
</nav>
<main>
{% block content %}{% endblock %}
</main>
<footer>© 2023 سایت من</footer>
</body>
</html>
در فایل base.html که در بالا آمده، ساختار کلی صفحه وب‌سایت تعریف شده است. از تگ <header> برای نمایش هدر استفاده کرده‌ایم و با کمک تگ <nav> نوار ناوبری ایجاد کرده‌ایم. قسمت <main> با یک بلوک محتوا مشخص شده که محتوای خاص هر صفحه در آن قرار می‌گیرد.
سربرگ صفحه با تگ <header> و عنوان سایت نمایان می‌شود. اینجا تگ <h1> را به این منظور بکار برده‌ایم که عنوان اصلی سایت را نمایش دهیم.
نوار ناوبری با المان <nav> و لیست آیتم‌ها با <ul> و <li> ایجاد شده‌اند. لینک‌ها به صفحات مختلف سایت با تگ <a> درون لیستی به کار گرفته شده‌اند.
قسمت اصلی هر صفحه با تگ <main> مشخص شده که بلک content درون آن تعریف شده است و محتوای خاص و متغیر هر صفحه از طریق این بخش اضافه خواهد شد.
در نهایت، پانوشت صفحه با تگ <footer> در انتهای فایل آمده که کپی‌رایت سایت در آن قرار دارد.