After reading more about common Django project structure, I renamed my 'media' folder to 'static' since it contains the CSS, javascript, and images for my web app and no user uploaded files. However, my project isn't finding the new directory, and the favicon is still being served and can be downloaded from the old directory at localhost:8000/media/images/favicon.png!
In my template, I am linking directly to css/js files like so:
<link href="/static/css/map.css" type="text/css" rel="stylesheet" />
There's also nothing interesting going on in urls.py:
urlpatterns = patterns('',
url(r'^$', 'EventMapperApp.views.map', name='map'),
# AJAX
url(r'^all_events/', 'EventMapperApp.views.all_events'),
url(r'^user_created_events/', 'EventMapperApp.views.user_created_events'),
url(r'^all_user_events/', 'EventMapperApp.views.all_user_events'),
# event actions
url(r'^save_event/', 'EventMapperApp.views.save_event'),
url(r'^unsave_event/', 'EventMapperApp.views.unsave_event'),
)
Any ideas?
EDIT
For some reason, I thought that urls.py didn't have to resolve all URLs for my Django app? Not really sure what I was thinking... Anyway, I've made what I thought were the appropriate changes to my code as per the documentation, but I'm still having some trouble getting it working.
settings.py
PROJECT_PATH = os.path.dirname(os.path.abspath(__file__))
# Absolute filesystem path to the directory that will hold user-uploaded files.
# Example: "/var/www/example.com/media/"
MEDIA_ROOT = (os.path.join(PROJECT_PATH, "media"))
# URL that handles the media served from MEDIA_ROOT. Make sure to use a
# trailing slash.
# Examples: "http://example.com/media/", "http://media.example.com/"
MEDIA_URL = '/media/'
# 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 = (os.path.join(PROJECT_PATH, "static"))
# URL prefix for static files.
# Example: "http://example.com/static/", "http://static.example.com/"
STATIC_URL = '/static/'
urls.py
urlpatterns = patterns('',
# Examples:
url(r'^$', 'EventMapperApp.views.map', name='map'),
# Required to make static serving work
(r'^static/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.STATIC_ROOT}),
# AJAX
url(r'^all_events/', 'EventMapperApp.views.all_events'),
url(r'^user_created_events/', 'EventMapperApp.views.user_created_events'),
url(r'^all_user_events/', 'EventMapperApp.views.all_user_events'),
# event actions
url(r'^save_event/', 'EventMapperApp.views.save_event'),
url(r'^unsave_event/', 'EventMapperApp.views.unsave_event'),
)
template
<link rel="icon"
type="image/png"
href="{{ STATIC_URL }}images/WWWfavicon.png" />
<link href="{{ STATIC_URL }}css/map.css" type="text/css" rel="stylesheet" />
<link href="{{ STATIC_URL }}css/ui-lightness/jquery-ui-1.8.21.custom.css" type="text/css" rel="stylesheet" />
<link href="{{ STATIC_URL }}css/timepicker.css" type="text/css" rel="stylesheet" />
I'm not sure what I'm doing wrong now... STATIC_ROOT seems to be resolving properly when I walk through the code (the 'static' folder is in the same directory as settings.py).
EDIT 2
As per https://docs.djangoproject.com/en/dev/howto/static-files/#serving-static-files-in-development, I changed urls.py to the following:
from django.conf.urls import patterns, url
from django.conf import settings
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns = patterns('',
# Examples:
url(r'^$', 'EventMapperApp.views.map', name='map'),
# AJAX
url(r'^all_events/', 'EventMapperApp.views.all_events'),
url(r'^user_created_events/', 'EventMapperApp.views.user_created_events'),
url(r'^all_user_events/', 'EventMapperApp.views.all_user_events'),
# event actions
url(r'^save_event/', 'EventMapperApp.views.save_event'),
url(r'^unsave_event/', 'EventMapperApp.views.unsave_event'),
)
# only in development
urlpatterns += staticfiles_urlpatterns()
Still no luck.
See here:
Static files in templates &
Serving static files in development
Related
So, as I said I have a base.html file located at main_project/templates/base.html, but where do I put the base.css file? Do I create a main_project/static directory or should I just put in main_project/templates?
This seems like it should have a simple answer but I have only seen questions asking where to store base.html, and am unsure where to store base.css Thanks in advance for any responses.
All static resources go in static folder examples are, CSS,js,logo images,
STATIC_URL = '/static/'
STATIC_ROOT = ''
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static'),
)
You need to add above code to settings.py to configure static directory. Then you can create a folder called 'static' where your manage.py files are.
After that in urls.py you have this
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
# ... the rest of your URLconf goes here ...
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
And then you can use those files in the template using
<img src="{% static "my_app/example.jpg" %}" alt="My image">
Note:- if have dynamic files that change for each page, example blog post images, they are stored in media folder. To know more you can read
Read Full documentation here
https://docs.djangoproject.com/en/3.0/howto/static-files/
I am pretty new to Django and I do not know how to link CSS and or javascript to my project.
Don't want to have a project with no CSS. Thank you for any help, sorry if this is a very dumb question. Have a nice day!
you problem is that you need to link static files from your html template.
this is fairly easy in django, just create a folder called staticfiles in the root directory and create a folder called css inside of it. Put your styles in there.
go to your settings.py and change
STATIC_URL = whatever
STATIC_ROOT = whatever
to
STATIC_URL = "/static/"
STATIC_ROOT = os.path.join(BASE_DIR, "static")
STATICFILES_DIR = [
os.path.join(BASE_DIR, "staticfiles")
]
you see, in django settings, you can't have the static root be the same as what folder you are using for static files in production.
for your urls.py in the folder inside the base directory named after your project
add this after urlpatterns
from django.conf import settings
from django.conf.urls.static import static
if settings.DEBUG:
urlpatterns += (static(settings.STATIC_URL, document_root= os.path.join(settings.BASE_DIR, "staticfiles")))
now in your base template
put
{% load static %}
before the html tag and
<link rel="stylesheet" type="text/css" href="{% static 'css/styles.css' %}">
in the head tag. I hope this has helped!
It's been a while since I've setup django to work locally. I'm using version 1.11. Getting it to serve the static files.
My project is called chatsys and I've created the static folder and css in this folder chatsys\static\css\style.css .
Here's the current settings in the settings file.
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
and in the urls
#for serving static files
from django.conf import settings
from django.conf.urls.static import static
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
and finally in the html
{% load static %}
...
<link rel="stylesheet" type="text/css" href="/static/css/style.css">
however in the runserver console I get 404 for /static/css/style.css
You should define STATICFILES_DIRS and include your project's static directory there.
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]
These are the directories that Django collects static files from.
You should then change STATIC_ROOT to be a different directory. It is the directory that collectstatic collects static files to. The static root should not be under version control.
As an aside, you are loading the static tag in your template but not using it. You could change it to:
{% load static %}
...
<link rel="stylesheet" type="text/css" href="{% static 'css/style.css' %}">
Move your static folder under the base dir
chatsys
migrations
templates
etc.
static
css
style.css
I know there are other questions similar to mine, but I've tried everything to get my static files working and need some help. When I open my page I get these errors:
GET /static/css/cerulean/css HTTP/1.1" 404 2983
GET /static/js/bootstrap.js HTTP/1.1 404 2980
This is my project directory (most files ommitted):
Motif_Django
Motif_Django
settings.py
urls.py
motif
static
css
cerulean.css
js
bootstrap.js
Here are the important settings in settings.py:
STATIC_URL = 'http://127.0.0.1:8000/static/'
STATIC_ROOT = '/home/kimberly/Motif-Scan-Plus/Motif_Django/static'
STATICFILES_DIRS = (
'/home/kimberly/Motif-Scan-Plus/Motif_Django/static',
'/home/kimberly/Motif-Scan-Plus/Motif_Django/motif/static/motif/',
)
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',)
Under INSTALLED_APPS I have included django.contrib.staticfiles. The STATIC_ROOT folder was initially empty and I collected static files with python manage.py collectstatic and I still get these errors. In my HTML form I am using {% load staticfiles %} and trying to load it with
<link rel="stylesheet" type="text/css" href="{% static 'css/cerulean.css' %} but nothing is working. I included the full URL in STATIC_URL to see if that would help, as well as adding the full path of my static folder in STATICFILES_DIRS but still nothing. Any help would be greatly appreciated!!
STATIC_URL is not supposed to be absolute URL, just the path (ie. /static/).
settings.DEBUG has to be True
You have to serve static() url patterns in urls.py
.
urlpatterns = [
# ... patterns,
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
Check related guide in Django docs:
https://docs.djangoproject.com/en/dev/howto/static-files/
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
How to organize and load CSS within Django project/app?
I have follow several websites about how to setup static files in Django. Here are my steps.
Configure the setting.py:
STATIC_ROOT = '/Users/kin/mysite/static'
STATIC_URL = '/static/'
Run the collectstatic command:
python manage.py collectstatic
After that, I saw my image file is copied to the STATIC_ROOT.
Then in my template, I try to use my image file by:
<img border="0" src="{{ STATIC_URL }}images.jpg" width="304" height="228">
But there is no image when I load it on the browser. I checked the page source and STATIC_URL seems empty.
Can anyone shed some light here?
Thanks
Dont hard code the path in your setting. I usually put my static files in my main project, so my setting file look like this
import os
MAIN_PROJECT = os.path.dirname(__file__)
then
# 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 = ''
# 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.
os.path.join(MAIN_PROJECT, 'static/'),
)
After that, you can use {{ STATIC_URL }} in your view
Actually I got it right by just using the following code:
{% load staticfiles %}
<img border="0" src="{% static 'image.jpg' %}" width="304" height="228">
This will render the STATIC_URL path to me.
Thanks all for helping me out!
If you're running your app with python manage.py runserver then you may need to add the following to the end of your url conf (see docs).
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns += staticfiles_urlpatterns()
The process for serving static files with django's dev server is different to the process for doing it with a production web server.
you can try with this
import settings in urls.py
and paste the below code in your urls.py
if settings.DEBUG:
urlpatterns += patterns('django.views.static',
(r'^static_media/(?P<path>.*)$',
'serve', {
'document_root': 'path/to/your/static/folder',
'show_indexes': True }),)
now go to your settings.py and change the setting like
MEDIA_URL = '/static_media/'
# 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 = ''
# URL prefix for static files.
# Example: "http://media.lawrence.com/static/"
STATIC_URL = '/static/'
now access your static file like
<link rel="stylesheet" type="text/css" href="{{MEDIA_URL}}css/header.css" />