We Keep Coding

Can't import image in Django

Here is my project structure
I'm trying to display the image from the static folder but it can't be displayed.
I also tried to mention the static folder in the settings.py file as below:
Here is how I'm calling the image from the base.html file.
I'm not sure what is wrong, I tried to search but the google sources can't help.

The correct format of displaying static images in django would be this
{% load static %}
<img src="{% static 'images/heart1.png' %}">
Edit
Put the following lines in your settings.py
STATIC_ROOT =os.path.join(BASE_DIR,'staticfiles')
STATIC_URL = '/static/'
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static'),
)
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
add the following to your urls.py
from django.conf.urls.static import static
urlpatterns = [
path('admin/', admin.site.urls),
#other urls
]
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

You have to use the static template tag in your template
{% load static %}
{% static "images/heart1.png" %}

Unable to access static files in Django - Development server

I am trying to access static files in browser but unable to access them. My static settings insettings.py are below
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, "static")
My urls.py
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^$', FrontPage.as_view()),
# url('', include(router.urls))
]+ static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
My folder structure
projectname
projectname
settings.py
urls.py
app1_name
static
bs4
css
cover.css
admin
templates
My template.html
<link href="/static/bs4/css/cover.css" rel="stylesheet">
The above link isn't loading the static file. I'm getting 404 on hitting above url. Please let me know where am I going wrong.

All you need is an update of your settings:
STATIC_DIR = os.path.join(BASE_DIR, 'static')
STATIC_URL = '/static/'
STATICFILES_DIRS = [STATIC_DIR, ]

Use: <link href="{% static 'bootstrap/css/cover.css' %}" rel="stylesheet">
Make sure to use {% load static %} at the top of your template.html and you are all set.

MEDIA_URL not working in Django templates

I'm building a project in Django 3, but the images aren't linking in the files.
All images are store in a folder called media & here's the HTML for my logo for example -
<a class="navbar-brand" href="{% url 'index' %}">
<img src="{{ MEDIA_URL}}logo.png" height="70" class="pr-4" alt="Site logo">
Then I've this in my settings -
STATIC_URL = '/static/'
STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static'),)
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
and in my project level URLS I've got -
from django.conf import settings
from django.conf.urls.static import static
+ static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

You should use static folder for the static content like images, css, js etc... and media for the dynamic content like uploads from users, avatar pictures... then you should use this template tag:
{% load static %}
<a class="navbar-brand" href="{% url 'index' %}">
<img src="{% static 'logo.png' %}" height="70" class="pr-4" alt="Site logo">
If you want to use media folder anyways, you need to add this in your urls.py (extracted from here) in order to make it work fine in local:
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = patterns('',
# ... the rest of your URLconf goes here ...
) + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

user uploaded image is not displaying

Image uploaded by user is not displaying though i have not done wrong in template. Also i have defined MEDIA_URL and MEDIA_ROOT. What might be the reason for not getting image displayed?
Code
image = models.ImageField(upload_to='products/%Y/%m/%d', blank=True)
project/urls.py(urls.py of main project)
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^', include('shop.urls', namespace='shop')),
]
if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL,
document_root=settings.MEDIA_ROOT)
Settings.py
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media/')
templates/shop/product/list.html
<a href="{{ product.get_absolute_url }}">
<img src="{% if product.image %} {{ product.image.url }} {% else %} {% static 'img/no_image.png' %} {% endif %}" >
</a>
I know this question is asked multiple times but my code took after the documentation and still i could not display image. Could anyone help me, please?

It is working now after fresh restart of the server. So the above code and process of serving media files is correct.

Django Display ImageField With Media Dir

I am using Django 1.9.3. I am trying to display media files uploaded by say a user (e.g. imageFields).
HTML Page:
{% for project in projects %}
<img src="{{ project.image.url }}" class="img-responsive" alt="">
{% endfor %}
Views.py:
def home(request):
projects = AvailableProject.objects.all().order_by('-published_date')
return render(request, 'accounts/home.html', {'projects': projects})
urls.py:
urlpatterns = [
...
]
urlpatterns += staticfiles_urlpatterns()
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
settings.py:
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATICFILES_DIRS = (
('global', os.path.join(BASE_DIR, 'smilesite', 'project_static')),
('admins', os.path.join(BASE_DIR, 'admins', 'static')),
('accounts', os.path.join(BASE_DIR, 'accounts', 'static')),
('mysite', os.path.join(BASE_DIR, 'mysite', 'static')),
('media', os.path.join(BASE_DIR, 'media')),
)
# print(STATICFILES_DIRS)
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
)
# Define place to save media (e.g. pictures for all the projects)
PROJECT_PATH = os.path.abspath(os.path.dirname(__file__))
MEDIA_ROOT = os.path.join(PROJECT_PATH, 'media')
MEDIA_URL = '/media/'
models.py:
from django.db import models
from django.conf import settings
# Create your models here.
class AvailableProject(models.Model):
image = models.ImageField(upload_to=settings.MEDIA_ROOT)
I have literally went through every single stack over flow page on this and tried the following solutions, but still has not worked...:
<img src="{% static 'media/{{project.image.title}}.jpg' %}" class="img-responsive" alt="">
<img src="{{ project.image.url }}" class="img-responsive" alt="">
I don't know why the project.image.url is not showing the corresponding image correctly.

The reason was exactly what Joni Bekenstein said.
I changed this one line and everything worked:
image = models.ImageField(upload_to='uploads/')
Then {{ project.image.url }}, was the correct url.