Scrivere la tua prima applicazione in Django, parte 6Link to this heading

Questo tutorial inizia dove si è interrotto Tutorial 5. Abbiamo costruito una applicazione web per i questionari con test, ora aggiungeremo i fogli di stile e una immagine.

Insieme all’HTML generato dal server, le applicazioni web di solito hanno bisogno di servire altri file – come immagini, JavaScript, o CSS – necessari per generare la pagina web in completo. In Django, ci riferiamo a questi file chiamandoli «file statici».

Per piccoli progetti, questo non è un grosso problema, perchè puoi tenere i file statici ovunque il tuo web server possa trovarli. Comunque, in progetti più grandi – soprattutto in quelli co posti da molte app – gestire più gruppi di file statici generati da ogni applicazione inizia a diventare complesso.

Questo è il motivo per cui serve django.contrib.staticfiles: colleziona file statici da ogni applicazione (e da ogni altro posto che specifichi) in una singola destinazione che può essere facilmente servita in produzione.

Personalizza l’aspetto e il design della tua applicazioneLink to this heading

Innanzitutto, crea una directory chiamata static nella tua directory polls. Django cercherà i file statici lì, in modo simile a come Django trova i modelli all’interno di polls/templates/.

L’impostazione STATICFILES_FINDERS di Django contiene una lista di «cercatori» che sanno come trovare i file statici da diverse fonti. Uno dei predefiniti è AppDirectoriesFinder, che cerca in una sottodirectory chiamata «static» per ciascuna delle app inserite in INSTALLED_APPS, come quella in polls che abbiamo appena creato. Il sito admin usa la stessa struttura di directory per i suoi file statici.

Dentro la directory static che hai appena creato, crea un’altra directory chiamata polls, e dentro quest’ultima crea un file chiamato style.css. In altre parole, il tuo foglio di stile dovrebbe essere in polls/static/polls/style.css. Per come funziona AppDirectoriesFinder, potrai riferirti a questo file statico in Django semplicemente come polls/style.css, in modo analogo a come ti riferisci ai percorsi per i template.

Inserisci il seguente codice in quel foglio di stile (polls/static/polls/style.css):

polls/static/polls/style.css
Css
li a {
    color: green;
}

Poi, aggiungi il seguente codice all’inizio di polls/templates/polls/index.html:

polls/templates/polls/index.html
Django template
{% load static %}

<link rel="stylesheet" href="{% static 'polls/style.css' %}">

Il template tag {% static %} genera l’URL assoluto dei file statici.

Questo è tutto quello che devi fare per lo sviluppare.

Avvia il server (o riavvialo se è già in esecuzione):

Linux / macOS

Shell
$ python manage.py runserver

Windows

Windows
...\> py manage.py runserver

Ricarica http://localhost:8000/polls/ e dovresti vedere che i link delle domande sono verdi ( stile Django! ) il che significa che il tuo foglio di stile è stato caricato correttamente.

Aggiunta di un’immagine di sfondoLink to this heading

Successivamente, creeremo una sottodirectory per le immagini. Crea una sottodirectory images nella directory polls/static/polls/. All’interno di questa directory, aggiungi qualsiasi file di immagine che desideri utilizzare come sfondo. Ai fini di questo tutorial, stiamo usando un file denominato background.png, che avrà il percorso completo polls/static/polls/images/background.png.

Quindi, aggiungi un riferimento alla tua immagine nel tuo foglio di stile (polls/static/polls/style.css):

polls/static/polls/style.css
Css
body {
    background: white url("images/background.png") no-repeat;
}

Ricarica http://localhost:8000/polls/ e dovresti vedere lo sfondo caricato in alto a sinistra dello schermo.

Queste sono le basi. Per maggiori dettagli sulla configurazione e altri particolari del framework vedi l’howto dei file statici e la guida di riferimento di staticfiles. Distribuire i file statici spiega invece come usare i file statici su un server reale.

Quando ti senti a tuo agio con i file statici, leggi la parte 7 di questo tutorial per imparare a personalizzare il sito admin che viene generato automaticamente da Django.