Hi I'm trying to display an uploaded user image in django but when I try to display it only a blank box appears. However when I click on the image it brings up a new page with the image. I don't know why it isn't displaying on the page.
html
{% load mptt_tags %}
{% recursetree location %}
<div class="card">
<div class="card-body">
<a class="btn btn-primary" type="button" href="/AddClimb/{{node.id}}">Add Climb</a>
</div>
</div>
<a href="{{ node.img.url }}"><img source="{{node.img.url}}" width="500" height="400"></a>
<div class="container">
<div class="row equal">
<div class="col-md-6 col-sm-6">
<div class="card-header bg-primary text-white text-center">{{ node.name }}</div>
<div class="card" style="background-color: #eee;">
<p class="font-weight-bold">Image: <img source="{{node.img.url}}"></p>
<p class="font-weight-bold">Description: <span class="font-weight-normal">{{node.description}}</span></p>
<p class="font-weight-bold">Directions: <span class="font-weight-normal">{{node.directions}}</span></p>
<p class="font-weight-bold">Elevation: <span class="font-weight-normal">{{node.elevation}}</span></p>
<p class="font-weight-bold">Latitude: <span class="font-weight-normal">{{node.latitude}}</span></p>
<p class="font-weight-bold">Longitude: <span class="font-weight-normal">{{node.longitude}}</span></p>
<p class="font-weight-bold">Added By: <span class="font-weight-normal">{{node.author}}</span></p>
<p class="font-weight-bold">Date Added: <span class="font-weight-normal">{{node.date}}</span></p>
<a class="btn btn-primary float-center" type="button" href="/EditLocation/{{node.id}}/">Edit Location</a>
</div>
</div>
{% endrecursetree %}
settings.py
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'Choss_App/media')
urls.py
from django.conf.urls import url
from django.contrib import admin
from django.urls import include, path
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
path('admin/', admin.site.urls),
path('', include('Choss_App.urls')),
]
# if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
It is
src=…
, not:source=…