Template Tags and Filters in Django


Django templates support template tags and filters to add logic and formatting to the HTML content. Template tags allow control structures like loops and conditionals, while filters are used to modify variables' output. This article explains template tags and filters with examples.

Template Tags in Django

Template tags are enclosed within {% %} delimiters and allow adding logic or functionality to templates. Django includes several built-in template tags.

1. The for Tag

The for tag is used to iterate over a list or queryset.

            <ul>
            {% for item in items %}
                <li>{{ item }}</li>
            {% endfor %}
            </ul>
        

View function:

            def home(request):
                context = {'items': ['Apples', 'Bananas', 'Cherries']}
                return render(request, 'home.html', context)
        

This renders a list of items in an unordered list.

2. The if Tag

The if tag is used for conditional logic in templates.

            {% if user_is_logged_in %}
                <p>Welcome back!</p>
            {% else %}
                <p>Hello, Guest!</p>
            {% endif %}
        

View function:

            def home(request):
                context = {'user_is_logged_in': True}
                return render(request, 'home.html', context)
        

3. The include Tag

The include tag is used to render another template within the current template.

            {% include 'header.html' %}
        

Create a header.html template:

            <header>This is the header content.</header>
        

4. The block and extends Tags

These tags are used for template inheritance. Example:

            
            <html>
            <head>
                <title>{% block title %}Default Title{% endblock %}</title>
            </head>
            <body>
                {% block content %}{% endblock %}
            </body>
            </html>
        
            
            {% extends 'base.html' %}

            {% block title %}Home Page{% endblock %}
            {% block content %}
                <h1>Welcome to the Home Page!</h1>
            {% endblock %}
        

Template Filters in Django

Template filters modify the display of variables. They are applied using a pipe | symbol.

1. The date Filter

The date filter formats a date object.

            <p>Current Date: {{ today|date:"F d, Y" }}</p>
        

View function:

            from datetime import date

            def home(request):
                context = {'today': date.today()}
                return render(request, 'home.html', context)
        

This will render the current date as "November 27, 2024".

2. The lower and upper Filters

These filters convert strings to lowercase or uppercase.

            <p>Lowercase: {{ text|lower }}</p>
            <p>Uppercase: {{ text|upper }}</p>
        

View function:

            def home(request):
                context = {'text': 'Hello World'}
                return render(request, 'home.html', context)
        

This will render:

  • Lowercase: hello world
  • Uppercase: HELLO WORLD

3. The length Filter

The length filter returns the length of a list or string.

            <p>Number of items: {{ items|length }}</p>
        

View function:

            def home(request):
                context = {'items': ['Apples', 'Bananas', 'Cherries']}
                return render(request, 'home.html', context)
        

This will render: "Number of items: 3".

4. The default Filter

The default filter provides a default value if a variable is None or empty.

            <p>Status: {{ status|default:"Not Available" }}</p>
        

View function:

            def home(request):
                context = {'status': None}
                return render(request, 'home.html', context)
        

This will render: "Status: Not Available".

5. The join Filter

The join filter concatenates a list into a string.

            <p>Items: {{ items|join:", " }}</p>
        

View function:

            def home(request):
                context = {'items': ['Apples', 'Bananas', 'Cherries']}
                return render(request, 'home.html', context)
        

This will render: "Items: Apples, Bananas, Cherries".

Combining Tags and Filters

Template tags and filters can be combined for complex logic and formatting. Example:

            {% for item in items %}
                <p>{{ item|upper }}</p>
            {% endfor %}
        

This will display each item in uppercase.

Conclusion

Django's template tags and filters provide powerful tools to control logic and formatting in templates. By using these features, you can create dynamic and flexible templates to suit your application's needs.





Advertisement