Skip to content

1. Basics

Templates in Django are used to separate HTML presentation logic from the backend Python logic. They allow you to dynamically generate web pages using Django’s template language.

1. How Templates Work in Django

Django templates:

  • Contain HTML with Django Template Language (DTL) (e.g., {% for %}, {% if %}, {{ variable }}).
  • Help render dynamic content from views.
  • Allow reuse and modularization using base templates.

2. Creating and Using Templates

Step 1: Define a Template in Your App

Inside your app directory (e.g., blog), create a templates/ folder:

blog/
├── templates/
│ ├── blog/
│ │ ├── post_list.html

Now, define an HTML file inside templates/blog/post_list.html:

<!DOCTYPE html>
<html>
<head>
<title>Blog Posts</title>
</head>
<body>
<h1>Blog Posts</h1>
{% for post in posts %}
<h2>{{ post.title }}</h2>
<p>{{ post.content }}</p>
{% endfor %}
</body>
</html>

Step 2: Render the Template in Views

In views.py, use render() to return an HTML page:

from django.shortcuts import render
from .models import Post
def post_list(request):
posts = Post.objects.all() # Fetch all posts
return render(request, 'blog/post_list.html', {'posts': posts})

3. Defining TEMPLATES Directory in settings.py

By default, Django looks for templates inside each app’s templates/ folder. However, you can define a global templates/ folder in your project.

Step 1: Create a Global templates/ Directory

Create a templates/ folder in the project’s root directory:

myproject/
├── templates/
│ ├── base.html

Step 2: Configure settings.py

Tell Django to look in the global templates/ directory:

import os
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates')], # Add this line
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
  • DIRS: Specifies additional directories where Django looks for templates.
  • APP_DIRS: Enables Django to look inside each app’s templates/ folder.

4. Using Base Templates for Reusability

Step 1: Create a base.html

Define a common layout in templates/base.html:

<!DOCTYPE html>
<html>
<head>
<title>{% block title %}My Website{% endblock %}</title>
</head>
<body>
<header>
<h1>My Blog</h1>
<nav>
<a href="/">Home</a>
<a href="/about/">About</a>
</nav>
</header>
<main>
{% block content %}{% endblock %}
</main>
<footer>
<p>&copy; 2024 My Blog</p>
</footer>
</body>
</html>

Step 2: Extend base.html in Other Templates

Now, use {% extends "base.html" %} in child templates.

Example: templates/blog/post_list.html

{% extends "base.html" %}
{% block title %}Blog Posts{% endblock %}
{% block content %}
<h1>Blog Posts</h1>
{% for post in posts %}
<h2>{{ post.title }}</h2>
<p>{{ post.content }}</p>
{% endfor %}
{% endblock %}

5. Benefits of Base Templates

Reduces Repetition – Define headers, footers, and navigation only once.
Easy Maintenance – Change layout in base.html, and all pages update automatically.
Consistent Design – Ensures a unified look across all pages.