{"title":"Pisanie pierwszej aplikacji Django, część 6.","version":"4.0","locale":"pl","docname":"intro/tutorial06","url":"/pl/4.0/intro/tutorial06/","canonical":"https://djangodocs.dev/pl/4.0/intro/tutorial06/","summary":"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…","html":"

Pisanie pierwszej aplikacji Django, część 6.Link to this heading#

\n

Ten tutorial zaczyna się, gdzie skończył się Tutorial 5. Zbudowaliśmy testowaną aplikację web-ankietową, teraz dodamy arkusz stylów i grafikę.

\n

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”.

\n

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.

\n

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.

\n\n
\n

Dostosuj wygląd i pracę z twoją aplikacjąLink to this heading#

\n

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/.

\n

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.

\n

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.

\n\n

Umieść następujący kod w tym arkuszu stylów (polls/static/polls/style.css):

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

Następnie dodaj poniższe na początku polls/templates/polls/index.html:

\n
polls/templates/polls/index.html
\n
Django template
{% load static %}\n\n<link rel="stylesheet" type="text/css" href="{% static 'polls/style.css' %}">\n
\n

Szablonowy tag {% static %} generuje bezwzględny URL plików statycznych.

\n

To wszystko, co potrzebujesz zrobić dla dewelopmentu.

\n

Wystartuj serwer (lub zrestartuj, jeśli już działa):

\n

Linux / macOS

Shell
$ python manage.py runserver\n
\n

Windows

Windows
...\\> py manage.py runserver\n
\n

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.

\n
\n
\n

Dodawanie obrazu tłaLink to this heading#

\n

Następnie stworzymy podkatalog na grafiki. Stwórz podkatalog images w katalogu polls/static/polls/. W tym katalogu umieść grafikę o nazwie background.gif. Innymi słowy umieść swój obrazek w polls/static/polls/images/background.gif.

\n

Potem dodaj do swojego arkusza stylów (polls/static/polls/style.css):

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

Odśwież http://localhost:8000/polls/ a powinieneś zobaczyć tło załadowane w lewym górnym rogu ekranu.

\n\n

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.

\n

Kiedy już czujesz się dobrze z plikami statycznymi, przeczytaj część 7 tego tutoriala, aby dowiedzieć się, jak dostosowywać wygenerowany automatycznie panel administracyjny Django.

\n
","rootId":"writing-your-first-django-app-part-6","toc":[{"title":"Dostosuj wygląd i pracę z twoją aplikacją","anchor":"customize-your-app-s-look-and-feel","children":[]},{"title":"Dodawanie obrazu tła","anchor":"adding-a-background-image","children":[]}],"breadcrumbs":[{"docname":"intro/index","title":"Pierwsze kroki","url":"/pl/4.0/intro/"}],"prev":{"docname":"intro/tutorial05","title":"Pisanie pierwszej aplikacji Django, część 5.","url":"/pl/4.0/intro/tutorial05/"},"next":{"docname":"intro/tutorial07","title":"Pisanie pierwszej aplikacji Django, część 7.","url":"/pl/4.0/intro/tutorial07/"},"formats":{"html":"/pl/4.0/intro/tutorial06/","markdown":"/pl/4.0/intro/tutorial06.md","json":"/pl/4.0/intro/tutorial06.json"},"source":"https://github.com/django/django/blob/stable/4.0.x/docs/intro/tutorial06.txt","official":"https://docs.djangoproject.com/pl/4.0/intro/tutorial06/","inVersions":["6.1","6.0","5.2","5.1","5.0","4.2","4.1","4.0","3.2","3.1","3.0","2.2","2.1","2.0","1.11","1.10"],"inLocales":["en","zh-hans","fr","ja","id","it","pt-br","ko","es","el","pl"]}