Search code examples
djangocloudinary

Django did not display the uploaded image from cloudinary


May I know how to display the img that uploaded to cloudinary from django templates? I have tried the {{ obj.img.url }} but returned error: attribute has no file associated with it. Did I missed somethings?

model.py:

class Order(models.Model):
user = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE, blank=True, null=True)
wts_img = models.ImageField(upload_to='wts/', blank=True, null=True)

html:

{% load cloudinary %}
{% for order in orders %}
  <img src="{{ order.wts_img.url }}" >
{% endfor %}

setting.py:

CLOUDINARY_STORAGE = {
'CLOUD_NAME': 'xxxxx',
'API_KEY': 'xxxxxxx',
'API_SECRET': 'xxxxxxxxxx'
 }


DEFAULT_FILE_STORAGE = 'cloudinary_storage.storage.MediaCloudinaryStorage'

Solution

  • You may want to check Cloudinary Django Photo album sample in particular in list.html on line 31-35. Example to render an image tag:

    {# THUMBNAIL defined in context_processors #}
    {% cloudinary photo.image THUMBNAIL %}