Django Adding Image file
Add an Image File
Adding images files in Django project is done the same way as adding css files or adding js files in Django:
Static files, like css, js, and images, goes in the static
folder.
If you do not have one, create it in the same location as you created the templates
folder:
myworld
manage.py
myworld/
members/
templates/
static/
Add a image file (.png, .jpg, .gif, etc.) in the static
folder::
myworld
manage.py
myworld/
members/
templates/
static/
pineapple.jpg
Modify the Template
Now you have a image in the static
folder.
The next step will be to include this image in a HTML template:
Open the HTML file and add the following:
{% load static %}
<img src="{% static 'pineapple.jpg' %}">
Restart the server for the changes to take effect:
py manage.py runserver
Example
members/templates/template.html
:
{% load static %}
<!DOCTYPE html>
<html>
<body>
<img src="{% static 'pineapple.jpg' %}">
</body>
</html>
Run Example »
Didn't Work?
Make sure that DEBUG = True
in the settings.py
file,
otherwise the example will fail in development.
Set the DEBUG
property to True
:
my_tennis_club/settings.py
:
.
.
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True
.
.
Handling Static Files
When your website is in production, and open for everyone, static files are handled differently than they are in development.
You will learn how to deploy the website to production later in this tutorial, and you will learn how to handle static files in production then.