how to display thumbnails?

Question

please help fix the problem.

I have such a code. it works: models.py:

class Drt(models.Model):
    title = models.CharField(max_length=100)
    date = models.DateField()
    image = models.FileField(upload_to='avtos/static/uploads/')

    @classmethod
    def get_all_entries(self):
        return self.objects.all()

    @property
    def image_name(self):
        return os.path.basename(self.image.name)

template.html:

{% load staticfiles thumbnail %}

<div class="list">
    {% for entrie in all_entries_avtopark %}
        <a class="fancybox" href='static/uploads/{{ entrie.image_name }}'>
        {% thumbnail entrie.image "204x127" crop="center" as im %}
            <img class="" alt="{{ entrie.title }}" src='static/uploads/{{ entrie.image_name }}' width="204" height="127" />
        {% endthumbnail %}  
        </a>
    {% endfor %}
</div>  

I would like to apply sorl.thumbnail module and write the following code. template.html:

<div class="list">
    {% for entrie in all_entries_avtopark %}
        <a class="fancybox" href='static/uploads/{{ entrie.image_name }}'>
        {% thumbnail "static/uploads/{{ entrie.image_name }}" "204x127" crop="center" as im %}
            <img class="" alt="{{ entrie.title }}" src='{{ im.url }}' />
        {% endthumbnail %}  
        </a>
    {% endfor %}
</div>  

the resulting images are not displayed (src links lead nowhere).

please tell me how can I print thumbnails static files?

Answer 1

Here an example for you case:

<div class="list">
    {% for entrie in all_entries_avtopark %}
        <a class="fancybox" href='/media/{{ entrie.image }}'>
        {% thumbnail entrie.image "204x127" crop="center" as im %}
            <img class="" alt="{{ entrie.title }}" src='{{ im.url }}' />
        {% endthumbnail %}  
        </a>
    {% endfor %}
</div>  

and documentation link for sorl thumbnail

Mediafiles uploaded by user usually stored in media directory(not static).

Answer 2

You don't need the image_name method. sorl-thumbnail templatetag knows how to handle FileFields. So this should work:

{% thumbnail entrie.image "204x127" crop="center" as im %}
    <img class="" alt="{{ entrie.title }}" src='{{ im.url }}' />
{% endthumbnail %}

Also, for the link to the original image, you should use the url property of the FileField, which will give you an absolute path to the file, in effect using your upload_to configuration and also your MEDIA_URL configuration.

<div class="list">
    {% for entrie in all_entries_avtopark %}
        <a class="fancybox" href="{{ entrie.image.url }}">
        {% thumbnail entrie.image "204x127" crop="center" as im %}
            <img class="" alt="{{ entrie.title }}" src='{{ im.url }}' />
        {% endthumbnail %}  
        </a>
    {% endfor %}
</div>

By the way, if you know that you will always store images in that field, maybe it would be better to use an ImageField which validates that the uploaded file is actually an image.