Django Static Files - CSS not working [duplicate] - python

This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
Django and Serving Static Files
I am with one problem to load CSS at base.html. I put all css files at the directory /static.
At urls.py I put this code:
if settings.DEBUG:
urlpatterns += patterns('',
(r'^static/(?P<path>.*)$', 'django.views.static.serve',
{ 'document_root': '/home/bkcherry/botstore/botstore/static' }),
)
And at base.html i put the following:
<link rel="Stylesheet" type="text/css" href="/static/css.css" />
When I go to the main.html, the css style is not working. I need to configure the settings.py MEDIA_ROOT, MEDIA_URL or STATIC_ROOT?

you must not use MEDIA_ROOT or MEDIA_URL this is for uploaded media not your static content, and you do not need to setup URL patterns as that is only for django 1.2 or " if you are using some other server for local development": https://docs.djangoproject.com/en/dev/howto/static-files/#serving-static-files-in-development
you need to have your static files in:
botstore/botstore/static/botstore/css.css
then use:
HOME_ROOT = os.path.dirname(__file__)
# 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 = os.path.join(HOME_ROOT, 'staticfiles')
# URL prefix for static files.
# Example: "http://media.lawrence.com/static/"
STATIC_URL = '/static/'
# URL prefix for admin static files -- CSS, JavaScript and images.
# Make sure to use a trailing slash.
# Examples: "http://foo.com/static/admin/", "/static/admin/".
ADMIN_MEDIA_PREFIX = '/static/admin/'
# List of finder classes that know how to find static files in
# various locations.
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
)
then in your HTML you can refer to your static files thus:
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}botstore/css.css" />

I think you need a slash at the end of your path, ie '/home/bkcherry/botstore/botstore/static/'

If you check official documentation
from django.conf import settings
# ... the rest of your URLconf goes here ...
if settings.DEBUG:
urlpatterns += patterns('',
url(r'^media/(?P<path>.*)$', 'django.views.static.serve', {
'document_root': settings.MEDIA_ROOT,
}),
)
MEDIA_ROOT should have / on the end (https://docs.djangoproject.com/en/dev/ref/settings/#std:setting-MEDIA_ROOT)

Related

css and other static files not working in django

The current project I've started working on, uses django 2.2 and most of the links are hardcoded.
All static content is in folder named media and used in base.html as follows
in base.html
{% load staticfiles %} ---- using this as first line of base.html
.......
.......
<head>
<link href="/media/css/backoffice/font-awesome.min.css" rel="stylesheet" type="text/css">
</head>
in settings.py
STATIC_URL = '/media/'
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'media'),
)
STATIC_ROOT = os.path.join(BASE_DIR, 'media/')
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
# 'django.contrib.staticfiles.finders.DefaultStorageFinder',
)
I've also added following to the main urls.py file:
from django.conf.urls.static import static
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
Yet I'm not able to render the static file listed in the head section of base.html
I've also experimented with commenting out static root and staticfiles_dir but it does not work
You need to put all files in project root's static folder and run this command:
python manage.py collectstatic
For loading static files in the template you need to write this:
{% load static %}
And in all the static files like css, js and images you can do like this:
{% static "<absolute path of file>" %}
And you can refer from documentation.
I hope this will help you!

static files not found error in django

I know that this problem has already been asked several times here. I have searched and read a number of answers but no help. I guess, I am missing something very basic.
In my settings.py, I have:
STATIC_URL = '/static/'
STATIC_ROOT = join(APPS_DIR, "static/")
# STATICFILES_DIRS = [join(APPS_DIR, 'static')]
MEDIA_ROOT = join(APPS_DIR, 'media')
MEDIA_URL = "/media/"
In my config/urls.py, I have:
if settings.DEBUG:
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
I have a file located at /static/core/js/jquery_countdown/jquery.countdown.min.js which I am trying to load in template as below:
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="{% static 'core/js/jquery_countdown/jquery.countdown.min.js' %}"> </script>
The top of the same template looks like
{% extends "contest/base.html" %}
{% load static %}
This results in following server error:
[23/Mar/2018 10:12:08] "GET /static/core/js/jquery_countdown/jquery.countdown.min.js HTTP/1.1" 404 1858
What am I missing?
Create folder static_files in your app directory. And place all your static files inside it. Then use the following settings
STATIC_URL = '/static/'
STATIC_ROOT = join(APPS_DIR, "static/")
STATICFILES_DIRS = [join(APPS_DIR, 'static_files')]
If it does not solve your issue, then run the command python manage.py collectstatic. It will copy all the static files (Not only from your app but also from django admin, third party apps etc) to the STATIC_ROOT folder.
Details
For local serving, django server will look in to the STATICFILES_DIRS. So you dont need to run the python manage.py collectstatic command. All the external apps may have STATICFILES_DIRS where they place their static files. For production server you need to collect all these static files scattered around all your apps in to a single place. Thats what python manage.py collectstatic command will do. It will copy all the static files in to STATIC_ROOT directory
You are searching for static files in app directories only but have your file in global static files. You should use the commented STATICFILES_DIRS setting to specify all places to search for static files.
I found that this worked for me. (Development)
(I chose to name it "zStatic" to keep it at the bottom of the root (project folder), so that it isnt amidst all my apps. Easier to locate.)
Settings.py
STATIC_URL = 'zStatic/'
STATICFILES_DIRS = (
BASE_DIR/'zStatic',
)
INSTALLED_APPS =
[
...
'django.contrib.staticfiles',
...
]
base.html (base template)
<head>
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'css/mycss.css' %}">
</head>

static dir not found django

I'm a beginner in using django and tryin to make my first app, but I keep on getting "Not found" every time I add a javascript file on my view
This is my setting.py
STATIC_URL = '/home/me/PycharmProjects/GLife/static/'
MEDIA_ROOT = os.path.join(PROJECT_DIR, 'media')
MEDIA_URL = '/media/'
STATIC_ROOT = 'static/'
STATICFILES_DIRS = (
os.path.join(PROJECT_DIR, 'static'),
)
urls.py
urlpatterns = [
url(r'^admin/', include(admin.site.urls)),
url(r'^register', include('register.urls')),
url(r'^media/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT, 'show_indexes': True}),
]+ static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
urlpatterns += staticfiles_urlpatterns()
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--<script src="/static/djangular/js/django-angular.min.js" type="text/javascript"></script>-->
<script src="{% static '/js/_register/register.js' %}" type="text/javascript"></script>
<title></title>
</head>
<body>
I've already search about it but the suggestions failed, hope anyone could help
here's my project structure
myproject
--main
--register
---migrations
---templates
--static
---js
----_register
I'm just trying to make an alert display as a testing using js
This is happening because you switched the values of STATIC_ROOT and STATIC_URL. It must be like this:
STATIC_URL = '/static/'
STATIC_ROOT = '/home/me/PycharmProjects/GLife/static/'
STATIC_URL is the URL to use when referring to static files located in STATIC_ROOT.
STATIC_ROOT is the absolute path to the directory where collectstatic will collect static files for deployment.
Also, your static and STATIC_ROOT paths must be different.
When using the development server you don't need to configure STATIC_ROOT or use collectstatic management command because it will automatically serve the static files from static folder if DEBUG is true.

Having trouble displaying static files

I cannot figure out what if any url thing I am supposed to add to my urls.py file to be able to display static files. I have tried adding the following as I have seen that it worked for others on stack overflow
url(r'^static/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.STATIC_ROOT, 'show_indexes': True }),
url(r'', include('django.contrib.staticfiles.urls')),
static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
none of which seem to work.
I seem to work.
You don't need to include static in the urls.py file. In your settings.py you have to specify directory with static files and url:
# 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: "/var/www/example.com/static/"
STATIC_ROOT = ''
# URL prefix for static files.
# Example: "http://example.com/static/", "http://static.example.com/"
STATIC_URL = '/static/'
Try Running,
python manage.py collectstatic
and try again you don't need to add anything in urls add
STATIC_URL = '/static/'
in setting.py
create a folder named static in your app directory
place your static files inside that directory
use for eg <img src="{% static '<path from static directory>' %}" />
don't forget to include {% load staticfiles %} at the top of your template

Django -- Can't get static CSS files to load

I'm running Django's development server (runserver) on my local machine (Mac OS X) and cannot get the CSS files to load.
Here are the relevant entries in settings.py:
STATIC_ROOT = '/Users/username/Projects/mysite/static/'
STATIC_URL = '/static/'
STATICFILES_DIRS = (
'/Users/thaymore/Projects/mysite/cal/static',
)
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
#'django.contrib.staticfiles.finders.DefaultStorageFinder',
)
INSTALLED_APPS = (
# other apps ...
'django.contrib.staticfiles',
)
In my views.py I'm requesting the context:
return render_to_response("cal/main.html",dict(entries=entries),context_instance=RequestContext(request))
And in my template the {{ STATIC_URL }} renders correctly:
<link type="text/css" href="{{ STATIC_URL }}css/main.css" />
Turns into:
<link type="text/css" href="/static/css/main.css"/>
Which is where the file is actually located. I also ran collectstatic to make sure all the files were collected.
I also have the following lines in my urls.py:
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns += staticfiles_urlpatterns()
I'm new to Django so am probably missing something simple -- would appreciate any help.
Read this carefully:
https://docs.djangoproject.com/en/dev/ref/contrib/staticfiles/
Is django.contrib.staticfiles in your INSTALLED_APPS in settings.py?
Is DEBUG=False? If so, you need to call runserver with the --insecure parameter:
python manage.py runserver --insecure
collectstatic has no bearing on serving files via the development server. It is for collecting the static files in one location STATIC_ROOT for your web server to find them. In fact, running collectstatic with your STATIC_ROOT set to a path in STATICFILES_DIRS is a bad idea. You should double-check to make sure your CSS files even exist now.
For recent releases of Django, You have to configure static files in settings.py as,
STATIC_URL = '/static/' # the path in url
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "static"),
]
and use it with static template tag,
{% load static %}
<link rel="stylesheet" href="{% static 'css/bootstrap.css' %}">
Another simple thing to try is to stop, and then restart the server e.g.
$ python manage.py runserver
I looked into the other answers, but restarting the server worked for me.
Are these missing from your settings.py? I am pasting one of my project's settings:
TEMPLATE_CONTEXT_PROCESSORS = ("django.contrib.auth.context_processors.auth",
"django.core.context_processors.debug",
"django.core.context_processors.i18n",
"django.core.context_processors.media",
"django.core.context_processors.static",
"django.contrib.messages.context_processors.messages")
Also, this is what I have in my urls.py:
urlpatterns += patterns('', (
r'^static/(?P<path>.*)$',
'django.views.static.serve',
{'document_root': 'static'}
))
added
PROJECT_ROOT = os.path.normpath(os.path.dirname(__file__))
STATICFILES_DIRS = ( os.path.join(PROJECT_ROOT, "static"), )
and removed STATIC_ROOT from settings.py, It worked for me
Add the following code to your settings.py:
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "static"),
]
After that, create the static folder at the root directory of your project.
To load the static files on templates use:
{% load static %}
<img src="{% static "images/index.jpeg" %}" alt="My image"/>
DEBUG = True in my local settings did it for me.
These steps work for me, just see Load Static Files (CSS, JS, & Images) in Django
I use Django 1.10.
create a folder static on the same level of settings.py, my settings.py's path is ~/djcode/mysite/mysite/settings.py, so this dir is ~/djcode/mysite/mysite/static/;
create two folders static_dirs and static_root in static, that's ~/djcode/mysite/mysite/static/static_dirs/ and ~/djcode/mysite/mysite/static/static_root/;
write settings.py like this:
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.10/howto/static-files/
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'mysite', 'static', 'static_root')
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'mysite', 'static', 'static_dirs'),
)
do this command $ python manage.py collectstatic in shell;
create a folder css in static_dirs and put into your own .css file, your css file' path is ~/djcode/mysite/mysite/static/static_dirs/css/my_style.css;
change <link> tag in .html file: <link rel="stylesheet" type="text/css" href="{% static 'css/my_style.css' %}">,
Finally this link's path is http://192.168.1.100:8023/static/css/my_style.css
Bingo!
You had same path in STATICFILES_DIRS AND STATIC_ROOT, I ran into the same issue and below was the exception -
ImproperlyConfigured: The STATICFILES_DIRS setting should not contain the STATIC_ROOT setting
For local you don't need STATICFILES_DIRS, as anyway you don't need to run collectstatic. Once you comment it, it should work fine.
Have you added into your templates:
{% load staticfiles %}
This loads what's needed, but for some reason I have experienced that sometimes work without this... ???
I had to use
STATICFILES_DIRS = ( '/home/USERNAME/webapps/django/PROJECT/static/', )
That helped me.
See if your main application (where the static directory is located) is included in your INSTALLED_APPS.
Files are searched by using the enabled finders. The default is to look in all locations defined in STATICFILES_DIRS and in the 'static' directory of apps specified by the INSTALLED_APPS setting.
I tried this model and it worked.
Changes in settings as per the django project created with shell
"django-admin.py startproject xxx"# here xxx is my app name
modify the folder as below structure loading our static files to run on server
Structure of xxx is:
> .
> |-- manage.py
> |-- templates
> | `-- home.html
> `-- test_project
> |-- __init__.py
> |-- settings.py
> |-- static
> | |-- images
> | | `-- 01.jpg
> | |-- style.css
> |-- urls.py
> `-- wsgi.py
- modifications in Settings.py
import os
INSTALLED_APPS = ( 'xxx',# my app is to be load into it)
STATIC_ROOT = ''
STATIC_URL = '/static/'
PROJECT_DIR = os.path.dirname(__file__)
TEMPLATE_DIRS = ( os.path.join(PROJECT_DIR, '../templates'),)#include this
- modifications in urls.py
from django.conf.urls import patterns, include, url
from django.views.generic import TemplateView
class DirectTemplateView(TemplateView):
extra_context = None
def get_context_data(self, **kwargs):
context = super(self.__class__, self).get_context_data(**kwargs)
if self.extra_context is not None:
for key, value in self.extra_context.items():
if callable(value):
context[key] = value()
else:
context[key] = value
return context
urlpatterns = patterns('',
url(r'^$', DirectTemplateView.as_view(template_name="home.html")), )
- home.html
<html>
<head>
<link href="{{STATIC_URL}}style.css" rel="stylesheet" type="text/css">
</head>
<body>
<h1>This is home for some_app</h1>
<img src="{{STATIC_URL}}/images/01.jpg" width=150px;height=150px; alt="Smiley ">
</body>
</html>
Add this "django.core.context_processors.static", context processor in your settings.py
TEMPLATE_CONTEXT_PROCESSORS = (
"django.core.context_processors.static",
)
You can just set STATIC_ROOT depending on whether you are running on your localhost or on your server. To identify that, refer to this post.
And you can rewrite you STATIC_ROOT configuration as:
import sys
if 'runserver' in sys.argv:
STATIC_ROOT = ''
else:
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATIC_URL = '/static/'
If you set DEBUG=FALSE
you need to do follow steps
In your urls.py file:
add this line
from django.views.static import serve
url(r'^media/(?P<path>.*)$', serve,{'document_root': settings.MEDIA_ROOT}),
url(r'^static/(?P<path>.*)$', serve,{'document_root': settings.STATIC_ROOT}),
I have the same issue (ununtu 16.04 server).
This helped me
python manage.py collectstatic --noinput
add following in settings.py
STATIC_URL = '/static/'
MEDIA_URL = '/media/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
Two most Basis points to be noted for running Static files in Django Application are - Declare static file path in your settings.py file
STATIC_URL = '/static/'
Another important parameter is the web page in which you are using static keyword, you need to load the static files.
{% load static %}
Go to your HTML page load static by
{% load static %}
Now only mistake I've made was this
My code:
<img src="**{% static** "images/index.jpeg" %}" alt="My image">
Updated:
<img src=**"{% static 'images/index.jpeg' %}' alt="My image"**>
You get it right
I had same issue check your settings.py and make sure STATIC_URL = '/static/'
in my case first / at the beginning was missing and that was causing all static files not to work

Categories

Resources