0

I am new to Django and really confused about this.

Here are relevant parts in settings.py:

import os
PROJECT_ROOT = os.path.abspath(os.path.dirname(__file__))

STATIC_URL = 'http://http://127.0.0.1:8000/static/'

STATICFILES_DIRS = (
    PROJECT_ROOT+'/static/')

TEMPLATE_DIRS = (
    PROJECT_ROOT + '/templates/')

My project file structure is like this:

MyProj
    manage.py
    MyProj
      settings.py
      urls.py  
      templates
         base.html
      static
         css
         js

In base.html starts with:

{% load staticfiles %}
{% load i18n %}
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Bootstrap, from Twitter</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <!-- Le styles -->
    <link rel="shortcut icon" href="http://twitter.github.com/bootstrap/assets/ico/favicon.ico">
    <link href="{{ STATIC_URL }}css/bootstrap.min.css" rel="stylesheet">
    <style type="text/css">
      body {
        padding-top: 60px;
        padding-bottom: 40px;
      }
    </style>
    <link href="{{ STATIC_URL }}css/bootstrap-responsive.min.css" rel="stylesheet">
  </head>

  <body>

but django does not get none of the static files:

[15/Oct/2013 05:36:06] "GET /accounts/login/ HTTP/1.1" 200 3402
[15/Oct/2013 05:36:06] "GET /static/css/bootstrap.min.css HTTP/1.1" 404 2089
[15/Oct/2013 05:36:06] "GET /static/css/bootstrap-responsive.min.css HTTP/1.1" 404 2122
[15/Oct/2013 05:36:06] "GET /static/js/jquery.min.js HTTP/1.1" 404 2074
[15/Oct/2013 05:36:06] "GET /static/js/prettify.js HTTP/1.1" 404 2068
[15/Oct/2013 05:36:06] "GET /static/js/bootstrap.min.js HTTP/1.1" 404 2083
[15/Oct/2013 05:36:06] "GET /static/css/bootstrap.min.css HTTP/1.1" 404 2089
[15/Oct/2013 05:36:06] "GET /accounts/login/ HTTP/1.1" 200 3402
[15/Oct/2013 05:36:06] "GET /static/css/bootstrap-responsive.min.css HTTP/1.1" 404 2122
[15/Oct/2013 05:36:19] "GET /static/css/bootstrap.min.css HTTP/1.1" 404 2089
[15/Oct/2013 05:36:20] "GET /static/css/bootstrap.min.css HTTP/1.1" 404 2089

I'v read the Django docs and tried several alternative settings but none did help to resolve the problem. So appreciate your hints.

url.spy

from django.conf.urls import patterns, include, url

# Uncomment the next two lines to enable the admin:
from django.contrib import admin
admin.autodiscover()

urlpatterns = patterns('',
    # Examples:
    #url(r'^$', 'myproj.views.home', name='home'),
    # url(r'^myproj/', include('myproj.foo.urls')),

    # Uncomment the admin/doc line below to enable admin documentation:
    # url(r'^admin/doc/', include('django.contrib.admindocs.urls')),

    # Uncomment the next line to enable the admin:
    url(r'^admin/', include(admin.site.urls)),
   url (r'^accounts/', include('registration.backends.default.urls')),
)
supermario
  • 2,625
  • 4
  • 38
  • 58

1 Answers1

2

Staticfiles in Django seems to always confuse people who are just starting out, and imo, the documentation could be improved.

Here's a quick breakdown of what's what:

MEDIA_ROOT: The base directory where files you upload as part of a form or model form go. The upload_to property of a File/ImageField is appended to this path.

MEDIA_URL: The URL pattern that files located in MEDIA_ROOT are accessible via.

STATIC_ROOT: The directory that holds static files to be served in production.

STATIC_URL: The URL pattern that files located in STATIC_ROOT are accessible via.

STATICFILES_DIRS: The director(y/ies) that hold static files to be served in development.

When you have the staticfiles app in your INSTALLED_APPS, it will only serve static files located in STATICFILES_DIRS when DEBUG = True.

When you run $ python manage.py collectstatic, it will gather any static directories for your application, and any 3rd party applications and copy them to STATIC_ROOT.

So, to fix your paths to static files in production, make sure your settings are correct and that you've run collectstatic either before you deploy or as part of your deployment process.

There is also a new template tag for static files:

{% load i18n %}
{% load static from staticfiles %}
<!DOCTYPE html>
<html lang="en">
  <head>
      ...
      <link href="{% static 'css/bootstrap.min.css' %}"
          rel="stylesheet">
      <link href="{% static 'css/bootstrap-responsive.min.css' %}"
          rel="stylesheet">
  </head>
  <body>
      ...

In your project structure, re-name "/static" to "/static-assets" and set that directory in STATICFILES_DIRS.

Change your STATIC_ROOT to point to "/static", and don't put any directories or files there yourself. Let the collectstatic management command do that.

Here's how I typically structure a project:

/my_app/
    /my_app/
        __init__.py
        settings.py
        urls.py

    manage.py

    /another_app_module/
        __init__.py
        models.py
        ...
    /static/
    /static-assets/
        /css
        /js
        /images
    /templates

Given this file structure, and assuming my project sits at: /home/btaylor/django-projects/my_app/ my settings would be:

STATIC_ROOT = '/home/btaylor/django-projects/my_app/static'
STATIC_URL = '/static/'
MEDIA_ROOT = '/home/btaylor/django-projects/my_app/static/uploads'
MEDIA_URL = '/static/uploads/'
STATICFILES_DIRS = ('/home/btaylor/django_projects/my_app/static-assets',)
Brandon Taylor
  • 33,823
  • 15
  • 104
  • 144
  • Thanks for clear explanation. but I'm still struggling to apply it to paths. Appreciate some real examples based on the file structure above. – supermario Oct 15 '13 at 13:35
  • I added a project directory structure and example HTML for you. – Brandon Taylor Oct 15 '13 at 13:46
  • sorry, I get 'ImproperlyConfigured: Your STATICFILES_DIRS setting is not a tuple or list; perhaps you forgot a trailing comma? ' when I run collectstatic. what should be the STATICFILES_DIRS? – supermario Oct 15 '13 at 13:57
  • Tuples *always* have a trailing comma, even if there is only one element in the tuple. You need to add a comma after the element in your `STATICFILES_DIRS` setting. – Brandon Taylor Oct 15 '13 at 13:58
  • I get OSError: [Errno 13] Permission denied from : '/static', when I run collectstatic at STATICFILES_DIRS = ('/home/supermario/myproj/static',) and static is world writable. Any ideas? – supermario Oct 15 '13 at 14:06
  • Is this on your development machine? or your production server? – Brandon Taylor Oct 15 '13 at 14:09
  • It's my Ubuntu development machine and I user virtualenv. – supermario Oct 15 '13 at 14:10
  • Did you change your STATIC_ROOT to point to /static and your STATICFILES_DIRS to point to /static-assets ? – Brandon Taylor Oct 15 '13 at 14:15
  • I just set STATICFILES_DIRS = '/home/supermari/myproj/static-assets',) and STATIC_ROOT= '/home/supermario/myproj/static'. the collectstatic have copied only 'admin' folder to /home/supermario/myproj/static and now none of the css and js being requested from webserver. – supermario Oct 15 '13 at 14:25
  • Could you please add your working STATIC_ROOT and STATICFILES_DIRS paths for your example file structure? – supermario Oct 15 '13 at 14:36
  • I added settings based on my sample project structure. – Brandon Taylor Oct 15 '13 at 14:43