New to Django, problem with displaying images in html-frontend....

Using Django Templates & Frontend
1

Hi folks, I#m completely new to DJANGO and new to this Forum. I tried it with search on google and in here but did not find anything that helped. I`m quite sure it is a ridiculous little thing like mising commy or something like that but while upsetting my first DJANGO Project, i have the Problem, that i only see Placeholders instead of my images i linked to the page and in console i get 404 errors onl load of them.

The files are in static/projectname/images/ Folder,

reference in html is looking like this:
<img src=ā€œ{% static ā€œklinikXdatabase/images/title.pngā€ %}ā€ alt=ā€œimageā€>
and YES, there is an {% load static %} right before that :wink:

ā€˜django.contrib.staticfilesā€™, is in ā€œInstalled_APPSā€

STATIC_URL = ā€˜static/ā€™ is put in settings.py

Any Ideas or further questions to my environment?
Thx in advance :slight_smile:

2

The best way to start researching something like this is to examine the html in the browser to see what that img tag looks like.

Also, check your console log to see what the url was being requested for that image.

1 Like
3

you mean this ?
1

4

2
21146Ɨ337 71.2 KB

5

Not the template, the html as it exists in the browser after being rendered and sent to the browser.

Are you running with debug = True?

What is your STATICFILES_DIRS setting?

1 Like
6

Yea, project is set on DEBUG = True, Static environment is set by:
STATIC_URL = ā€˜static/ā€™
STATIC_ROOT = ā€˜static/ā€™

and generated browser html is looking like this:

3
3968Ɨ379 64.1 KB

7

But what about STATICFILES_DIRS? (STATIC_ROOT doesnā€™t really matter in this situation.)

8

iā€™m aware, that STATIC_ROOT is simply to enable DJANGO to collect static files in one location by python command, i just mentioned it to be complete to the static-topic. there is no STATICFILES_DIRS line so far in my project

9

Youā€™ll want to add it. See the docs at How to manage static files (e.g. images, JavaScript, CSS) | Django documentation | Django

1 Like
10

Thanks for the hint, tried it earlier that day but with simple copy and pasteā€¦this time i left the var/www/ part away and now it works :slight_smile: