Создание вашего первого приложения Django, часть 6
Этот учебник начинается там, где закончился Урок 5. Мы создали и протестировали веб-приложение опросов, и теперь добавим таблицу стилей и изображение.
Помимо HTML, генерируемого сервером, веб-приложениям обычно необходимо предоставлять дополнительные файлы, такие как изображения, JavaScript или CSS, необходимые для отрисовки полной веб-страницы. В Django эти файлы называются «статическими файлами».
Для небольших проектов это не проблема, так как вы можете хранить статические файлы там, где их может найти веб-сервер. Однако в больших проектах, особенно состоящих из нескольких приложений, работа с множеством статических файлов, предоставляемых каждым приложением, становится сложной.
Для этого и существует django.contrib.staticfiles: она собирает статические файлы из каждого вашего приложения (и любых других указанных вами мест) в одно место, которое легко обслуживать в рабочей среде.
Где получить помощь:
Если у вас возникнут трудности с этим учебником, обратитесь к разделу Получение помощи раздела FAQ.
Настройка внешнего вида вашего приложения
Сначала создайте директорию с именем static в директории polls. Django будет искать статические файлы там, аналогично тому, как Django находит шаблоны внутри polls/templates/.
Настройка STATICFILES_FINDERS Django содержит список поисковиков, которые знают, как обнаруживать статические файлы из различных источников. Один из параметров по умолчанию — AppDirectoriesFinder, который ищет поддиректорию «static» в каждом из INSTALLED_APPS, например, в polls, которую мы только что создали. Сайт администрирования использует ту же структуру каталогов для своих статических файлов.
Внутри только что созданной директории static создайте другую директорию под названием polls и внутри неё создайте файл с именем style.css. Другими словами, ваша таблица стилей должна находиться по адресу polls/static/polls/style.css. Благодаря работе поисковика статических файлов AppDirectoriesFinder, вы можете ссылаться на этот статический файл в Django как на polls/style.css, аналогично тому, как вы ссылаетесь на путь к шаблонам.
Наименование статических файлов
Как и в случае с шаблонами, мы могли бы обойтись без создания отдельной поддиректории polls, разместив статические файлы непосредственно в polls/static, но это было бы плохой идеей. Django выберет первый статический файл, имя которого совпадает, и если у вас был бы статический файл с таким же именем в другом приложении, Django не смог бы их различить. Нам нужно указать Django, какой файл использовать, и лучший способ сделать это — назвать их. То есть, поместить эти статические файлы внутри другой директории, названной в соответствии с самим приложением.
Вставьте следующий код в эту таблицу стилей (polls/static/polls/style.css):
li a {
color: green;
}
Далее, добавьте следующее в начало polls/templates/polls/index.html:
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'polls/style.css' %}">
Тэг {% static %} шаблона генерирует абсолютный URL статических файлов.
Это всё, что вам нужно для разработки.
Запустите сервер (или перезапустите его, если он уже запущен):
$ python manage.py runserver
...\> py manage.py runserver
Перезагрузите http://localhost:8000/polls/ и вы увидите, что ссылки на вопросы зелёные (стиль Django!), что означает, что ваша таблица стилей была загружена правильно.
Добавление фонового изображения
Далее, создадим поддиректорию для изображений. Создайте поддиректорию images в директории polls/static/polls/. Внутри этой директории поместите изображение с именем background.gif. Другими словами, поместите изображение в polls/static/polls/images/background.gif.
Затем добавьте в таблицу стилей (polls/static/polls/style.css):
body {
background: white url("images/background.gif") no-repeat;
}
Перезагрузите http://localhost:8000/polls/ и вы увидите, что фоновое изображение загрузилось в верхнем левом углу экрана.
Предупреждение
Тэг шаблона {% static %} недоступен для использования в статических файлах, которые не генерируются Django, таких как ваша таблица стилей. Всегда используйте относительные пути для ссылки на статические файлы друг на друга, так как в этом случае вы можете изменить STATIC_URL (используемый тэгом шаблона static для генерации URL) без необходимости изменения множества путей в ваших статических файлах.
Это основы. Подробнее о настройках и других элементах, включенных в фреймворк, см. инструкции по работе со статическими файлами и справочник по статическим файлам. Развертывание статических файлов описывает, как использовать статические файлы на реальном сервере.
После того, как вы освоите работу со статическими файлами, прочтите часть 7 этого учебника, чтобы узнать, как настроить автоматически генерируемый сайт администрирования Django.
© Django Software Foundation and individual contributors
Licensed under the BSD License.
https://docs.djangoproject.com/en/3.1/intro/tutorial06/
