Template Inheritance

    Sounds complicated but is very basic. It’s easiest to understand it by starting with an example.

    In this example, the {% block %} tags define four blocks that child templates can fill in. All the block tag does is tell the template engine that a child template may override those portions of the template.

    Child Template

    1. {% extends "layout.html" %}
    2. {% block title %}Index{% endblock %}
    4.   <style type="text/css">
    5.     .important { color: #336699; }
    6.   </style>
    8.   <h1>Index</h1>
    9.   <p class="important">
    10.     Welcome on my awesome homepage.

    The tag is the key here. It tells the template engine that this template “extends” another template. When the template system evaluates this template, first it locates the parent. The extends tag must be the first tag in the template. To render the contents of a block defined in the parent template, use {{ super() }}.