- Template inheritance is a powerful feature in the Django web framework that allows you to create reusable and modular templates.
- It enables you to define a base template with common elements and then build child templates that inherit from the base template. The child templates can override specific sections or add additional content while inheriting the structure and layout of the base template.
- This approach helps in reducing code duplication and maintaining consistency across multiple pages of a website.
- Here is our django folder structure:
- django_app/urls.py
from django.contrib import admin
from django.urls import path, include
from django.views.generic import TemplateView
urlpatterns = [
path("", TemplateView.as_view(template_name='base.html')),
path("app/", include("app.urls")),
path('admin/', admin.site.urls)
]
- Base Template (templates/base.html):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}{% endblock %}</title>
</head>
<body>
<header>
<h1>My Website</h1>
</header>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/app">App</a></li>
</ul>
</nav>
<div id="content">
{% block content %}
{% endblock %}
</div>
<footer>
© 2023 My Website
</footer>
</body>
</html>
- In the base template, we define the basic structure of our web page. It includes an HTML doctype, head, body, header, navigation, content section, and a footer. We use Django template tags `{% block %}` to define sections that can be overridden in the child templates. In this case, we have two blocks: `title` and `content`.
- http://127.0.0.1:8000/
- app/urls.py
from django.urls import path
from . import views
urlpatterns = [
path("", views.handleHome, name="home")
]
- app/views.py
from django.shortcuts import render
def handleHome(request):
return render(request, "app/index.html")
- Child Template (templates/app/index.html):
{% extends "base.html" %}
{% block title %}App - My Website{% endblock %}
{% block content %}
<h2>Welcome to the App Page</h2>
<p>This is the content of the Django App page.</p>
{% endblock %}
- In the child template, we use the `{% extends %}` template tag to specify that this template extends (inherits from) the base template, "base.html". The child template can override any block defined in the base template, and it can also add new blocks.
- In this example, we override the `title` block to set the title of the App's home page. We also override the `content` block to provide the specific content for the App's home page.
- http://127.0.0.1:8000/app/
- When a user requests the App's home page, Django will automatically render the child template with the content provided in the blocks. The child template will inherit the entire structure and layout from the base template, including the header, navigation, and footer. Only the overridden or added content will be different.
- This way, you can create multiple child templates that inherit from the base template, overriding and adding content as needed, while maintaining a consistent structure and layout across your website. Template inheritance helps in organizing your code, promoting code reusability, and simplifying maintenance.
No comments:
Post a Comment