CODEWITHSUNDEEP
pythondjango
Vyoma Patel
Vyoma Patel

Reputation: 3

Images not showing on site

I can not see the images show up as broken on my site. Here is what I tried :

  1. Installed Pillow: imported it in my models.py.

  2. Settings.py has :

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

  3. Pictures: currently in my "media" folder which sits in my main project directory.

  4. app/urls.py has static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) and imported settings.
  5. Template has {% load static %} and {{ post.image.url }}.
  6. Collected static.
  7. Made migrations.

  8. Ran server :

    settings.py
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static/') 
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'profiles/static/')
]
MEDIA_ROOT = os.path.join(BASE_DIR, 'media/')
MEDIA_URL = '/media/'

urls.py
from django.urls import path
from . import views
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    path('post/<id>/', views.post, name='post'),
    ....
    ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

models.py
from django.db import models
from django.conf import settings
from PIL import Image

class Profile(models.Model):
    title = models.CharField(max_length=200, blank=True, null=True)
    bio = models.TextField(max_length=500, blank=True)
    user = models.OneToOneField(settings.AUTH_USER_MODEL, 
on_delete=models.CASCADE, null=True)

    def __str__(self):
        return f'{self.user.username} Profile'

class Post(models.Model):
    title = models.CharField(max_length=200)
    post = models.TextField(max_length=100, blank=True)
    image = models.ImageField(default='default.jpg', 
upload_to='picsinposts')
    profile = models.ForeignKey(Profile, on_delete=models.CASCADE, 
blank=True, null=True)

    def __str__(self):
        return self.title


{% extends "base.html" %}    
{% load static %}
{% block content %}
<html>
<body>
	<div class= "Profile">
            <h2>  {{ profile.title }}  </h2>
            <p> {{ profile.bio }} </p>
            {% if request.user == profile.user %}
            	<a href="{% url 'edit_profile' id=profile.id %}"> Edit your profile! </a>
            {% endif %}
	</div>
	<br>
	{% for post in post %}
	<div class= "Posts">
		<a href="{% url 'post' id=post.id %}"> {{ post.title }} </a>
		<p> <img src="{{ post.image.url }}", style= "width:100px;"/> </p>
		<a href="{% url 'follow' id=profile.id %}"> Follow Profile! </a>

Where my pictures live currently

What am I missing?

Upvotes: 0

Views: 72

Answers (1)

Arjun Shahi
Arjun Shahi

Reputation: 7330

Your static url need to be in your project's urls.py. Remove this form app/urls.py and place into your project's urls.py instead:

project/urls.py

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

Upvotes: 1

Related Questions