CODEWITHSUNDEEP
djangodjango-templatesdjango-staticfilesdjango-static
Sahal Sajjad
Sahal Sajjad

Reputation: 235

Django, not able to load image, but css is loaded

I m able to load css file based on the tutorial provided by djangoproject but images are not getting loaded. Here is the file structure: appname/static/ mess/ img/ burger.jpg

Here is the login.html file where I m trying to load the image.

`<html>
 <head>
     <title>Login | Mess @ IIIT Sri City</title>
     {% load staticfiles %}
     <link rel="stylesheet" type="text/css" href="{% static 'mess/css/style.css' %}"> 
     <link rel="stylesheet" type="text/css" href="{% static 'mess/css/bootstrap.min.css' %}">
 </head>
 <body>
     <div class="container">
         <div id="left-content" class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
         {% load staticfiles %}
         <center><img src="{% static 'mess/img/burger.jpg' %}" alt="Please Login here"></center>
         </div>
         <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
             <form action="" method="post">{% csrf_token %}
                 {{ form}}
                 <input  type="submit" value="Submit" />
             </form>
         </div>
     </div>
 </body>
`

It would be a great help if you could resolve me out of this issue. PS: I m a beginner in Django. Django version: 1.8 Please tell me if u need more info. Thanks in advance.

Upvotes: 0

Views: 934

Answers (3)

Sahal Sajjad
Sahal Sajjad

Reputation: 235

It was because the folder didn't have necessary permissions and Django was unable to access it.

Upvotes: 1

jape
jape

Reputation: 2901

There are a few changes to make here. You can copy and paste the following code below for your template, and the settings below that in your urls.py:

html:

{% load staticfiles %}

<html>
    <head>
        <title>Login | Mess @ IIIT Sri City</title>
        <link rel="stylesheet" type="text/css" href="{% static 'mess/css/style.css' %}"> 
        <link rel="stylesheet" type="text/css" href="{% static 'mess/css/bootstrap.min.css' %}">
    </head>
    <body>
        <div class="container">
            <div id="left-content" class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                <center><img src="{% static 'mess/img/burger.jpg' %}" alt="Please Login here" /></center>
            </div>
            <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                <form action="" method="post">{% csrf_token %}
                    {{ form }}
                    <input type="submit" value="Submit" />
                </form>
            </div>
        </div>
    </body>
</html>

urls:

if settings.DEBUG:
    urlpatterns += patterns('',) + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
    urlpatterns += patterns('',) + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

In the html, I added {% load staticfiles %} at the top to keep your code DRY (Don't Repeat Yourself). I also made a few syntax changes to your code; very minor. In the urls, when your settings are set to DEBUG = True, Django will load your static images. When you go into production and DEBUG = False, Django no longer serves the static files. That is your server's responsibility.

I hope that helps.

If it still doesn't work, can you please post your STATIC_URL and STATIC_ROOT?

Upvotes: 0

Pierangelo Orizio
Pierangelo Orizio

Reputation: 824

in url.py have you configurated staticfiles?

if settings.DEBUG:  
        urlpatterns += patterns('',  
                                #REMOVE IT in production phase  
                                (r'^media/(?P<path>.*)$', 'django.views.static.serve',  
                                {'document_root': settings.MEDIA_ROOT})
          )
urlpatterns += staticfiles_urlpatterns()

Upvotes: 0

Related Questions