Django, a popular Python web framework, offers a robust templating engine that enables developers to create dynamic and data-driven web pages. Django templates provide a seamless way to separate the design and presentation logic from the business logic of your application. In this guide, we’ll delve into Django templates, explore their features, and provide you with practical examples to help you master the art of creating dynamic web pages.
Table of contents
1. Introduction to Django Templates
Django templates are a powerful tool for generating HTML dynamically. They allow you to inject data from your application into HTML files, making it possible to create dynamic and data-driven web pages without mixing Python code directly into your HTML.
2. Basic Template Syntax
Django templates use double curly braces {{ }} to enclose template variables. For example:
<h1>Hello, {{ user.username }}!</h1>3. Template Variables
Template variables represent dynamic data from your application. They can be simple values, attributes of objects, or the results of function calls:
<p>Your account balance: ${{ account.balance }}</p>4. Template Filters
Filters allow you to format and manipulate template variables. For instance:
<p>Joined on: {{ user.join_date|date:"F d, Y" }}</p>5. Template Tags
Template tags are enclosed in curly braces {% %} and provide control structures and logic in your templates. An example of an if tag:
{% if user.is_authenticated %}
<p>Welcome back, {{ user.username }}!</p>
{% else %}
<p>Please log in to access your account.</p>
{% endif %}6. Template Inheritance
Template inheritance allows you to create a base template with common structure and placeholders for content. Child templates then extend the base template and override specific blocks with their content:
<!-- base.html -->
<!DOCTYPE html>
<html>
<head>
<title>{% block title %}Default Title{% endblock %}</title>
</head>
<body>
<div class="content">
{% block content %}{% endblock %}
</div>
</body>
</html><!-- child.html -->
{% extends "base.html" %}
{% block title %}Custom Title{% endblock %}
{% block content %}
<p>This is the content of the child template.</p>
{% endblock %}7. Conditional Rendering
You can use template tags like {% if %} and {% else %} for conditional rendering:
{% if product.in_stock %}
<p>This product is available.</p>
{% else %}
<p>This product is currently out of stock.</p>
{% endif %}8. Looping in Templates
Loop through lists or querysets using the {% for %} tag:
<ul>
{% for item in shopping_list %}
<li>{{ item }}</li>
{% endfor %}
</ul>9. Including Templates
Reuse commun components across templates using the {% include %} tag:
{% include "header.html" %}
<p>This is the main content.</p>
{% include "footer.html" %}10. Custom Template Tags and Filters
Extend Django’s template engine by creating your own custom template tags and filters to perform specialized operations:
# custom_tags.py
from django import template
register = template.Library()
@register.filter
def double(value):
return value * 2<!-- template.html -->
<p>Twice the value: {{ some_value|double }}</p>11. Template Context
Context is a dictionary that holds the template variables and their values. It’s passed to the template when rendering:
from django.shortcuts import render
def my_view(request):
context = {'username': 'Alice'}
return render(request, 'template.html', context)<!-- template.html -->
<p>Hello, {{ username }}!</p>Django templates empower you to create dynamic, responsive, and interactive web pages while maintaining a clear separation of concerns. By harnessing the power of template variables, filters, tags, and inheritance, you can create visually appealing and data-rich web applications efficiently.
Remember that Django’s template engine provides much more than what’s covered here, so don’t hesitate to refer to the official documentation for further exploration and to enhance your skills with this essential tool for web development.