Kerst
Kerst

Reputation: 85

Can't find image on localhost

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

Answers (1)

Wilhelm Klopp
Wilhelm Klopp

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

Related Questions