blockタグ

blockタグ

Djangoはblockタグと呼ばれるHTMLファイルに埋め込めるタグがあります。
それを使うことで継承した親テンプレート(一般的にはbase.html)の中身を子テンプレートで書くことが出来ます。
ここまでの例で言うと

{% block main %}{% block js %}

のように使われてきたもののことです。

親テンプレート(base.html)の作成

base.htmlには基本的にすべてを共通して使いたいものを書き、それを継承することで、同じコードを何度も書くのを防いでくれます。

では継承した子テンプレートでそれぞれ別のことが書きたい時はどうしたらいいのでしょう?

まさにそんなときに使用するのがblockタグです。

例えば<body></body>中身だけそれぞれのテンプレートで書きたいとしましょう。
その場合は<body>タグの中にblockタグを書きます。


{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sample App</title>
    <link href="{% static 'assets/css/bootstrap.css' %}" rel="stylesheet" />
</head>
<body>
{% block main %}{% endblock %}
</body>
<script src="{% static 'assets/js/bootstrap.min.js' %}" type="text/javascript"></script>
</html>

<body>
{% block main %}{% endblock %}
</body>

この部分ですね。
{% block main %}{% endblock %}としていますが、なんでも大丈夫です。

{% block content %}{% endblock %}でも

{% block body %}{% endblock %}でも大丈夫です。

子テンプレートで継承して中身を作成

{% extends 'base.html' %}
{% load static %}

{% block main %}
<p>ここに内容を書く</p>
{% endblock %}

{% extends 'base.html' %}base.htmlを継承します。

{% block main %}
<p>ここに内容を書く</p>
{% endblock %}

これでそれぞれのテンプレートでそれぞれの内容を書くことが出来るようになりました。