Tomato
Tomato

Reputation: 336

Django can't show images on page

I'm desperatly trying to load some images to and from my database with the help of Django. Loading seems to work, but getting them back from the database and showing them on a webpage doesn't seem to work.

Here some info:

Environment:

myproject |_forpix(my app) |_myproject |_media |_images |_mimicry3.png

I have a base.html wich includes a contentblock "allimages.html":

{% extends "base.html" %}
{% block content %}
<div id="imagelist">
    {% for image in images %}
    <p><img src="{{MEDIA_ROOT}}{{image.picture.url}}" />{{ image }}</p>
    {% endfor %}
</div>

{% endblock %}

This gives me the following result: enter image description here

And if I click on one of the images i get:enter image description here

In my settings.py I've set the following:

STATIC_URL = '/static/'

MEDIA_URL = '/media/'

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

TEMPLATE_DIRS = (os.path.join(BASE_DIR, 'templates/'),)

Now i really don't know how to fix this. Can anybody provide me with some help (not the django tutorial, I've been there, tried that)

Do I have to add something in the urls.py especially for the media file? Or is it something else?

If i need to provide extra info, just ask.

Upvotes: 0

Views: 4537

Answers (2)

heber camargo
heber camargo

Reputation: 33

In adition the line that you have to add is..

from django.conf import settings
from django.conf.urls.static import static

urlpatterns = patterns('',
    ...
) + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

But it has to be in the urls.py of your project folder. not in the urls.py of your App folder. I knew it by mistake.

Upvotes: 0

catavaran
catavaran

Reputation: 45575

^media/$ is a very wrong regex for media files. You should delete the $ (end-of-the-string) sign from this regex.

Usually for development environments I use this snippet in the urls.py:

from django.conf import settings
from django.conf.urls.static import static

urlpatterns = patterns('',
    ...
) + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

Also remove the useless {{ MEDIA_ROOT }} part from your template code. It should be:

<img src="{{ image.picture.url }}" />

Upvotes: 1

Related Questions