CODEWITHSUNDEEP
djangodjango-templatesdjango-staticfiles
bahudso
bahudso

Reputation: 159

Loading images in a static file

So I have completed the Django tutorial, play around with it some, and feel that I have a good understanding of Django. The only problem I am facing is that when I try to display a static page for a landing page, I cannot seem to get any images to load.

First off I have tried two different methods of displaying a static landing page. First: 

# main app urls.py
    from django.conf.urls import patterns, include, url

    from django.contrib import admin
    admin.autodiscover()

    urlpatterns = patterns('',
        url(r'^$', TemplateView.as_view(template_name="landing/index.html")),
        url(r'^polls/', include('polls.urls', namespace="polls")),
        url(r'^admin/', include(admin.site.urls)),
    )

This is the main app's urls.py and I use the TemplateView to display the static index.html which is located at 'my_app/templates/landing/index.html'.

This is all and well until I try to add a static image into the index.html file. No matter where I put the image file I cannot seem to get it to display. In the index.html template I have tried different methods of using static as well as trying different direct paths without the need for the embedded python code. How am I supposed to display images and where should they be located?

The second method I found that worked for just displaying the static page (not the image) was to create a new app called landing and have that simply display a static page from the urls.py in the same manner(using TemplateView). Is this method better? I still had the same problems in displaying an image within the static page as the first method, which makes me think it has something to do with the TemplateView.

Am I doing this completely wrong? What are my options? I am using Django 1.5.1.

Thanks in advance!

Upvotes: 0

Views: 1982

Answers (2)

Akshar Raaj
Akshar Raaj

Reputation: 15211

This blog explains serving static file and might help:

http://agiliq.com/blog/2013/03/serving-static-files-in-django/

Upvotes: 0

Paulo Bu
Paulo Bu

Reputation: 29794

It is a bit awkward to serve statics files with Django. This is because they have the conception that static files such as images must be in another domain or server for performance/security reasons.

To serve static content with django do this:

# urls.py
# add this lines at the end

from django.conf.urls.static import static
from django.conf import settings
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns += staticfiles_urlpatterns()
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

Then in settings.py define the directory where the images/css/js and similar static contents are:

# settings.py

import os
settings_dir = os.path.dirname(__file__)
PROJECT_ROOT = os.path.abspath(os.path.dirname(settings_dir))

STATIC_URL = '/static/'

STATICFILES_DIRS = (
    # this assumes your static contents is in <your_project>/static/
    os.path.join(PROJECT_ROOT, 'static/'),
    )

MEDIA_ROOT = os.path.join(PROJECT_ROOT, 'media/')
MEDIA_URL = '/media/'

Note: You may also consider images as media and place them in your media/ folder.

That should get static files served with your app. Just reference them like this href="/static/xxxx.jpg" or href="/media/xxxx.jpg".

Hope it helps!

Upvotes: 3

Related Questions