I made this post on stackoverflow about the same issue, going to copy the text. I think I could really use someone who’s more experienced with django to give me a quick lead on what I’m missing here. python - Django not serving static files and not stylizing anything - Stack Overflow
I downloaded a template in the form of a zip file on my machine. It has a file for a homepage, auth-login.html
. If I load auth-login.html within the zip file then it loads correctly, I see styling and I don’t get any console errors.
But it seems like I can’t get this template to load its css and styling in my Django project via python manage.py runserver
with DEBUG=true
. I’m trying to just get this on a development server and I haven’t really been able to get past step 1. When I try to go to my application’s home page, I see unstylized times new roman text in my browser. No styling loads on the page at all. I’m not getting server/console errors either. I made an html file within my templates folder, index.html, that just has the contents of auth-login.html pasted into it (and I edited every or tag to use the {% static %} path. I set this as my home page. It just leads to an unstylized html page in Times New Roman.
My Django project is of the following structure
lpbsproject/
project_root/
staticFiles/ (STATIC_ROOT, where collectstatic copies to)
project_app/
settings.py
urls.py
wsgi.py, asgi.py, __init__.py...
static/ (STATIC_URL, original location of static files)
assets/ (this folder is copied/pasted from the template .zip)
css/, js/, ...
user_auth/
migrations
views.py
admin.py, models.py, apps.py, test.py ...
templates/
manage.py
Here’s the <head>
of my html file with all the <link>
and <script>
statements. These currently aren’t generating errors.
{% load static %}
<!doctype html>
<html lang="en">
<head>
<title>Login template from online</title>
<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" />
<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 BASEDIR and the static file location are specified
BASE_DIR = Path(__file__).resolve().parent.parent # points to project_root/ directory
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static')
]
STATIC_ROOT = os.path.join(BASE_DIR, 'staticFiles')
There’s ~1200 files in project_root/static/assets/
and I am seeing these get copied into project_root/staticFiles
from python manage.py collectstatic
. Last night I was dealing with some weridness where none of the js files were getting copied via the collectstatic command.
and urls.py for curiosity sake…
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 if python manage.py collectstatic
is working… why am I still not able to see any styling at all? I’m not really sure what’s going wrong here. It’s felt way too difficult to just get a simple /static/ folder working for this project.