Создание первого приложения на Django, часть 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.
Помимо HTML-кода, генерируемого сервером, веб-приложения обычно должны обслуживать дополнительные файлы - такие как изображения, JavaScript или CSS - необходимые для отображения всей веб-страницы. В Django мы называем эти файлы «статическими файлами».
Для небольших проектов это не имеет большого значения, потому что вы можете хранить статические файлы там, где их может найти ваш веб-сервер. Однако в более крупных проектах, особенно в тех, которые состоят из нескольких приложений, работа с несколькими наборами статических файлов, предоставляемых каждым приложением, начинает усложняться.
Вот для чего нужен модуль django.contrib.staticfiles: он собирает статические файлы из каждого приложения (и любых других мест, которые вы укажете) в одно место, которое можно легко обслуживать на рабочем сервере.
Где получить помощь:
Если у вас возникли проблемы с просмотром этого учебника, перейдите в раздел Получение справки FAQ.
Настройте внешний вид вашего приложения¶
Сначала создайте каталог с именем static в вашем каталоге polls. Django будет искать статические файлы там, аналогично тому, как Django находит шаблоны внутри polls/templates/.
Параметр Django STATICFILES_FINDERS содержит список модулей, которые знают, как обнаруживать статические файлы из различных источников. Одним из значений по умолчанию является AppDirectoriesFinder, который ищет «статический» подкаталог в каждом из INSTALLED_APPS, подобно тому, который мы только что создали в polls. Сайт администратора использует ту же структуру каталогов для своих статических файлов.
В каталоге static, который вы только что создали, создайте другой каталог с именем polls и в нем создайте файл с именем style.css. Другими словами, ваша таблица стилей должна находиться в polls/static/polls/style.css. Из-за того, как работает искатель статических файлов AppDirectoriesFinder, вы можете ссылаться на этот статический файл в Django как polls/style.css, аналогично тому, как вы ссылаетесь на путь для шаблонов.
Пространство имен статических файлов
Как и с шаблонами, мы можем избежать размещения наших статических файлов непосредственно в polls/static (вместо создания другого подкаталога polls), но на самом деле это плохая идея. Django выберет первый найденный им статический файл, имя которого совпадает, и если бы у вас был статический файл с тем же именем в другом приложении, Django не смог бы их различить. Мы должны быть в состоянии указать Django на правильный, и лучший способ убедиться в этом - пространство имен. То есть, поместив эти статические файлы в другой каталог, названный для самого приложения.
Поместите следующий код в эту таблицу стилей (polls/static/polls/style.css):
polls/static/polls/style.css¶li a {
color: green;
}
Затем добавьте следующее в начало polls/templates/polls/index.html:
polls/templates/polls/index.html¶{% load static %}
<link rel="stylesheet" href="{% static 'polls/style.css' %}">
Тег шаблона {% static %} генерирует абсолютный URL-адрес статических файлов.
Это все, что вам нужно сделать для разработки.
Запустите сервер (или перезапустите его, если он уже работает):
$ python manage.py runserver
...\> py manage.py runserver
Перезагрузите http://localhost:8000/polls/, и вы должны увидеть, что ссылки на вопросы зеленые (стиль Django!), что означает, что ваша таблица стилей была загружена правильно.
Добавление фонового изображения¶
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;
}
Перезагрузите http://localhost:8000/polls/, и вы должны увидеть фон, загруженный в левом верхнем углу экрана.
Предупреждение
Тег шаблона {% static %} недоступен для использования в статических файлах, которые не создаются Django, например в вашей таблице стилей. Вы всегда должны использовать относительные пути для связывания ваших статических файлов между собой, потому что тогда вы можете изменить STATIC_URL (используется тегом шаблона static для генерации его URL-адресов) без необходимости также менять кучу путей в ваших статических файлах.
Это основы. Для получения более подробной информации о настройках и других элементах, включенных в структуру, смотрите работа со статическими файлами и справка по staticfiles. Развертывание статических файлов обсуждает, как использовать статические файлы на реальном сервере.
Когда вы освоитесь со статическими файлами, прочитайте часть 7 уроков, чтобы узнать, как настроить автоматически сгенерированный сайт администратора Django.