Menu
CoddyTech

各ページにタイトルを付ける

CoddyのDjangoジャーニー「Djangoの基礎」セクションの一部。レッスン 18/23。

/drinks/はbase.htmlを継承しているため、タイトルはホームページと同じCorner Caféです。ブロックを使えば修正できます。ブロックにはデフォルトのコンテンツを入れられるからです。ブロックを埋めるページはデフォルトの内容を置き換え、ブロックを省略するページはそのまま残します。

<h1>{% block heading %}City Library{% endblock %}</h1>
<article>{% block body %}{% endblock %}</article>

フレームには、必要な数だけブロックを作成でき、それぞれに独自の名前を付けられます。このページでは両方を埋めています。

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

{% block heading %}Opening Times{% endblock %}
{% block body %}<p>Until 20:00.</p>{% endblock %}

bodyだけを埋めるページでは、見出しのCity Libraryがそのまま残ります。

challenge icon

チャレンジ

簡単

各ページに個別のタイトルを付けましょう。

  1. base.htmlで、タイトルのテキストをtitleという名前のブロックにし、デフォルトをCorner Caféにします。
  2. drinks.htmlで、/drinks/のタイトルをOur Drinks | Corner Caféにします。ホームページにはデフォルトのタイトルが使われます。

/drinks/を開くと、タイトルバーにOur Drinks | Corner Caféと表示されます。

自分で試してみよう

<!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>
        {% block content %}{% endblock %}
    </main>
</body>
</html>
quiz icon腕試し

このレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。

Djangoの基礎のすべてのレッスン

自分で練習してみよう: Djangoプレイグラウンド