Menu
CoddyTech

Navigation du site

Fait partie de la section Les bases de Django du Journey Django de Coddy. Leçon 23 sur 23.

Le site compte désormais cinq pages avec la mise en page commune (About a aussi un modèle), mais la navigation dans base.html en liste trois et n’indique jamais où tu te trouves.

Chaque modèle peut lire request, la requête à laquelle on répond, car settings.py répertorie le processeur de contexte request dans TEMPLATES. request.resolver_match décrit la route correspondante : url_name est son nom sans l’espace de noms ("contact"), et view_name son nom complet ("menu:contact"). Un cadre peut afficher une ligne sur une seule page :

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

Défi

Moyen

Dans base.html, créez les liens de navigation Accueil, Menu, Boissons, Horaires et À propos, dans cet ordre, chacun avec une adresse générée à l’aide de {% url %}. Sur chaque page, seul le lien correspondant à cette page reçoit class="active".

Ajoutez un style à nav a.active dans style.css, par exemple du texte en gras, puis appuyez sur Run et cliquez sur les liens de navigation.

Essayez vous-même

{% 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>
quiz iconTestez-vous

Cette leçon comprend un petit quiz. Commencez la leçon pour y répondre et suivre votre progression.

Toutes les leçons de Les bases de Django

Entraînez-vous par vous-même : Playground Django