Django - Глобальні статичні файли
Додати глобальний файл CSS
Ми дізналися, як додати статичний файл у папку static програми та як використовувати його в програмі.
А що, якщо інші програми у вашому проєкті захочуть використовувати файл?
Тоді нам потрібно створити папку в кореневому каталозі та помістити туди файл(и).
Недостатньо створити папку static у кореневому каталозі, Django виправить решту. Ми повинні сказати Django, де шукати ці статичні файли.
Почніть зі створення папки на кореневому рівні проєкту, цю папку можна назвати як завгодно, у цьому посібнику вона називатиметься mystaticfiles:
my_tennis_club
db.sqlite3
manage.py
my_tennis_club/
members/
mystaticfiles/
Додайте файл CSS у папку mystaticfiles, назву ви вибираєте, ми назвемо його myglobal.css в цьому прикладі:
my_tennis_club
db.sqlite3
manage.py
my_tennis_club/
members/
mystaticfiles/
myglobal.css
Відкрийте файл CSS і вставте наступне:
my_tennis_club/mystaticfiles/myglobal.css:
body {
color: violet;
}
Змінити налаштування
Ви повинні будете сказати Django також шукати статичні файли в папці mystaticfiles у кореневому каталозі, це робиться в файлі settings.py:
Додайте список STATICFILES_DIRS:
my_tennis_club/my_tennis_club/settings.py:
.
.
STATIC_ROOT = BASE_DIR / 'productionfiles'
STATIC_URL = 'static/'
#Add this in your settings.py file:
STATICFILES_DIRS = [
BASE_DIR / 'mystaticfiles'
]
.
.У списку STATICFILES_DIRS ви можете перелічити всі каталоги, де Django має шукати статичні файли.
Ключове слово BASE_DIR представляє кореневий каталог проєкту та разом із /"mystaticfiles" означає папку mystaticfiles у кореневому каталозі.
Порядок пошуку
Якщо у вас є файли з однаковою назвою, Django використовуватиме перше входження файлу.
Пошук починається в каталогах, перелічених у STATICFILES_DIRS, використовуючи вказаний вами порядок. Тоді, якщо файл не знайдено, пошук продовжується в папці static кожної програми.
Змініть шаблон
Тепер у вас є глобальний файл CSS для всього проєкту, доступ до якого можна отримати з усіх ваших програм.
Щоб використати його в шаблоні, використовуйте той самий синтаксис, що й для файлу myfirst.css:
Почніть шаблон із наступного:
{% load static %}І зверніться до файлу таким чином:
<link rel="stylesheet" href="{% static 'myglobal.css' %}">Приклад
my_tennis_club/members/templates/template.html:
{% load static %}
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="{% static 'myglobal.css' %}">
<body>
{% for x in fruits %}
<h1>{{ x }}</h1>
{% endfor %}
</body>
</html>Не спрацювало?
Це правильно. Потрібно ще раз зібрати статичні файли.
Зберіть статичні файли
Виконайте команду collectstatic, щоб зібрати новий статичний файл:
py manage.py collectstatic
Що дасть такий результат:
You have requested to collect static files at the destination
location as specified in your settings:
C:\Users\Your Name\myworld\my_tennis_club\productionfiles
This will overwrite existing files!
Are you sure you want to do this?
Type 'yes' to continue, or 'no' to cancel:
Введіть так:
Type 'yes' to continue, or 'no' to cancel: yes
Що дасть такий результат:
1 static file copied to 'C:\Users\Your Name\myworld\my_tennis_club\productionfiles', 131 unmodified.
Приклад має працювати
Запустіть сервер, і приклад запрацює:
py manage.py runserver
Перегляньте результат у власному браузері: 127.0.0.1:8000/testing/.
Приклад
my_tennis_club/members/templates/template.html:
{% load static %}
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="{% static 'myglobal.css' %}">
<body>
{% for x in fruits %}
<h1>{{ x }}</h1>
{% endfor %}
</body>
</html>