File statici

Fa parte della sezione Fondamenti di Django del percorso Django di Coddy. Lezione 20 di 23.

Le pagine del bar sono nere su bianco. Un foglio di stile cambierebbe questa situazione, e i fogli di stile, gli script e le immagini sono file statici: il server li invia così come sono, senza una vista. Django li trova come trova i template, nella cartella static/ di ogni app installata, con di nuovo il nome dell'app al suo interno:

shop/static/shop/cart.js

Django li serve a indirizzi che iniziano con STATIC_URL, che in settings.py è "static/", quindi il file si trova in /static/shop/cart.js. Un template crea l'indirizzo con {% static %}, dopo {% load static %}:

{% load static %}
<script src="{% static 'shop/cart.js' %}"></script>

Il tag <link rel="stylesheet" href="..."> di un foglio di stile va in <head>. Inseriscilo in base.html e tutte le pagine che lo estendono lo riceveranno.

Sfida

Facile

Aggiungi un foglio di stile al sito.

Crea menu/static/menu/style.css con almeno body { background: #fdf8f2; }.
In base.html, carica i tag statici e collega il foglio di stile in <head>, così ogni pagina collega /static/menu/style.css.

Premi Esegui: le pagine diventano color crema.

Provalo tu

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>{% block title %}Corner Café{% endblock %}</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>