Базовый шаблон Django

У всех сайтов есть свой стиль, своя обложка, которая не меняется от страницы к странице. Внутри этой рамки меняется только контент, но сама рамка остаётся неизменной. Вот, например, как это выглядит на Хабре:

Но что, если вам захочется поменять что-то в этой обложке? Например, логотип. Придётся менять логотип в каждом шаблоне вашего сайта. Это совершенно неудобно и порождает копипасту: однажды вы пропустите один из шаблонов и на каких-то страницах будет старый логотип, а на каких-то — новый. Чтобы такое избежать, можно вынести “обложку” в отдельный файл, и сказать, что это базовый шаблон. Вот как он может выглядеть:

Файл blog-base.html

{% load static %}
<html>
    <head>
        <title>Django Girls blog</title>
        <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
        <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
        <link href="//fonts.googleapis.com/css?family=Lobster&subset=latin,latin-ext" rel="stylesheet" type="text/css">
        <link rel="stylesheet" href="{% static `css/blog.css` %}">
    </head>
    <body>
            {% block content %}
            {% endblock %}
    </body>
....

В этом файле только “обложка” блога. Вместо “контента” здесь загадочная надпись {% block content %}.

Чтобы воспользоваться этой обложкой, нужно сделать 2 вещи: сказать, где лежит обложка и определить, что будет лежать в {% block content%}.

Указать путь можно с помощью тега extends:

{% extends 'blog-base.html' %}

Далее тут же определяем блок контента в файле index.html:

{% extends 'blog-base.html' %}

{% block content %}
  <header class="header_area">
  {% for post in posts %}
    {{post.title}}
  {% endfor %}
  ...
{% endblock %}

Django поймёт, что вы хотите воспользоваться базовым шаблоном и найдёт его в файле blog-base.html, который указан в extends. Дальше она найдёт в нём блок {% block content %} и подставит туда такой же блок из файла index.html.

Теперь все странички можно подключать к blog-base.html, чтобы получить обложку, а сам контент определять внутри {% block content %}.

Попробуйте бесплатные уроки по Python

Получите крутое код-ревью от практикующих программистов с разбором ошибок и рекомендациями, на что обратить внимание — бесплатно.

Переходите на страницу учебных модулей «Девмана» и выбирайте тему.

Хочу код-ревью