🔰

【Django】{% block xxxx %} ←xxxxは何? 【超初心者向け】

2025/01/26に公開

この記事はhtmlに

html
{% block title %}{% endblock %}
{% block content %}{% endblock %}
{% block footer %}{% endblock %}
{% block sidebar %}{% endblock %}
{% block css %}{% endblock %}

という記述が出てきて困惑している人向けの記事です。(私のこと)

{% block %}と{% endblock %}は何?

{% block %}と{% endblock %}は
Djangoテンプレート言語(Django Template Language, DTL)の構文です。

これはDjangoの特徴的な機能の1つで、以下のような特殊な記号で囲まれています

{% %} - テンプレートタグ(制御構文)用
{{ }} - 変数を表示する用
{# #} - コメント用

{% block xxxx %} ←xxxxは何?

「xxxx」は{% block %}ブロックの名前で、
開発者が自由に設定できる識別子です。

ですので、前述の

html
{% block title %}{% endblock %}
{% block content %}{% endblock %}
{% block footer %}{% endblock %}
{% block sidebar %}{% endblock %}
{% block css %}{% endblock %}

は、ブロックを区別できるように任意の名前をつけた状態、
ということになります。

名前は任意ですが、わかりやすい名前をつけるのがよく、

title → ページタイトル用
content → メインコンテンツ用
css → CSS追加用

つまり{% block title %}のtitleは、
「ここはタイトルを入れるブロックです」という意味で付けられた名前ということになります。

{% %} 他の例

html
{% if condition %}              # 条件分岐
{% endif %}

{% for item in items %}        # 繰り返し
{% endfor %}

{% include "footer.html" %}    # 他のテンプレートの読み込み

{% url 'name' %}               # URLの生成

{% load static %}              # 静的ファイルの読み込み機能の有効化

ここで、重要なポイントは
この名前は、親テンプレートと子テンプレートで同じものを使う必要があります。

具体的な使用例

<title>{% block title %}カレンダー{% endblock %}</title>

となっている場合、

  • Djangoテンプレート言語(Django Template Language, DTL)の構文
  • html
    が合わさった状態です。

具体的には、

Django
{% block title %}カレンダー{% endblock %}
html
<title></title>

ということになります。

このように、Djangoテンプレート言語の構文を使うことのメリットは
Djangoのテンプレート継承の仕組みを使うことができる、

ということがあります。

まず、{% block title %}カレンダー{% endblock %} の基本的な構造は

{% block title %} : ブロックの開始
カレンダー : デフォルトの内容
{% endblock %} : ブロックの終了
を表しています。

継承の例で説明すると

base.html(親テンプレート)
<title>{% block title %}カレンダー{% endblock %}</title>
another_page.html(子テンプレート)
{% extends 'base.html' %}
{% block title %}予定登録{% endblock %}

この場合

base.htmlでは、タイトルは「カレンダー」
another_page.htmlでは、base.htmlを継承しつつ、
タイトルを「予定登録」に上書きしている

つまり

同じテンプレートを使いまわしながら
ページごとに異なるタイトルを設定できる
という仕組みです。

もし子テンプレートでblock titleを定義しない場合は、
親テンプレートの「カレンダー」がそのまま使用されます。

これにより、共通のレイアウトを維持しながら、
各ページで必要に応じて部分的に内容を変更できる柔軟な設計が可能になります。

まとめ

今回はDjangoテンプレート言語について解説しました。
AIの吐き出すhtmlに、Djangoテンプレート言語の構文が入っていて、
初見は全く分からず調べたことをまとめてみました。
今回の記事が誰かの助けになれば幸いです。

Discussion