How to let the django thumbnail show me image? - django

Question

Currenlty,I have learn django from the http://www.lightbird.net/dbe/photo.html and I meet a problem!I want show the thumbnail image on the 'Thumbnail item' but it's just show the html code:
<a href="/photos/1414.jpg><img border="0" alt="" src="/photos/1414.jpg" height="40"/></a>
I have define the class Image method like below:
def thumbnail(self):
return """<a href="/%s><img border="0" alt="" src="/%s" height="40"/> """ % ((self.image.name,self.image.name))
The attribute of Class Image have define like that:
class Image(Models.Model):
#The rest of another code
image=models.ManyToManyField(upload_to="photos/")
#....another code ..
I have check my path have create a photos on my project 'myweb/photos/'
How can i let the page understand it's html code .

Answer 1

First, I have no idea why you're using a ManyToMany field for this use case. You need to be using an ImageField.
The field you define as an ImageField will have a url property, which is what you use to reference the relative path to the file.
Second, don't mix HTML and Python in your model class. Django has templating specifically for this use case:
from django.template.loader import render_to_string
class Image(models.Model):
image = models.ImageField(upload_to='photos')
alt = models.CharField(max_length=100)
def thumbnail(self):
return render_to_string('thumbnail.html', {'image': self})
# thumbnail.html
<img src="{{ image.image.url }}" alt="{{ image.alt }}" ... />
Keep in mind that artificially scaling a full-size image to 40x40 pixels to generate a thumbnail is horribly inefficient, and if there are lots of these, will absolutely crush performance.
As others have mentioned, you can use excellent libraries like django-easy-thumbnails or sorl-thumbnail to generate proper, scaled down, optimized versions of these images at whatever dimensions you need.

Answer 2

please follow the tutorial on djangoproject.com ..the code on your link is not a right way use django,close it and read official docs

Answer 3

Use the url attribute instead of the name attribute on the image:
def thumbnail(self):
return """<a href="/%s><img border="0" alt="" src="/%s" height="40"/> """ % ((self.image.url,self.image.url))
There is also the excellent tool sorl-thumbnail. It helps with dynamically generating thumbnails in your templates. Install it with pip install sorl-thumbnail. You can use it like this:
template.html
{% load thumbnail %}
{% thumbnail item.image "100x100" crop="center" as im %}
<img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}">
{% endthumbnail %}