Develop Reference

Django: Static Image won't load

I have been following the official documentation to the letter, trying some of the advice for related questions on here, and just searching the web in general and I am still having no luck getting one little image to load.
I have an image called 'logo.png' and my project hierarchy looks like this:
project/
mysite/
app/
__init__.py
admin.py
models.py
urls.py
view.py
mysite/
__init__.py
settings.py
urls.py
views.py
wsgi.py
static/
logo.png
templates/
index.html
calling_image.html
Inside settings.py I have STATIC_URL = '/static/'
Inside calling_image.html I have <img src="/static/logo.png">
My template calling_image.html is called by project/mysite/app/views.py which is of course then called on by project/mysite/app/urls.py and I even tried including the following two lines (as I saw suggested a few times) at the end of my urls.py:
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns += staticfiles_urlpatterns()
Nothing works, so what have I done wrong?
Edit: Sorry I made a type, I have STATIC_URL = '/static/' with the closing slash in my settings.py and for clarification, I am running this on my dev build with python manage.py runserver
Solved: So I ended up solving this myself. I created a directory resources within project/mysite/ and placed logo.png in there. I then set STATICFILES_DIRS = (os.path.join(BASE_DIR, "resources"),) and ran collecstatic and everything worked! Didn't need to use urlpatterns += staticfiles_urlpatterns() and whatnot.

It looks like you probably need the variable STATICFILES_DIRS defined in your settings.py and that should include the location of that static directory holding logo.png.
Django only looks for static files inside a static directory inside each app by default. If you have a static file outside of any app, it won't be picked up by collectstatic automatically.
See https://docs.djangoproject.com/en/1.8/ref/settings/#std:setting-STATICFILES_DIRS
Confusion Surrounding Staticfiles
There's always a lot of confusion around Django and Static files. I believe this confusion comes from the fact that it doesn't make any sense for Django to handle static files in production, but it seems natural to use it when learning to use Django and thus when initially developing.
The reason it doesn't make any sense for Django to serve static files is that Django is a framework for rendering dynamic responses. "Static" files are not dynamic: they don't change. Thus, it's a huge waste of resources to spin up a Python application, which calls all of the Django machinery, just to find and return a file that has no dynamic content.
Staticfiles: the job of the webserver
There is something that is really good at serving static files: webservers themselves (such as a Apache, nginx, etc.). That's what they were designed to do. The webserver can run a Python/Django application or it can just locate a file and send it back, so you typically configure a webserver by telling it something like the following (in pseudo-server-speak):
When someone accesses the path /static/ let them access the files in
the following directory: /var/www/static/.
When someone accesses the
path /, spin up this Python application that lives over here:
/var/www/django-app.
Django Static Files Tools
As a result, Django comes with some helper tools that manage static files, so that your actual server can serve them.
These tools are the following(defined in settings.py):
STATIC_URL: the URL path where your server will be serving your
static files. This is just so that when you use the static templatetag, that Django knows how to urlreverse it. In other words, it's merely a convenient way of turning {% static "..." %} into /static/....
STATIC_ROOT: the place on your server (or in the
cloud somewhere), to which Django will copy your static files, so
that your server can serve them. This copying happens when you run
collectstatic.
STATICFILES_DIRS: any extra directories Django
should look for static files whenever you run collectstatic. By
default Django only looks in each app's directory for a static
directory (just like with templates).
Static Files In Development
Okay, but that's not so helpful in development where you are probably using Django's runserver command. You don't have a server running that will server static files.
Thus, you can ask Django to please also server static files for you in just this one case, because you are developing your application and don't want to run a separate server.
There is a view that automatically should pick up and serve static files when DEBUG=True. Alternately, this is also why someone might use the following:
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns += staticfiles_urlpatterns()

Make sure that django.contrib.staticfiles is included in your INSTALLED_APPS.
In your settings file, define STATIC_URL, for example:
STATIC_URL = 'static/'
Hopes you stored images in folder projectname/static/appname/images/image.png
Finally in your html simply add the following
<img src="appname/images/image.png" alt="My image"/>
please refer django dcumentation

I tried everything, nothing worked. In the end it turn out that image was corrupt because I opened it as bytes in Visual Code editor.
Uploaded new image and everything worked.

If I recall, you need to specify STATIC_ROOT = 'static' in settings.py and you need to have a URL to direct /static to your static files. like so.
urlpatterns += patterns('',
(r'^static/(?P<path>.*)$', 'django.views.static.serve', {
'document_root': settings.STATIC_ROOT, 'show_indexes': True
}),
)
This could be a bit outdated but still works for me.
Also, are you trying to get this to work on your dev site with python manage.py runserver or on a production site?
Update
Here is an example for you main urls.py file.
from django.conf.urls import patterns, include, url
urlpatterns = (
url(r'^admin/', include(admin.site.urls)),
# more urls...
)
#The following enable structural 'static' files while in development mode.
if settings.DEBUG:
urlpatterns += patterns('',
(r'^static/(?P<path>.*)$', 'django.views.static.serve', {
'document_root': settings.STATIC_ROOT, 'show_indexes': True
}),
)
patterns is imported near the top of your urls.py file.
This is where STATIC_ROOT comes in to play.
You may also need to run python manage.py collectstatic in order for your static files to be collected from your various apps and copied into the folder that is STATIC_ROOT.
See this answer for a much more in depth explanation :)

Is it possible to serve a static html page at the root of a django project?

I have a django app hosted on pyhtonanywhere. The app resides at username.pythonanywhere.com/MyApp. I would like to serve a static html page at username.pythonanywhere.com. Is this possible? Essentially it would serve as an index linking to /MyApp, /MyApp2, and other future apps.
I can't seem to find any info on how to do this, but I assume I have to modify mysite/mysite/urls.py as navigating to root currently gives me a 404 with messages about failing to find a match in urls.
urlpatterns = [
url(r'^/$', ???),
url(r'^admin/', include(admin.site.urls)),
url(r'^MyApp/', indluce('MyApp.urls')).
]
The previous is my best guess (a bad one i know). That should (correct me if i'm wrong) match the root URL, but I have no idea how to say "hey django just look for a static file", or where that static html should live, or how to tell django where it lives.
Try not to cut my head off. I'm brand new to django.
P.S. I'm using django 1.8 in a virtualenv on PA

Of course you can. In cases where I just need to render a template, I use a TemplateView. Example:
url(r'^$', TemplateView.as_view(template_name='your_template.html'))
I usually order my URL patterns from most specific to least specific to avoid unexpected matches:
from django.views.generic import TemplateView
urlpatterns = [
url(r'^admin/', include(admin.site.urls)),
url(r'^MyApp/', include('MyApp.urls')),
url(r'^$', TemplateView.as_view(template_name='your_template.html')),
]
As far as where Django looks for templates, it's up to your configuration to tell Django where to look: https://docs.djangoproject.com/en/1.8/topics/templates/#configuration

On PythonAnywhere, you can use the static files facility of your web app to serve the static file before it gets to Django:
Put a file called index.html in a directory and then point a static file entry to that directory. If the static file URL is / and the directory is the one with the html file in it, the file will be served at /.
Be aware that you don't want the directory to be above any of your code or you'll expose your code as static files i.e you don't want to use the directory /somewhere/blah if your code is in /somewhere/blah/code, you'll want to put it in /somewhere/no_code_here

I have been tinkering with Django version 3.2, and I was able to serve a static HTML page at the root of the project after creating a Django app as in their official tutorial like the following in the root urls.py file:
from django.views.generic import TemplateView
urlpatterns = [
path('polls/', include('polls.urls')),
path('admin/', admin.site.urls),
path('', TemplateView.as_view(template_name='home/base.html')),
]
This is given that home/base.html is placed where the default template folder is. If I simply re-use the polls templates directory I can create a folder like polls/templates/home/ to store base.html, for example.

Django static files won't load

i'm a Django newbie working on my first project and having a problem with static files.
I have created a simple auth system using django.contrib.auth consisting of two templates: mysite/templates/index.html and mysite/templates/registration/login.html. I have global static content in mysite/static which I want to be able to access on all templates rendered by all apps.
mysite/templates/index.html contains <img src="{{ STATIC_URL }}pics03.jpg"/> which renders as "static/pics03.jpg" and loads fine when I visit the url localhost:8000/
mysite/templates/registration/login.html contains <img src="{{ STATIC_URL }}pics03.jpg"/> which also renders as "static/pics03.jpg" and does not load when I visit the url "localhost:8000/accounts/login/"
In my urls.py I have:
urlpatterns = patterns('',
url(r'^$', 'mysite.views.home'), # plays index.html template
url(r'^accounts/login/$', 'django.contrib.auth.views.login'),
In my settings.py I have:
PROJECT_DIR = os.path.dirname(__file__)
STATICFILES_DIRS = (
# Put strings here, like "/home/html/static" or "C:/www/django/static".
# Always use forward slashes, even on Windows.
# Don't forget to use absolute paths, not relative paths.
os.path.join(PROJECT_DIR,'static'),
)
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
)
STATIC_URL = '/static/'
STATIC_ROOT = ''
I was under the impression that Django should be looking for global static content in STATICFILES_DIRS, but it doesn't find the static content for login.html even if I change the url in there to an absolute path to the static folder. Can anyone shed any light on this?

Your problem is that you arent listening to the URL "/static/" nowhere in your urls.py
If you serve your application via a webserver like apache or nginx then this is normal as the webserver would handle the static files itself.
For development Django comes with a built-in static server
to urls.py, at the very end add
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns += staticfiles_urlpatterns()
What this does is to add the /static/ url and let you serve those without a webserver.
This is equivalent to
url(
regex=r'^static/(?P<path>.*)$',
view='django.views.static.serve',
kwargs={'document_root': settings.STATIC_ROOT,}
)
some people will tell you that you need to wrap the URL-rules in a "if settings.DEBUG" to use the dev-only rules, but this isnt needed at all and actually i find that to be a bad advice.

Are you having trouble when using the build in runserver or are you serving using Apache or similar? I've struggled with this a bit. The documentation I follow is: https://docs.djangoproject.com/en/stable/howto/static-files/
The second part is key when you are ready to deploy. You need to define a static root (which will be empty to begin with) and run the manage.py collectstatic command to move the static files from throughout your project into that folder. Then you can serve them from there.

Does changing STATIC_ROOT='' to STATIC_ROOT='/' help?
It seems to me the only difference is that static/pics03.jpg (relative path) exists on the home page, but doesn't on the other.
The absolute path /static/pics03.jpg exists in both cases. If changing STATIC_ROOT doesn't help, just add a / to the beginning of the urls.

Django static files problem

Duplicate of Django staticfiles app help
I'm using Django 1.3 beta and the static files app is confusing. In development mode it is meant to automatically serve files from the STATIC_URL path.
From http://docs.djangoproject.com/en/dev/howto/static-files/
If you're using the built-in
development server (the runserver
management command) and have the DEBUG
setting set to True, your staticfiles
will automatically be served from
STATIC_URL in development.
This didn't seem to work, so I tried a url pattern ('/static/') which routes to the static.serve view. This just 404'd. Somehow it conflicts with the STATIC_URL, if I change it to 'assets/' it will serve the files from static just fine. It's only logical to use '/static' for the static url, but this conflicts.
Url Patterns:
urlpatterns = patterns('',
# Serve static files for *development only*
(r'^static/(?P<path>.*)$', 'django.views.static.serve',
{'document_root': settings.STATIC_ROOT}),
Static files settings:
STATIC_ROOT = '/home/dave/static/flux'
# URL that handles the static files served from STATIC_ROOT.
# Example: "http://media.lawrence.com/static/"
STATIC_URL = '/static/'
Ideally I would like Django to use the static url for seving files in development without having to use any urlpatterns.

If you want to serve up the static files while using the built in Django server you will need to add a urlpattern. This is what I do (add this after all your other patterns:
if settings.DEBUG:
urlpatterns += patterns('',
(r'^static/(.*)$', 'django.views.static.serve', {'document_root': settings.STATIC_PATH}),
)

Serving static media during Django development: Why not MEDIA_ROOT?

I read this guide about serving static media with Django during development.
I noticed that MEDIA_URL and MEDIA_ROOT were not used in this. Why? What's the difference?
I tried doing it with MEDIA_URL and MEDIA_ROOT, and got weird results.

In a production situation you will want your media to be served from your front end web server (Apache, Nginx or the like) to avoid extra load on the Django/Python process. The MEDIA_URL and MEDIA_ROOT are usually used for this.
Running the built in Development server you will need to set the correct url in your url.py file - I normally use something like this:
from django.conf import settings
urlpatterns += patterns('',
(r'^media/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT}),
)
Which picks up the MEDIA_ROOT from your settings file meaning that it works for development and live.

Straight from the comments in settings.py...
MEDIA_ROOT
The MEDIA_ROOT is the absolute path to the directory that holds media such as /home/media/media.lawrence.com/.
MEDIA_URL
The MEDIA_URL is the URL that handles the media served from MEDIA_ROOT. Make sure to use a trailing slash if there is a path component (optional in other cases). Examples: "http://media.lawrence.com", "http://example.com/media/".
So, to reword those... The MEDIA_ROOT is where the files live physically on your system, and the MEDIA_URL is where those files are mapped to. In development, this might not always be accessible, and in most cases your dev environment and your production environment are not the same, and it is something you're going to have to go back and change. The other thing is that it is NOT A GOOD PRACTICE when Django was designed NOT to serve static content for you.
If you're going to use this in development, I suggest you use the method of limiting it to DEBUG=True. Telling Django to serve static content from a temporary location while in development when the DEBUG is set to True is a much better and safer practice. You're NOT going to put your site into production with DEBUG on, right? Well, at least you shouldn't.
Here is how I implemented it:
settings.py:
STATIC_DOC_ROOT = os.path.join(os.getcwd(), 'site_media')
urls.py:
from django.conf import settings
## debug stuff to serve static media
if settings.DEBUG:
urlpatterns += patterns('',
(r'^site_media/(?P<path>.*)$', 'django.views.static.serve',
{'document_root': settings.STATIC_DOC_ROOT}),
)
This way any project I'm working on has a site_media directory inside of it with all of the media necessary. In dev it is self-contained and I don't have to flip any bits in the settings except for DEBUG, which I would be doing anyways.

The Django docs recommend the following approach I've modified for my use case:
urlpatterns = [
# url patterns
]
from django.conf import settings
if settings.DEBUG:
from django.conf.urls.static import static
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
Note: the above assumes you've set your MEDIA_URL and MEDIA_ROOT correctly
... and here's the djangodocs linkslap.