Menu
CoddyTech

Site Gezintisi

Coddy'nin Django Journey'sinin Django Temelleri bölümünün bir parçası. Ders 23 / 23.

Site artık ortak düzene sahip beş sayfadan oluşuyor (About için de bir şablon eklendi), ancak base.html içindeki gezinme menüsünde üç sayfa listeleniyor ve hangi sayfada olduğunuzu hiç göstermiyor.

Her şablon, sayfanın isteği olan request değişkenini okuyabilir. Django, settings.py içindeki TEMPLATES ayarında her bağlama bir ad ekleyen bir işlev olan request bağlam işlemcisi listelendiği için bu değişkeni her şablonun bağlamına ekler. request.resolver_match, eşleşen rotayı açıklar: url_name, ad alanı olmadan rotanın adıdır ("contact"); view_name ise tam addır ("menu:contact"). Bir şablon, yalnızca bir sayfada bir satır gösterebilir:

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

Etiket, yalnızca bir sayfaya öznitelik eklemek için bir <a> etiketinin içine de yerleştirilebilir:

<a href="/contact/"{% if request.resolver_match.url_name == "contact" %} class="active"{% endif %}>Contact</a>
challenge icon

Görev

Orta

Gezinme çubuğunda hangi sayfada olduğunu göster.

  1. base.html dosyasında gezinme bağlantılarını sırasıyla Home, Menu, Drinks, Hours ve About yap; her birinin adresi {% url %} ile oluşturulsun. Her sayfada yalnızca o sayfaya ait bağlantı class="active" alsın.
  2. style.css dosyasında nav a.active seçicisini kalın yap.

Her gezinme bağlantısına tıkla: yalnızca bulunduğun sayfanın bağlantısı kalınlaşır.

Kendin dene

{% 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 iconKendini test et

Bu ders kısa bir quiz içerir. Soruları yanıtlamak ve ilerlemeni kaydetmek için derse başla.

Django Temelleri bölümündeki tüm dersler

Kendi başına pratik yap: Django playground