title: django template doesn't load image uploaded in ImageField properly
body: <p>i know this question have been brought up a lot of times,but i have tried a lot of different things,not working add.i belive i might have forget to add something silly in my code,just cant figure out what.below is the code of my heading model:</p>
  
  <pre><code>class Heading(models.Model):
      category = models.ForeignKey(Category)
      title = models.CharField(max_length=5000)
      content = RichTextField()
      image= models.ImageField(null=True,blank=True)
      date = models.DateField(default=datetime.now())
      time = models.TimeField(default=datetime.now())
      slug = models.SlugField(unique=True, null=True, blank=True)
  </code></pre>
  
  <p>i have also added below codes in my projects settings.py</p>
  
  <pre><code>MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
  MEDIA_URL = '/media/'
  </code></pre>
  
  <p>below is my urls.py</p>
  
  <pre><code>from django.conf.urls import include, url ,patterns
  from django.contrib import admin
  from django.conf import settings
  
  urlpatterns = [
      url(r'^tinymce/', include('tinymce.urls')),
      url(r'^ckeditor/', include('ckeditor_uploader.urls')),
      url(r'^grappelli/', include('grappelli.urls')),
      url(r'^admin/', include(admin.site.urls)),
      url(r'^news/', include('news.urls')),
  ]
  if settings.DEBUG:
      urlpatterns += patterns(
          'django.views.static',
          (r'^media/(?P&lt;path&gt;.*)',
          'serve',
          {'document_root': settings.MEDIA_ROOT}), )
  </code></pre>
  
  <p>this is how my directory is set up 
  <a href="https://i.stack.imgur.com/KEt5t.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/KEt5t.png" alt="directory"></a></p>
  
  <p>below is my template code</p>
  
  <pre><code>{% extends "base.html" %}
  
          {%block main_meat%}
          {%if headings%}
                  {%for heading in headings%}
                      &lt;h1&gt;&lt;a href="/news/headline/{{heading.slug}}"&gt;{{heading.title}}&lt;/a&gt;&lt;/h1&gt;
                      &lt;br&gt;
                      &lt;img src='{{heading.image}}'&gt;
                      {{heading.content|safe}}
                  {%endfor%}
  
          {%endif%}
      {%endblock%}
  </code></pre>
  
  <p>when i inspect element on a webbrowser,this is the path of image that i get</p>
  
  <pre><code>&lt;img src="./image_name.png"&gt;
  </code></pre>
  
  <p>subash is the name of my project and news is the name of the app.i know i have posted a long question with lots of codes,please if anyone can point out what i am missing.</p>