Search code examples
djangoimagehttp-status-code-404django-staticfiles

how do i solve a 404 error in Django for images


I am stuck on this 404 error

When I try to find what the error is using inspection I get this

When I try to find what the error is using inspection I get this

My settings code:

STATIC_URL = '/static/'

MEDIA_URL = '/images/'

STATICFILES_DIR =[
os.path.join(BASE_DIR, 'static')
]

How i refer to my image in the html file

<img src="{% static 'images/logo.png' %}" alt="Image">

My urls file:

urlpatterns = [
path('admin/', admin.site.urls),
path('', include('amitians.urls')),

] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

I have a static folder inside which i have an images folder

I have a static folder inside which i have an images folder

On my inspection page the file type is shown as text/html though its clearly a .png. Not sure if its related but here

On my inspection page the file type is shown as text/html though its clearly a .png. Not sure if its related but here

and my error as shown in the command prompt geos like this:

Quit the server with CTRL-BREAK.
[12/Dec/2020 13:44:45] "GET / HTTP/1.1" 200 2616
[12/Dec/2020 13:44:45] "GET /static/images/logo.png HTTP/1.1" 404 1772

I've tried many solutions on stackoverflow but cant seem to get it working I've tried using my image file directly in the statics folder too.

Would be GLAD if someone cud help out!


Solution

  • try this add and static directory in your apps and in each static directory add another directory with the app name like below:

    ├───Project_Directory
    │   ├───app_name
    │   │   ├───migrations
    │   │   ├───static
    │   │   │   └───app_name
    │   │   │       ├───css
    │   │   │       └───images
    

    now in your template use:

    <img src="{% static 'app_name/images/logo.png' %}" alt="Image">
    

    and see if that works