Navigasi Situs

Termasuk bagian Dasar-Dasar Django dalam perjalanan Django di Coddy. Pelajaran 23 dari 23.

Situs ini sekarang memiliki lima halaman dengan tata letak bersama (About juga sudah memiliki template), tetapi navigasi di base.html mencantumkan tiga halaman, dan tidak pernah menunjukkan halaman yang sedang kamu buka.

Setiap template dapat membaca request, yaitu request yang sedang dijawab, karena settings.py mencantumkan context processor request di TEMPLATES. request.resolver_match menjelaskan rute yang cocok: url_name adalah namanya tanpa namespace ("contact"), sedangkan view_name adalah nama lengkapnya ("menu:contact"). Sebuah frame dapat menampilkan satu baris hanya pada satu halaman:

{% if request.resolver_match.url_name == "contact" %}
    <p>We reply within a day.</p>
{% endif %}

Tantangan

Sedang

Di base.html, buat tautan navigasi Home, Menu, Drinks, Hours, dan About dalam urutan tersebut, masing-masing dengan alamat yang dibuat menggunakan {% url %}. Di setiap halaman, hanya tautan ke halaman itu yang mendapat class="active".

Beri nav a.active gaya di style.css, misalnya teks tebal, lalu tekan Run dan klik tautan navigasi satu per satu.

Coba sendiri

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>{% block title %}Corner Café{% endblock %}</title>
    <link rel="stylesheet" href="{% static 'menu/style.css' %}">
</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>