Django doesn't load css file

Question

I tried to search many posts about this problem and any one those couldn't solve my problem sadly and I couldn't understand on some points.This is the post.

Django cannot find static files. Need a second pair of eyes, I'm going crazy

I guess this is the most similar case with me and someone gave very nice answer for it, but it couldn't solve my problem :/

This is my file set

- beerlog  
 - beerlog
     - settings.py
     - ...
 - posting
     - urls.py
     - templates
         - posting
             - base.html
             - index.html
             - post.html
             - posting.html
     - static
         - posting
             - style.css
         - ...
 - static
     - registration
         - ...

settings.py


STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

/posting/templates/posting/base.html


<!DOCTYPE html>
{% load static %}
<html class="no-js">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Beerlog</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="/posting/sytle.css">
        {% block extra_head %}{% endblock %}
    </head>
    <body>
        <h2 class='headline'>Welcome to beerlog!</h2>
        <ul class="sidenav">
            {% if user.is_authenticated %}
            <li>Welcome back {{ user.get_username }}!</li>
            <li><a href="{% url 'logout' %}?next={{request.path}}">Logout</a></li>
            {% else %}
            <li><a href="{% url 'login' %}?next={{request.path}}">Login</a></li>
            {% endif %}
        </ul>
        {% block content %}
        {% endblock %}

/posting/urls.py

from django.urls import path
from django.conf import settings
from django.conf.urls.static import static

from . import views


app_name = 'posting'
urlpatterns = [
    path('', views.index, name='index'),
    path('<int:post_id>', views.post, name='post'),
    path('posting', views.posting, name='postingform'),
    path('base', views.base, name='base')
]

/beerlog/urls.py


from django.contrib import admin
from django.urls import path, include
from django.contrib.staticfiles.urls import static, staticfiles_urlpatterns

from . import settings

urlpatterns = [
    path('posting/', include('posting.urls')),
    path('admin/', admin.site.urls),
]

urlpatterns += staticfiles_urlpatterns()
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

urlpatterns += [
    path('accounts/', include('django.contrib.auth.urls')),
]

I set static file same as django official documents like templates, templates work well but why css doeesn't work? Please help me guys :( Desperate

try to add this in your setings STATICFILES_DIRS = [ os.path.join(BASE_DIR, "static") ] — Nouh Belahcen, Mar 26 '20 at 01:30
bro did you imported css files through static function? `` ?? or just link?? use above comment for settings.py and `{% static 'path_to_css' %}` use this in place of `href="/posting/sytle.css"` and you css name is also wrong — Syed Khizaruddin, Mar 26 '20 at 02:12
@NoahLc I tried to do it, but they said I cannot contain STATIC_ROOT in STATICFILES_DIRS. — lcpnine, Mar 26 '20 at 04:20
@khizarsyed I just used linked. I coulndn't use STATICFILES_DIRS due to the reason I said, but after I use with {%%}, it succeed. It seems like we have no choice on link href. Great thanks! — lcpnine, Mar 26 '20 at 04:21
You have a typo in file name `sytle.css` instead of `style.css`. — Ivan Starostin, Mar 26 '20 at 06:03

score 0 · Answer 1 · answered Mar 26 '20 at 06:08

Add posting folder into STATICFILES_DIRS as an additional (to the STATIC_ROOT) folder for collecting static files from:

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'posting/static'),
]

In DEBUG=true it is enough to reach to those files. Before moving to DEBUG=false run collectstatic and files and folders from posting/static will be copied into STATIC_ROOT (you can try this right now).

Then refer your static files from template with static tag:

{% import static %}
<link rel="stylesheet" href="{% static '/posting/style.css' %}">

If still not working - grab the URL from rendered template and try to open it manually, then check response status.

Also make sure you've added url patterns mentioned here to make Django serve static files in DEBUG=true. Note, Django won't serve static files in DEBUG=false.

Django doesn't load css file

1 Answers1

Linked