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.cssli a {
color: green;
}
Poi, aggiungi il seguente codice all’inizio di polls/templates/polls/index.html:
polls/templates/polls/index.html{% 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
$ python manage.py runserver
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
Next, we’ll create a subdirectory for images. Create an images subdirectory
in the polls/static/polls/ directory. Inside this directory, add any image
file that you’d like to use as a background. For the purposes of this tutorial,
we’re using a file named background.png, which will have the full path
polls/static/polls/images/background.png.
Then, add a reference to your image in your stylesheet
(polls/static/polls/style.css):
polls/static/polls/style.cssbody {
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.