Веб-приложение, как правило, использует различные статические файлы - изображения, файлы стилей css, скриптов javascript и так далее. Рассмотрим, как мы можем использовать подобые файлы.
При создании проекта Django он уже имеет некоторую базовую настройку для работы со статическими файлами. В частности, в файле settings.py определена переменная STATIC_URL, которая хранит путь к каталогу со статическими файлами:
STATIC_URL = 'static/'
А среди установленных приложений в переменной INSTALLED_APPS указано приложение django.contrib.staticfiles
INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'hello', ]
Переменная STATIC_URL имеет значение "static/", а это значит, что нам достаточно создать в папке приложения каталог с именем "static" и добавить в него необходимые нам статические файлы. Но, естественно, при необходимости через данную настройку мы можем изменить расположение каталога статических файлов.
Итак, добавим в папку приложения новый каталог static. Чтобы не сваливать все статические файлы в кучу, определим для каждого типа файлов отдельные папки. В частности, создадим в папке static для изображений каталог images, а для стилей - каталог css. Подобным образом можно создавать папки и для других типов файлов.
В папку static/images добавим какое-нибудь изображение - в моем случае это будет файл forest.jpg. А в папке static/css определим новый файл styles.css, который будет иметь какие-нибудь простейшие стили, например:
body{ font-family: Verdana;} h1{color:navy;} img{width:350px;}
Теперь используем эти файлы в шаблоне. Для этого в начале файла шаблона необходимо определить инструкцию
{% load static %}
При этом данный код должен идти после тега DOCTYPE.
Для определения пути к статическим файлам используются выражения типа
{% static "путь к файлу внутри папки static" %}
Так, пусть в приложении в папке templates определен шаблон index.html, который имеет следующий код:
<!DOCTYPE html> {% load static %} <html> <head> <meta charset="utf-8" /> <link rel="stylesheet" href="{% static "css/styles.css" %}" /> <title>Django на METANIT.COM</title> </head> <body> <h1>Зимний лес</h1> <img src="{% static "images/forest.jpg" %}" alt="зимний лес" > </body> </html>
При запуске приложения шаблон index.html будет генерироваться в следующую веб-страницу, которая будет использовать изображение и применять стили:
Если нас не устраивает хранение файлов в каталоге по умолчанию - каталоге static, либо мы хотим указать несколько папок, то мы можем в файле settings.py задать все необходимые каталоги с помощью переменной STATICFILES_DIRS, которая принимает список путей:
STATICFILES_DIRS = [ BASE_DIR / "static", "/var/www/static/", "/somefolder/" ]