Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Django - Display an image with static files

I have some issues with "static files" in my project I'd like to simply load an image. Here is my code :

views.py

from django.shortcuts import render
from django.http import HttpResponse
from django.template import loader

# Create your views here.

def D3(request):
        template = loader.get_template('appli1/D3.html')
        context = {}
        return HttpResponse(template.render(context, request))

urls.py

from django.conf.urls import url
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
 
from . import views
 
urlpatterns = [
    url(r'^D3$', views.D3, name='D3'),
]

D3.html

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    {% load staticfiles %}
    <img src="{% static "appli1/testimg.png" %}" alt="My image"/>
</body>
</html>

settings.py

STATIC_URL = '/static/'

The image testimg.png is in appli1/static/appli1/

And the file D3.html is in appli1/templates/appli1/

Thanks for your help !

EDIT : The structure of my project seems good to me, maybe I'm wrong. Here is what it looks like :

test_django/
    manage.py
    db.sqlite3
    test_django/
        __init__.py
        settings.py
        urls.py
        wsgi.py
        __pycache__/
            ...
    appli1/
        __init__.py
        admin.py
        apps.py
        models.py
        tests.py
        urls.py
        views.py
        __pycache__/
            ...
        migrations/
            ...
        static/
            appli1/
                testimg.png
        templates/
            appli1/
                D3.html
like image 491
Jérôme G Avatar asked Oct 17 '25 12:10

Jérôme G


1 Answers

There are following issue with your code:

1) Check quotes in

<img src="{% static "appli1/testimg.png" %}" alt="My image"/>

Technically,in the above "{% static " will be read as one value, then " %}" as other, and finally "My image" as another.

Following is the correct way of doing it:

<img src="{% static 'appli1/testimg.png' %}" alt="My image"/>

This way html read it "{% static 'appli1/testimg.png' %}" as a whole inside which lies 'appli1/testimg.png'.

2) As I don't know your directory structure and hence your root directory, this might be another issue.

If in your 'appli1/static/appli1' your 'static' is at the same level as that of root directory, then it will work fine, which I think is the case as even your templates are in 'appli1/templates/appli1/' and your templates are being loaded. Hence proving that 'static' is at the root level.

Else, if its not the case, and even your templates are not loaded (Coz i'm just assuming your templates are being loaded), then your root 'static' and 'templates' folder are not the same level of root directory and hence the html and static files are not being discovered by the url you are specifying in your html.

like image 123
Ankush Raghuvanshi Avatar answered Oct 19 '25 00:10

Ankush Raghuvanshi