How to make django serve static files in development? - python

For some reason my django project doesn't see my static files, giving me 404 error, like so:
"GET /static/js/main.js HTTP/1.1" 404 1757
I do everything in accordance with the official guide. Here is my project structrure:
PMpro:
-PMpro (main project)
-users (app)
-tasks (another app)
-static
--js
--css
--etc...
-templates
--template files...
-manage.py
My settings.py file:
STATIC_URL = '/static/'
STATICFILES_DIR = [
os.path.join(BASE_DIR, 'static'),
]
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
urls.py file:
urlpatterns = [
path('admin/', admin.site.urls),
path('home/', TemplateView.as_view(template_name='index.html'))
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
In my .html file I's collecting static files and linking to corresponding css/js file like so:
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'css/organicfoodicons.css' %}" />
I'm pretty sure I do everything in accordance with the official django guide, and yet my project doesn't see/serve my static files.
I have already went through a number of similar problems people were posting here, and I have everything im my code exactly as it was advised, but the problem is still there.
Folks, any suggestions?

Related

DJango not finding static files, despite STATIC_URL and STATIC_ROOT set

I have just started learning DJango and am trying to use css file for my html template. As per the documentation, I have added the STATIC_URL and STATIC_ROOT to my settings.py file as follows:
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
BASE_DIR is already set as follows:
BASE_DIR = Path(__file__).resolve().parent.parent
In the template, I am using the css file as follows
{% load static %}
<link rel="stylesheet" href="{% static 'style.css' %}">
and the style.css is present at location DJango_App/static, DJango_App being my project directory with the manage.py file. Still I am getting error
"GET /static/style.css HTTP/1.1" 404 1653
DEBUG is set to True
Directory structure is:
DJango_App
|->DJango_App
|->(settings.py, urls.py, views.py, etc)
|->templates
|->(html templates)
|->static
|->style.css
How do I resolve this?
Update:
Looking at your directory structure above, your static files are not under a Django app. In that case, you should also set STATICFILES_DIRS, see:
https://docs.djangoproject.com/en/3.1/howto/static-files/#configuring-static-files
https://docs.djangoproject.com/en/3.1/ref/settings/#std:setting-STATICFILES_DIRS
Original:
Looks like you did not add the static url handler to urlpatterns.
Serving static files during development require add to urls.py:
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
# ... the rest of your URLconf goes here ...
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

Django unable to find javascript static files, not rendering any styling

Feels like I'm missing something basic.
I'm just trying to make an django application of currently nothing but a login page using an html template that has its own css and js. But I'm having weird issues with the statements for linking my static files. No CSS styling is being rendered in my browser, and all of the javascript links get 404 file not found errors on my django server.
This is the <head> of auth-login.html.
{% load static %}
<!doctype html>
<html lang="en">
<head>
<title>Login template from online</title>
<!-- these aren't giving errors -->
<link rel="shortcut icon" href="{% static 'assets/images/favicon.ico' %}">
<link href="{% static 'assets/css/bootstrap.min.css' %}" id="bootstrap-style"/>
<link href="{% static 'assets/css/icons.min.css' %}" type="text/css" />
<link href="{% static 'assets/css/app.min.css' %}" id="app-style" type="text/css" />
<!-- these are giving errors for some reason -->
<script src="{% static 'assets/libs/jquery/jquery.min.js' %}"></script>
<script src="{% static 'assets/libs/bootstrap/js/bootstrap.bundle.min.js' %}"></script>
<script src="{% static 'assets/libs/metismenu/metisMenu.min.js' %}"></script>
<script src="{% static 'assets/libs/simplebar/simplebar.min.js' %}"></script>
<script src="{% static 'assets/libs/node-waves/waves.min.js' %}"></script>
<script src="{% static 'assets/js/app.js' %}"></script>
</head>
In settings.py, this is how I'm specifying the static files location:
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__))) # lpbs_demo/
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static')
]
The Django project is currently structured with a project app called lpbs_demo and an app called user_auth. The static/ folder is inside of the project app (lpbs_demo/ folder). The templates/ folder is at the project root directory, i.e. at the same level as manage.py
. lpbsnew/
+-- manage.py
+-- lpbs_env/ (venv)
+-- lpbs_demo/ (project app/package)
| +-- __init__.py
| +-- settings.py
| +-- static/
| +-- urls, asgi, wsgi ...
+-- user_auth/ (app)
| +-- migrations/
| +-- admin.py
| +-- views.py
| +-- models, tests, ...
+-- templates/
The project app urls.py in lpbs_demo/ looks like...
from django.contrib import admin
from django.urls import path
from django.contrib import admin
from django.urls import path, include
from user_auth import views
urlpatterns = [
path('admin/', admin.site.urls),
path('', views.userLogin, name='loginHome'),
path('login', views.userLogin, name='login'),
path('logout', views.userLogout, name='logout'),
path('registration', views.userRegistration, name='registration'),
path('dashboard', views.dashboard, name='dashboard'),
]
So with this, I'm not sure why only the Javascript files are generating errors and not being found, while the css files aren't generating errors but they're not rendering on the web page at all and I just see text in Times New Roman unstylized. It feels like there's something basic about linking static content that I must be missing.
I've called python manage.py collectstatic already as well.
edit: forgot to include templates/ folder location in the original post.
Edit 2: I got two suggestions on using STATIC_ROOT in settings.py but neither of them are changing the visuals I'm getting.
STATIC_URL = '/static/'
# STATIC_ROOT = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, "staticFiles")
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static')
]
Several messages about potentially overwriting files come out.
Edit 3: It appears that the js files weren't getting copied via the python manage.py collectstatic command for some reason and I wasn't really sure why. But I made a new django project and was able to get that to work.
I'm no longer getting file not found errors, but I'm still not able to get any styling to render for some reason, so I made a new question.
Django not serving static files and not stylizing anything
Move the static directory to the same level as the manage.py file.
BASE_DIR means the outermost folder of your project. So, this— os.path.join(BASE_DIR, 'static')—would return a path like lpbsnew/static/. Django is trying to find a folder called static inside lpbsnew but it isn't there.
I try to sort it out step by step (I personally had a hart time to sort out all the aspects of paths, urls, reverses and dev/deployment in a django app):
BASE_DIR should (by convention) point to the base folder which is lbpsnew in your case.
your assigment is doing that, but the comment is wrong! It does not point to lpbs_demo but to lbpsnew!
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__))) # lpbs_demo/
Btw, in most of the django projects lpbs_demo would be called lpbsnew (lbpsnew_project/lbpsnew/lbpsnew/settings.py)
STATIC_ROOT is the (absolute) target path where "collectstatic" will copy all your static files to.
Please check after running "collectstatic" if files are there.
it is a difference if you run your app with "runserver" or Apache etc. Why?
3a) because in Apache you could have Alias defined (which might be the problem) or a missing access right to the static folder.
3b) it makes a difference if you have DEBUG = True/False in your settings.py
... so please provide more details.
For Debugging:
you can use the print(str(BASE_DIR)) to check directly in the seetings.py file.
you can display the page source code in the browser and check what {% ulr ... %} has done in your html file
missing css (files, individual items) never lead to error messages to my experience. Style is then just missing. Carefull to empty Browser cache if you change css file content!

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.

Why isn't favicon shown up in production?

Favicon isn't shown up in the tab though Django's response code is 200. Static files are located in 'myproject/build' (and 'settings.py' in 'myproject/server', and app in 'myproject/blog'). Though HTML page with css and js files is served well. And 'favicon.ico' is located in the same directory as 'index.html' page
I tried to open a page by "localhost:8000' address in different browsers and I got the same thing: favicon isn't shown up in the tab. I also looked at "Sources" in developers options: there aren't any 'favicon.ico' file
settings.py :
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'build/static')
]
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')
STATICFILES_STORAGE = 'whitenoise.storage.CompressedManifestStaticFilesStorage'
urls.py (in 'server/'):
urlpatterns = [
path('admin/', admin.site.urls),
path('api/', include('blog.api.urls')),
re_path('.*', TemplateView.as_view(template_name='index.html'))
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
index.html (in 'build/') :
<link rel="shortcut icon" href="/favicon.ico" />
Console:
[10/Jun/2019 09:57:29] "GET /favicon.ico HTTP/1.1" 200 2242
UPD: I ran command python manage.py collectstatic but I still get the same issue with favicon
your favicon located in static folder:
<link rel="shortcut icon" href="{% static 'favicon.ico' %}" />

Django static files (css) not working

I can't seem to include my bootstrap css files for some reason. I am quite new to Python and Django especially, so I am definitely doing something wrong.
Django 1.9.2
After reading the official Django explanation on the "Static files" management I am absolutely zero smarter :(. Here is my project folders hierarchy:
/projectname/
/appname/
/static/
| /appname/
| /css/
| | bootstrap.min.css
| | custom.css
| /img/
| /js/
|
/templates/
/includes/
head.html
footer.html
index.html
base.html
I started with the basics so I disregarded the head.htmland tried with the base.html like so:
<title>{% block title %}{% endblock %}</title>
<!-- Bootstrap core CSS -->
{% load staticfiles %}
<link href="{% static 'static/appname/css/bootstrap.min.css' %}" rel="stylesheet">
No luck. Here is my settings file:
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
]
...
STATIC_URL = '/static/'
MEDIA_URL = '/media/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
STATICFILE_DIRS ='/users/edchigliak/documents/projects/projectname/appname/static/'
As fas as I understand, it is possible to have a "global" 'static files location' which all your projects can use, and "per app" 'static files location' which can be uses only by the app inside which base directory they reside.
Any help appreciated!
EDIT:
This is my urls.py configuration:
from django.conf.urls import url
from django.contrib import admin
from budgeteer.views import hello, hours_ahead, current_datetime
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^hello/$', hello),
url(r'^index/$', current_datetime),
url(r'^time/plus/(\d{1,2})/$', hours_ahead),
]
I have similar problem (Django 1.10). Hierarchy:
myapp
...
myapp
...
blog
migrations
templates
...
static
blog
style.css
So if I add <link href="{% static 'blog/css/bootstrap.min.css' %}" rel="stylesheet"> (style.css located in dir 'blog/css') all styles won't work.
BUT when I delete 'css': <link href="{% static 'blog/bootstrap.min.css' %}" rel="stylesheet"> (style.css located in dir 'blog') it's ok.
May be it help you!
I think you need to add following to your URLs:
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
# ... the rest of your URLconf goes here ...
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
unless you work on Django server and it serves your static files.
According you the Django docs your app structure is OK.
When you will setup your prod and start serve static by Apache/Nginx/etc, than you will need to run collectstatic.
For now it don't needed.
My quick guess is that you are one level up. You have your static directory nested under appname. Try moving it up a level and accessing the resource directly in the browser (http://example.com/static/appname/css/bootstrap.min.css)
I've never done app specific resources, so if that is the goal, my apologies.
what if your static link starts with just appname?
i.e., instead of
<link href="{% static 'static/appname/css/bootstrap.min.css' %}" rel="stylesheet">
please try
<link href="{% static 'appname/css/bootstrap.min.css' %}" rel="stylesheet">
AFAIK, the string in {% static %} is the path to a static file inside the static folder.
I don't have points enough to comment, so I leave my guess here.
STATIC_ROOT = os.path.join(BASE_DIR, 'static_files')
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static'),
)
You need to put this line on the outside of HTML tags.
{% load static %}
I found the answer here: https://tutorial.djangogirls.org/en/css/.

Categories