+- Python Forum (https://python-forum.io)
+-- Forum: Python Coding (https://python-forum.io/forum-7.html)
+--- Forum: Web Scraping & Web Development (https://python-forum.io/forum-13.html)
+--- Thread: Django images will not load (/thread-39939.html)
Django images will not load - pythonpaul32 - May-08-2023
I am trying to make a hotel reservation app, but my images will not load. I am using Django and Bootstrap
I have my pictures in a media directory in the main directory of my project (with manage.py, myapp, myproject, venv).
I am pointing to these in settings.py
MEDIA_ROOT = os.path.join(BASE_DIR, 'media') MEDIA_URL = '/media/'And here is the div where I want the image to display
<div class='p-4 m-4' style="height: 300px; background-color: rgba(255,0,0,0.1);"> <img src="/media/pic1.jpg" alt="Photo 1"> </div>The image icon is showing in my development browser than an image is coming up, but it is not loading.
Does anyone have any idea why?
RE: Django images will not load - SpongeB0B - Jul-11-2023
Hi @pythonpaul32
I'm not familiar with Django, I'm using my self Flask...
Did you have look in the UNIX permissions of those files ? I guess the user that run either Django or your webserver should have permissions to do so.
Cheers
RE: Django images will not load - mactron - Jul-15-2023
You need to import the media folder. Put these lines of code in your urls.py
from django.conf import settings from django.conf.urls.static import static urlpatterns = [ #urls #... ]+ static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)https://docs.djangoproject.com/en/4.2/howto/static-files/
Hope this helps..
RE: Django images will not load - Gaurav_Kumar - Jul-20-2023
look!
In your div section the image path you provided in the src attribute of the <img> tag is correct.
But you have to use {% url %} template tag to generate the image URL dynamically For example:-
<div class='p-4 m-4' style="height: 300px; background-color: rgba(255,0,0,0.1);">
<img src="{% url 'image_url_name' 'pic1.jpg' %}" alt="Photo 1">
</div>
* In the above code replace 'image_url_name' with the name of the URL pattern you have defined for serving images in your Django project.
* Now next step is to serve media files during development in your project's urls.py file. For that use static() function like this:-
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
# Your existing URL patterns
]
# Serve media files during development
if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
* in the above code the static() function is used to serve media files during development.
*Now cross check your settings.py file that whether media handling is properly defined or not like this:-
# Media settings
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'
* Now run your django development server and your issue will be resolved.