Menu
CoddyTech

Наследование шаблонов

Часть раздела Основы Django путешествия по Django на Coddy. Урок 17 из 23.

home.html и drinks.html повторяют один и тот же <head>, а вскоре в них появится и панель навигации. Измените каркас — и придётся редактировать каждый файл. Вместо этого каркас задаётся одним шаблоном, а страницы заполняют его.

В каркасе отмечается часть, которую заполняет страница, с помощью тега {% block %} и имени. Файл library/base.html библиотеки:

<body>
    <nav>...</nav>
    <article>{% block body %}{% endblock %}</article>
</body>

Страница начинается с {% extends %}, а затем заполняет блок:

{% extends "library/base.html" %}

{% block body %}
    <p>We are open until 20:00.</p>
{% endblock %}
{% extends %} должен быть первым тегом. На странице, которая наследует другой шаблон, всё, что находится за пределами блока, отбрасывается: заголовок, который вы забудете заключить в блок, исчезнет.
challenge icon

Задание

Средне
  • В base.html помести пустой блок с именем content внутри <main>.
  • Сделай так, чтобы home.html и drinks.html расширяли "menu/base.html", разместив собственный HTML внутри этого блока.

Нажми Запустить: на обеих страницах отображается навигация из base.html.

Попробуйте сами

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Corner Café</title>
</head>
<body>
    <nav>
        <a href="{% url 'menu:home' %}">Home</a>
        <a href="{% url 'menu:drinks' %}">Drinks</a>
        <a href="{% url 'menu:about' %}">About</a>
    </nav>
    <main>
        <!-- each page's content goes here -->
    </main>
</body>
</html>

Все уроки раздела Основы Django

Потренируйтесь самостоятельно: Песочница Django