Django 'include' template tag

  • In Django, the `{% include %}` template tag allows you to include the content of another template within the current template. It enables you to reuse and modularize your code by breaking it into smaller, reusable components.
  • The basic syntax of the `{% include %}` template tag is as follows:


    {% include "template_name" %}

  • Here, `"template_name"` refers to the name of the template file you want to include with extension. You can specify the template name as a string, enclosed in quotes, and provide the path to the template file relative to the template directory.
  • 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="{% url 'app1'%}">App1</a>
                </li>
                <li>
                    <a href="{% url 'app2' %}">App2</a>
                </li>
            </ul>
        </nav>

        <div id="content">
            {% block content %}
            {% endblock %}
        </div>

        <footer>
            &copy; 2023 My Website
        </footer>
    </body>

    </html>

  • templates/app1/nav.html

    <h1>This is included template</h1>
    <h1>hello world</h1>

  • templates/app1/index.html

    {% extends "base.html" %}

    {% block title %}App1 - My Website{% endblock %}

    {% block content %}

    {% include "./nav.html" %}

    <h1>This is App1</h1>

    {% endblock %}


  • When Django processes this template, it will replace the `{% include %}` tag with the content of the specified template file.
  • You can also pass context variables to the included template by providing them after the template name. For example:
  • templates/app1/nav.html

    <h1>This is included template</h1>
    <h1>hello world</h1>
    <h1>{{title}}</h1>

  • templates/app1/index.html

    {% extends "base.html" %}

    {% block title %}App1 - My Website{% endblock %}

    {% block content %}

    {% include "./nav.html" with title="My Website" %}

    <h1>This is App1</h1>

    {% endblock %}

  • In this case, the `title` variable will be available within the included template, allowing you to dynamically render content based on the provided value.
  • Additionally, you can use the `{% include %}` tag within conditional blocks or loops to include templates conditionally or multiple times based on certain conditions.
  • Here's an example of using `{% include %}` within a loop:

    {% for item in items %}
        {% include "includes/item.html" with item=item %}
    {% endfor %}

  • In the above code, the `item.html` template will be included for each item in the `items` list, and the `item` variable will be available within the included template.
  • Overall, the `{% include %}` template tag in Django provides a powerful way to reuse and organize your template code, making it easier to maintain and update your web application.

No comments:

Post a Comment

Primitive Types in TypeScript

In TypeScript, primitive types are the most basic data types, and they are the building blocks for handling data. They correspond to simple ...