1

Since I finished the backend of my Django website I started adding some style. My html files are displayed but it seems no css has been linked to them however the path is correct when I show the source code in Firefox.

mywebsite/
----blog/
----mywebsite/
----static/
--------css/
------------struct.css
----templates/
--------layouts/
--------errors/
------------404.html
--------html/
------------struct.html

Django version: 2.1.7

settings.py:

DEBUG = False
ALLOWED_HOSTS = ['*']

INSTALLED_APPS = [
    # other apps...
    'django.contrib.staticfiles',
]

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

urls.py:

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

urlpatterns = [
    # ...
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

struct.html:

{% load static %}

<!DOCTYPE html>
<html lang="en" dir="ltr">

  <head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width; initial-scale=1.0;">

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

    <title>test</title>

  </head>

  <body>

    <p>test</p>


  </body>

</html>

struct.css:

p{
    color:red:
}
body{
    background-color:black:
}
qux
  • 55
  • 2
  • 7
  • Can you print the whole path in `settings.py`? `print(os.path.join(BASE_DIR, "static"))` – Higor Rossato Apr 16 '19 at 14:26
  • /home/user/RedPillers/red_pillers/static – qux Apr 16 '19 at 16:08
  • where red_pillers is my project – qux Apr 16 '19 at 16:08
  • It sounds silly but have you tried to set DEBUG=True (locally) of course. Since you haven’t set the STATIC_ROOT and you’re not running collectstatic that might be it. And if it’s then you’ll need to follow the docs. – Higor Rossato Apr 16 '19 at 16:43
  • Just saw your comment on the answer below. When you're developing (DEBUG=True) what you've done works. However, when you turn DEBUG=False you need to set the STATIC_ROOT as the docs says https://docs.djangoproject.com/en/2.2/howto/static-files/#deployment – Higor Rossato Apr 16 '19 at 16:51
  • Can it be a matter of the .css not being updated due to using the file stored in cache? https://stackoverflow.com/questions/52682812/django-css-not-updating/52683195 – Jakob Jul 09 '21 at 06:55

3 Answers3

2

Generally static files path should be like this appname/static/appname/yourfiles there is no need to change url patterns.

Assuming your appname is Myapp , the proper path for your css file is

Myapp/static/Myapp/css/struct.css

For including static files , add below line in settings.py

STATIC_URL = '/static/'

and in your html template

<!doctype html>
{% load static %}
<link rel="stylesheet" href="{% static 'Myapp/css/struct.css' %}">

If you are having your static files within the app then there is no need to use

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "static"),
]

You can refer Managing Static Files in django documentation .

Joel Deleep
  • 1,308
  • 2
  • 14
  • 36
  • still does not work. By the way the terminal output shows this: [16/Apr/2019 16:12:25] "GET /static/css/struct.css HTTP/1.1" 500 27 – qux Apr 16 '19 at 16:13
  • edit: if I turn debug to True, everything works but nothing when it is set to False. why? – qux Apr 16 '19 at 16:24
  • Did you check the source code when your template is rendered , then click the respective link for css in the source code , check whether the file open ... from your comment you are still providing the link in a wrong way , path should be static/appname/css/ , since you are getting an error for getting /static/css/struc.css you have done it wrong . Read the steps i mentioned once again and go through the documentation , . check this link for turning off debug https://docs.djangoproject.com/en/2.2/howto/deployment/checklist/ – Joel Deleep Apr 16 '19 at 17:05
  • create folder named static inyou app folder , then create another folder with name same as your app , inside that folder put your static files , the steps i mentioned will work – Joel Deleep Apr 16 '19 at 17:08
  • 1
    @qux if you have set debug=false you have to follow https://docs.djangoproject.com/en/2.2/howto/deployment/checklist/ – Joel Deleep May 11 '19 at 02:19
0

define static root in settings.py

STATIC_ROOT = BASE_DIR + '/static/'

hope it helps

refer this

rahul.m
  • 5,572
  • 3
  • 23
  • 50
  • does not help : – qux Apr 16 '19 at 16:13
  • ERRORS: ?: (staticfiles.E002) The STATICFILES_DIRS setting should not contain the STATIC_ROOT setting. – qux Apr 16 '19 at 16:14
  • Correct. STATICFILES_DIRS is the list of **source** folders for fulfilling STATIC_ROOT folder (which is **destination** here) by running `collectstatic`. Just remove STATICFILES_DIRS. @qux but still don't concatenate strings like grey shown - do it by `os.path.join`. – Ivan Starostin Apr 16 '19 at 17:37
0

if you are running this application on localhost then you may try to set DEBUG = True if you mistakenly set it to False, Because it was fixed for me that way.