Pisanie pierwszej aplikacji Django, część 6.Link to this heading
Ten tutorial zaczyna się, gdzie skończył się Tutorial 5. Zbudowaliśmy testowaną aplikację web-ankietową, teraz dodamy arkusz stylów i grafikę.
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.
Dostosuj wygląd i pracę z twoją aplikacjąLink to this heading
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.
Umieść następujący kod w tym arkuszu stylów (polls/static/polls/style.css):
polls/static/polls/style.cssli 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):
Linux / macOS
$ python manage.py runserver
Windows
...\> 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łaLink to this heading
Następnie stworzymy podkatalog na grafiki. Stwórz podkatalog images w katalogu polls/static/polls/. W tym katalogu dodaj dowolną grafikę, którą chciał(a)byś użyć jako tło. Na potrzeby tego tutorialu używamy pliku o nazwie background.png, który będzie miał pełną ścieżkę polls/static/polls/images/background.png.
Następnie dodaj odniesienie do swojej grafiki w arkuszu stylów (polls/static/polls/style.css):
polls/static/polls/style.cssbody {
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.
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.