How to display image from model in Django - python

To be clear, I have tried researching this on my own but since I'm still very new to Django I am unable to understand the solutions here. I also have read the documentation and I don't understand what I'm doing wrong. I cannot get the images located in the "ad_pictures" directory to display in the HTML.
Here's my code:
settings.py
STATIC_URL = '/static/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'
urls.py (project)
from django.conf.urls import url, include
from django.contrib import admin
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^accounts/', include('accounts.urls')),
url(r'^classifieds/', include('classifieds.urls')),
] +static(settings.MEDIA_URL, document_ROOT=settings.MEDIA_ROOT)
urls.py (classifieds app)
from django.conf.urls import url
from . import views
app_name = 'classifieds'
urlpatterns = [
url(r'^create/', views.create, name='create'),
url(r'^latestads/', views.latestads, name='latestads'),
]
models.py
class Post(models.Model):
title = models.CharField(max_length=150)
price = models.CharField(max_length=100)
body = models.TextField()
pub_date = models.DateTimeField(null=True)
author = models.ForeignKey(User, null=True)
category = models.CharField(max_length=150, null=True)
picture = models.ImageField(upload_to='ad_pictures', default='')
latestads.html
{% for post in posts.all %}
<div class="advertisements">
<div class="a-title">
<h3>{{ post.title }}</h3>
</div>
<div class="a-image">
<img src="{{ post.picture.url }}">
</div>
<div class="a-content">
<p>{{ post.body }}</p>
</div>
<div class="a-date">
<p>{{ post.pub_date }} by {{ post.author }}</p>
</div>
</div>
<img src="{{ post.image.url }}">
{% endfor %}
Picture of directory structure:
here
Html output:
here
I'm sure part of the problem is the "post.picture.url" in the HTML.
Any insight is greatly appreciated.
Thanks

urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^accounts/', include('accounts.urls')),
url(r'^classifieds/', include('classifieds.urls')),
] +static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
please change document_ROOT to document_root

Related

NoReverseMatch at /'blog' is not a registered namespace

I am trying to link two pages. Page files are home.html and pageOne.html. I am getting "NoReverseMatch at /'blog' is not a registered namespace". I am using django. When I first created the app, I named it artclBlog, I then created a templates folder and another folder within that one, this one I named blog. I think I should have kept these two names the same, this may have caused some confusion in my code.
pic of error
my views.py
from django.shortcuts import render, get_object_or_404
from .models import Blog
def home(request):
blogs = Blog.objects.order_by('-date')
return render(request, 'blog/home.html', {'blogs': blogs})
my urls.py
from django.contrib import admin
from django.urls import path, include
from django.conf.urls.static import static
from django.conf import settings
from artclBlog import views
urlpatterns = [
path('admin/', admin.site.urls),
path('', views.home, name='home'),
path('<int:blog_id>/', views.PageOne, name='PageOne')
]
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
my models.py
from django.db import models
class Blog(models.Model):
title = models.CharField(max_length=200, default='')
summary = models.CharField(max_length=200, default='')
pageOne = models.TextField(default='')
pageTwo = models.TextField(default='')
pageThree = models.TextField(default='')
pageFour = models.TextField(default='')
date = models.DateField(default='')
def __str__(self):
return self.title
home.html
{% for blog in blogs %}
<a href="{% url 'blog:PageOne' blog.id %}">
<h2 id="txt">{{ blog.title }}</h2>
</a>
<h4 id="txt">{{ blog.date|date:'M d y' }}</h4>
<p id="txt">{{ blog.summary|truncatechars:190 }}</p>
<hr>
{% endfor %}
You did not define an app_name in your urls.py, hence that means that blog: in blog:PageOne makes no sense. You thus either define an app_name, or remove the namespace.
Option 1: Add an app_name in urls.py
You can specify the namespace by writin an app_name in the urls.py:
from django.contrib import admin
from django.urls import path, include
from django.conf.urls.static import static
from django.conf import settings
from artclBlog import views
app_name = 'blog'
urlpatterns = [
path('admin/', admin.site.urls),
path('', views.home, name='home'),
path('<int:blog_id>/', views.PageOne, name='PageOne')
]
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
This however means that thus all views now use this namespace, including home for example.
Option 2: Remove the namespace
Another option is to remove the namespace in the {% url … %} template tag [Django-doc]:
{% for blog in blogs %}
<a href="{% url 'PageOne' blog.id %}">
<h2 id="txt">{{ blog.title }}</h2>
</a>
<h4 id="txt">{{ blog.date|date:'M d y' }}</h4>
<p id="txt">{{ blog.summary|truncatechars:190 }}</p>
<hr>
{% endfor %}
This mistake comes usually when you have created different apps in your project.
First you do:
django-admin startproject mainapp
Then you do
python manage.py startapp secondapp
urls.py in your secondapp folder would automatically have app_name = 'secondapp'. However you must add in mainapp urls.py the following:
urlpatterns = [
...
path('secondapp/',include('secondapp.urls',namespace='secondapp')),
...
]
This is because your mainapp is the one that has the main access to the project and needs to know your secondapp urls.

images does not appear in html, it is apearing like it is broken

Notice: when i go to [http://127.0.0.1:8000/media/images/download.jpeg] it takes me to the home page while the url is [http://127.0.0.1:8000/media/images/download.jpeg].
images not apearing in html, se the code down there, please tell me what is the problem.
models.py
from django.db import models
class jop(models.Model):
image = models.ImageField(upload_to='images/')
summary = models.CharField(max_length=200)
views.py
from django.shortcuts import render
from .models import jop
Create your views here.
def home(request):
jops = jop.objects
return render(request, 'jops/home.html', {'jops':jops},)
home.html
<div class="album py-5 bg-light">
<div class="container">
<div class="row">
{% for jop in jops.all %}
<div class="col-md-4">
<div class="card mb-4 shadow-sm">
<img src="{{jop.image.url}}"/>
<p class="card-text">{{ jop.summary }}</p>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
urls.py
from django.conf.urls import url
from django.contrib import admin
from django.conf import settings
from django.conf.urls.static import static
import jops.views
urlpatterns = [
url(r'^admin/', admin.site.urls),
url('', jops.views.home, name='home'),
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
settings.py
STATIC_URL = '/static/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'
You need to anchor and terminate your regex for the home page, otherwise it will match everything including your image URL.
url('^$', jops.views.home, name='home'),
Alternatively, use the new path syntax:
path('', jops.views.home, name='home'),

Django not serving images based on ImageFiled

I'm having issues serving images based on the ImageField in Django.
models.py part looks like that:
class Post(models.Model):
author = models.ForeignKey(Author, on_delete=models.CASCADE)
category = models.ManyToManyField(Category)
trip = models.ForeignKey(Trip, on_delete=models.CASCADE)
main_image = models.ForeignKey(Image, on_delete=models.CASCADE, related_name='main_image')
images = models.ManyToManyField(Image, related_name='images')
class Image(models.Model):
name = models.CharField(max_length=32)
picture = models.ImageField(upload_to='pictures/', blank=True)
trip = models.ForeignKey(Trip, on_delete=models.CASCADE)
taken = models.DateTimeField(blank=True, null=True)
uploaded = models.DateTimeField(default=timezone.now)
def __unicode__(self):
return self.name
settings.py contains the MEDIA_URL and MEDIA_ROOT:
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/2.1/howto/static-files/
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
Also included what I've found in other SO topics in the urls.py:
from django.contrib import admin
from django.urls import path, include
from django.conf.urls import url
from django.contrib.staticfiles.urls import static, staticfiles_urlpatterns
from django.conf import settings
from markdownx import urls as markdownx
urlpatterns = [
path('admin/', admin.site.urls),
path('', include('blog.urls')),
url(r'^markdownx/', include('markdownx.urls')),
] + staticfiles_urlpatterns() + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
In the end I put it in the html template like that:
{% extends 'blog/base.html' %}
{% block leftcolumn %}
{% for post in posts %}
<div class="leftcolumn">
<div class="card" style="max-width: 100%">
<h2>{{ post.title }}</h2>
<h5>published: {{ post.published_date }}, by: {{ post.author }}</h5>
<div><img src="{{ post.main_image.url }}"></div>
<p>{{ post.byline }}</p>
</div>
</div>
{% endfor %}
{% endblock %}
But the image is not shown..
I can see the image if I go to the url host:8000/media/pictures/test_photo.jpgand in general I can display images on the page (e.g. within django-markdownx field) but not through ImageField url.
Any ideas what's wrong here?
This line:
<div><img src="{{ post.main_image.url }}"></div>
should be:
<div><img src="{{ post.main_image.picture.url }}"></div>
The reason is your model Image does not have an url method. The method belongs to the ImageField, in this case picture.

Unable to display ImageField within Django template

I hope you can help me withmy Django project. I am able to upload an images under a media_cdn folder, inside a folder based on the name of the slug. The problem occurs when I try to display the image inside my post list and post.
Can you please have a look at my code and offer a solution. I spent hours trying to get it to work. Please help.
settings.py
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static/')
MEDIA_URL = "/media/"
MEDIA_ROOT = os.path.join(BASE_DIR, 'media_cdn/')
models.py
def upload_location(instance, filename):
return "%s/%s" %(instance.slug, filename)
class Post(models.Model):
category = models.ForeignKey(Category)
title = models.CharField(max_length=250)
slug = models.SlugField(max_length=250, unique=True)
image = models.ImageField(upload_to=upload_location,
null=True,
blank=True,
width_field="width_field",
height_field="height_field")
height_field = models.IntegerField(default=0)
width_field = models.IntegerField(default=0)
body = models.TextField()
date = models.DateTimeField()
updated = models.DateTimeField(auto_now=True)
postlist.html
{% block content %}
{% for post in posts %}
<div class="container w3-card-4">
{% if post.image %}
<img src="{{ post.instance.image.url }}">
{% endif %}
...
post.html
{% block content %}
<div class="row">
<div class="container w3-card-4">
{% if instance.image %}
<img src= "{{ instance.image.url }}" class="img-responsive">
{% endif %}
...
url.py
from django.conf.urls import include, url
from django.contrib import admin
from django.conf.urls.static import static
from django.conf import settings
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^', include('personal.urls')),
url(r'^blog/', include('blog.urls', namespace='blog', app_name='blog')),
]
if settings.DEBUG:
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
I don't know what else to try to call that image from the folder. Any advice would be greatly appreciated. Thank you!
Use post.image.url instead of post.instance.image.url. Check the documentation.
ImageField inherits all the attributes of the FileField which includes url.

Django problems with media and image in template

Have a problem, try to do simple gallery in django, but when i tried to check how it looks, picture doesn't show anything only title name and there is at terminal "Error 404 not found". Can't realise what actually is wrong... Please help. thx...
Not Found: /media/images/example.png
[16/Mar/2016 17:59:17] "GET /media/images/example.png HTTP/1.1" 404 2168
models.py
class Album(models.Model):
title = models.CharField("Название альбома", max_length=100)
slug = models.SlugField("Ссылка на альбом", max_length=100, unique=True)
img = models.ImageField("Изображение альбома", upload_to='images',
help_text='Размер изображения 200px на 200px')
created_date = models.DateTimeField(default=timezone.now)
published_date = models.DateTimeField(blank=True, null=True)
class Photo(models.Model):
title = models.CharField("Название фотографии", max_length=100)
album = models.ForeignKey(Album, related_name='Альбом')
img = models.ImageField("Фото", upload_to='images',
help_text='Желательно не большой размер')
urls.py - app
from django.conf.urls import url
from django.conf import settings
from django.conf.urls.static import static
from django.views.generic import ListView, DetailView
from .models import Album, Photo
urlpatterns = [
url(r'^$', ListView.as_view(
model=Album,
context_object_name='my_album',
template_name='gallery/album.html'),
name='gallery'
),
url(r'^(?P<slug>[-\w]+)/$', DetailView.as_view(
model=Album,
context_object_name='photos',
template_name='gallery/photo.html'),
name='photo'
),
]
if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL,
document_root=settings.MEDIA_ROOT)
urls.py - project
from django.conf.urls import url, include
from django.contrib import admin
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^gallery/', include('gallery.urls')),
]
settings.py
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static/')
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media/')
template
{% extends "gallery/base.html" %}
{% load thumbnail %}
{% block title %}My Gallery{% endblock %}
{% block text %}
{% for album in my_album %}
<a href='{{ album.slug }}'>
<img src="{{ album.img.url}}" alt="{{ album.title }}">
<!-- {% thumbnail album.img "200x200" crop="center" as im %}
<img src="{{ im.url }}" alt="{{ im.title }}" width="{{ im.width }}"
height="{{ im.height }}">
{% endthumbnail %} -->
</a>
{% endfor %}
{% endblock %}
ProjectStructure
ProjectFolder/
app/
migrations/
static/
templates/
admin.py
models.py
..
project/
settings.py
urls.py
..
media/
images/
example.png
my_env/
manage.py
if in setting.py i do MEDIA_URL = 'media/images' it will work, but only for album template if you will go to see album photos, there photo won't shows too with the same error... Actually i can't understand and realise how to do access to folder media and just bring any of content placed here what i need. Help me...

Categories

Resources