Pisanie pierwszej aplikacji Django, część 6.¶
This tutorial begins where Tutorial 5 left off. We’ve built a tested web-poll application, and we’ll now add a stylesheet and an image.
Oprócz od HTML-u wygenerowanego przez serwer, aplikacje webowe zazwyczaj muszą serwować dodatkowe pliki – takie jak grafiki, JavaScript lub CSS – niezbędne do wyrenderowania pełnej strony internetowej. W Django nazywamy te pliki „plikami statycznymi”.
W małych projektach to nieduży problem, bo możesz trzymać pliki statyczne gdzieś, gdzie może odnaleźć je web serwer. Jednak w dużych projektach – szczególnie tych złożonych z wielu aplikacji – raczenie sobie z wieloma zbiorami plików statycznych każdej aplikacji zaczyna być wyzwaniem.
Do tego mamy django.contrib.staticfiles: zbiera ono pliki statyczne z każdej z twoich aplikacji (i każdego innego miejsca, które wskażesz) w jedną lokację, która może być prosto zaserwowana na produkcji.
Gdzie szukać pomocy:
Jeśli masz trudności w przejściu tego tutorialu, przejdź do sekcji Uzyskiwanie pomocy często zadawanych pytań.
Dostosuj wygląd i pracę z twoją aplikacją¶
Najpierw stwórz katalog o nazwie static w swoim katalogu polls. Django będzie tam szukało plików statycznych, w podobny sposób jak szuka szablonów w polls/templates/.
Ustawienie Django STATICFILES_FINDERS zawiera listę finderów, które wiedzą jak odnajdywać pliki statyczne w różnych źródłach. Jednym z domyślnych jest AppDirectoriesFinder, który szuka „statycznego” podkatalogu w każdej z INSTALLED_APPS, takiego jak ten, który właśnie stworzyliśmy w polls. Panel administracyjny używa takiej samej struktury katalogów dla swoich statycznych plików.
W katalogu static, który właśnie stworzyłeś, stwórz inny katalog o nazwie polls i w nim stwórz plik o nazwie style.css. Innymi słowy twój arkusz stylów powinien być w polls/static/polls/style.css. Z powodu jak działa finder plików statycznych AppDirectoriesFinder, możesz odwoływać się do tego pliku statycznego w Django jako do polls/style.css, podobnie jak wskazujesz ścieżkę do szablonów.
Przestrzeń nazw plików statycznych
Tak samo jak z szablonami, moglibyśmy poradzić sobie umieszczając nasze pliki statyczne bezpośrednio w polls/static (zamiast tworzyć kolejny podkatalog polls), ale w rzeczywistości byłoby to złym pomysłem. Django wybierze pierwszy statyczny plik, którego nazwa się zgadza i jeśli miałbyś plik statyczny o takiej samej nazwie w innej aplikacji, Django nie byłoby w stanie ich odróżnić. Musimy być w stanie wskazać Django odpowiedni plik i najlepszym sposobem, aby to zapewnić jest znamespace’owanie ich. To znaczy umieszczenie tych plików statycznych w innym katalogu nazwanym dla samej aplikacji.
Umieść następujący kod w tym arkuszu stylów (polls/static/polls/style.css):
polls/static/polls/style.css¶li a {
color: green;
}
Następnie dodaj poniższe na początku polls/templates/polls/index.html:
polls/templates/polls/index.html¶{% load static %}
<link rel="stylesheet" href="{% static 'polls/style.css' %}">
Szablonowy tag {% static %} generuje bezwzględny URL plików statycznych.
To wszystko, co potrzebujesz zrobić dla dewelopmentu.
Wystartuj serwer (lub zrestartuj, jeśli już działa):
$ python manage.py runserver
...\> py manage.py runserver
Przeładuj http://localhost:8000/polls/, powinieneś zobaczyć, że linki pytań są zielone (styl Django!), co oznacza, że twój arkusz styli załadował się poprawnie.
Dodawanie obrazu tła¶
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.css¶body {
background: white url("images/background.png") no-repeat;
}
Odśwież http://localhost:8000/polls/ a powinieneś zobaczyć tło załadowane w lewym górnym rogu ekranu.
Ostrzeżenie
Szablonowy tag {% static %} nie jest dostępny do użycia w plikach statycznych, które nie są wygenerowane przez Django, takich jak twój arkusz stylów. Powinieneś zawsze używać ścieżek względnych do łączenia plików statycznych pomiędzy nimi, ponieważ wtedy możesz zmienić STATIC_URL (używany przez szablonowy tag static do wygenerowania jego URL-i) bez bycia zmuszonym do modyfikacji też rzeszy ścieżek w twoich plikach statycznych.
To są podstawy. Po więcej szczegółów na temat ustawień i innych kawałków zawartych we frameworku, zobacz howto plików statycznych i dokumentację staticfiles. Demployment plików statycznych porusza kwestię, jak używać plików statycznych na prawdziwym serwerze.
Kiedy już czujesz się dobrze z plikami statycznymi, przeczytaj część 7 tego tutoriala, aby dowiedzieć się, jak dostosowywać wygenerowany automatycznie panel administracyjny Django.
