Reputation: 85
I've been completing the DjangoGirls tutorial (very good) to learn how to create a blog using Python and Django. I decided to add an image to the homepage (not covered by the tutorial) but when the code is run I get a 404 error and the image isn't shown.
My HTML code is
img src="logo3.jpg" alt="Me2 logo" style="width:50px;height:50px;"
The image is saved in the same folder as the HTML file. The site is running on Localhost.
I think this may be a similar problem to HTML: Image won't display? but I don't know if my difficulty is affected by the Django/Python setup. Very new to all this, help is appreciated. Thanks.
Upvotes: 2
Views: 2385
Reputation: 5440
Static files such as images, CSS, and JavaScript files are handled differently to what you may be used to.
The official Django site explains it pretty well: https://docs.djangoproject.com/en/1.8/howto/static-files/
If you follow the steps on there, number 1 and 2 should be set by default, so you won't have to change anything.
As outlined in step 3 you simply include {% load staticfiles %}
at the top of your html document in the templates folder.
If you want to then include an image, use the following structure, which I have taken directly from the Django site: <img src="{% static "my_app/myexample.jpg" %}" alt="My image"/>
The actual image needs to be located in a certain place in your Django file structure. As seen in point 4, It will look similar to this: my_app/static/my_app/myimage.jpg
my_app
├── static
│ ├── my_app
│ │ ├── myimage.jpg
Upvotes: 2