Django - Collect Static Files
Handle Static Files
Static files in your project, like stylesheets, JavaScripts, and images, are not handled automatically by Django when DEBUG = False
.
When DEBUG = True
, this worked fine, all we had to do was to put them in the static
folder of the application.
When DEBUG = False
, static files have to be collected and put in a specified folder before we can use it.
Collect Static Files
To collect all necessary static files for your project, start by specifying a STATIC_ROOT
property in the settings.py
file.
This specifies a folder where you want to collect your static files.
You can call the folder whatever you like, we will call it productionfiles
:
my_tennis_club/my_tennis_club/settings.py
:
.
.
STATIC_ROOT = BASE_DIR / 'productionfiles'
STATIC_URL = 'static/'
.
.
You could manually create this folder and collect and put all static files of your project into this folder, but Django has a command that do this for you:
py manage.py collectstatic
Which will produce this result:
131 static files copied to 'C:\Users\your_name\myworld\my_tennis_club\productionfiles'.
131 files? Why so many? Well, this is because of the admin user interface that comes built-in with Django. We want to keep this feature in production, and it comes with a whole bunch of files including stylesheets, fonts, images, and JavaScript.
my_tennis_club
members/
my_tennis_club/
productionfiles/
admin/
myfirst.css
The Example Should Work
Now you have collected the static files of your project, and if you have installed WhiteNoise, the example from the Add Static Files chapter will finally work.
Start the server and see the result:
py manage.py runserver
And check out the result in your own browser: 127.0.0.1:8000/testing/
.
Example
my_tennis_club/members/templates/template.html
:
{% load static %}
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="{% static 'myfirst.css' %}">
<body>
{% for x in fruits %}
<h1>{{ x }}</h1>
{% endfor %}
</body>
</html>
Run Example »