'Django: CSS Is not not working
I am still new to django and I am having problem with my CSS working.
I have followed the direction from the link: Django Static Link tutorial, on handling static files. But it is still not working.
Settings
# Absolute path to the directory static files should be collected to.
# Don't put anything in this directory yourself; store your static files
# in apps' "static/" subdirectories and in STATICFILES_DIRS.
# Example: "/home/media/media.lawrence.com/static/"
STATIC_ROOT = '/Users/a9austin/Development/sites/AlphaSocks/src/static_root/'
# URL prefix for static files.
# Example: "http://media.lawrence.com/static/"
STATIC_URL = '/static/'
# Additional locations of static files
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.
'/Users/a9austin/Development/sites/AlphaSocks/src/staticfiles'
)
view
#from django.http import HttpResponse
from django.shortcuts import render_to_response
def index(request):
return render_to_response('index.html')
index.html
<link rel="stylesheet" href="{{STATIC_URL}}css/style.css" type="text/css" media="screen" >
And directory organization
src->staticfiles->css->style.css
Thank you so much, your help and time is much appreciated!
Solution 1:[1]
Try clearing your cache. If you are using Google chrome go to your settings>clear browsing data> select clear cached images and files then click clear data
Solution 2:[2]
After doing all, setting DEBUG= True, python collectstatic, clearing cache, opening in incognito mode if the problem still exists copy your .css file into another new .css file in static folder, and then run collectstatic command. This worked out for me. I hope this will help you.
Solution 3:[3]
If there is no problem in coding and no errors shown. Then you can do this this to try to solve the problem.
Clear your Cache:
If you are using Google chrome go to your settings --> clear browsing data --> select clear cached images and files then click clear data
Solution 4:[4]
Adding RequestContext to the response should load the STATIC_URL variable into the template.
Try changing:
from django.shortcuts import render_to_response
def index(request):
return render_to_response('index.html')to:
from django.shortcuts import render_to_response
from django.template.context import RequestContext
def index(request):
return render_to_response("index.html", context_instance=RequestContext(request)) Refer to the Django Documentation on Referring to static files in templates for more information.
Solution 5:[5]
For me it was changing
<link rel="stylesheet" href=" {% static '/css/style.css' %} ">
to
<link rel="stylesheet" type="text/css" href=" {% static '/css/style.css' %} ">
Solution 6:[6]
Sometimes all it takes is just "Ctrl + F5"
A Total refresh of the page, does the trick.
Or Ctrl + Shift + R
Solution 7:[7]
If this is happening to you in development mode, make sure you set DEBUG=True in your settings.py file. Also make sure that the MEDIA_URL and MEDIA_ROOT are set in your settings.py file like so :
MEDIA_URL = '/mymediafolder/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'mymediafolder')
And then in your main urls file myapp/urls.py you must have the following :
from django.conf.urls import url, include
from . import views
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from django.conf.urls.static import static
from django.conf import settings
urlpatterns = [
#Your url patterns here
]
urlpatterns += staticfiles_urlpatterns()
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
The staticfiles_urlpatterns() is used to serve static files in development mode.
Solution 8:[8]
I had to delete my staticfiles folder. It seemed like there was a similarly named file in it which was being read from or written to and this wasn't the one my app was pulling from for the site. After I ran 'collectstatic' again, it re-added the staticfiles folder and contents and is now working and updating properly.
Solution 9:[9]
My solution may be silly, but maybe it will help someone. If you copy the line from the internet instead of typing it, make sure to adjust your quotation marks. Worked for me.
<link rel=”stylesheet” type="text/css" href="{% static 'styles.css' %}">
<link rel="stylesheet" type="text/css" href="{% static 'styles.css' %}">
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow