Unable to display Images from Django Imagefield

Question

I am able to load images to the specific path using Imagefield but not able to display those images in my html templates.

enter image description here

my settings.py :

STATIC_ROOT = "/app/static/"

STATIC_URL = '/static/'

STATICFILES_DIRS = (
    os.path.join( BASE_DIR,'app','static'),
)

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

files are loading successfully @ ./media/

here is my urlpattern setting: if settings.DEBUG:

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

 {% for service in services %}
    <div class="col-md-4 animate-box">
        <div class="feature-left">
            <span class="icon">
            <img src="{{ service.icon.url }}" alt=""/>
            </span>
            <div class="feature-copy">
            <h3>{{service.name}}</h3>
            <p>{{ service.text }}</p>
            <p><a href="#">Learn More <i class="icon-arrow-right22"></i></a></p>
        </div>
    </div>
   </div>
{% endfor %}

Not Found: /icon/6.png
Not Found: /icon/blog-1.jpg
Not Found: /media/6_qjtYB6t.png
Not Found: /blog/blog-3.jpg

Add your model class to the question. – Håken Lid Aug 12 '18 at 11:27 — Håken Lid, Aug 12 '18 at 11:27

score 0 · Answer 1 · edited Aug 12 '18 at 11:24

0

try

<img src="{{ MEDIA_URL }}{{ service.icon.url }}" alt=""/>

edited Aug 12 '18 at 11:24

Håken Lid

22,318
9
52
67

answered Aug 12 '18 at 06:15

h.siyavashi

98
4

Tried but not working! error : The 'icon' attribute has no file associated with it. – Chandan Manna Aug 12 '18 at 09:23
Have the pictures loaded correctly in the "media" directory? – h.siyavashi Aug 12 '18 at 14:12

score 0 · Answer 2 · answered Aug 12 '18 at 22:20

thanks for your attention. however I've solved the issue using a if tag. This is working now.

{% for service in services %}
  <div class="col-md-4 animate-box">
    <div class="feature-left">
      <span class="">
        {% if service.icon %}
        <img src="{{service.icon.url}}" alt=""/>
        {% endif %}
      </span>
    <div class="feature-copy">
        <h3>{{service.name}}</h3>
        <p>{{ service.text }}</p>
        <p><a href="#">Learn More <i class="icon-arrow-right22"></i></a></p>
      </div>
    </div>
  </div>
{% endfor %}

Unable to display Images from Django Imagefield

2 Answers2