Setting up django for css file

Question

I am a newbie to django and trying to create a personal tech blog. I am hosting on webfaction. I have setup the blog using this video. But the stylesheets are not working. I followed the step-by-step procedure to create the static files mentioned by webfaction but still the stlyesheet is not working.

I have created a static application: staticapp and added it to the website with /static as mentioned in the webfaction doc.

In settings.py:

  STATIC_ROOT = 'home/myaccount/webapps/staticapp'
  STATIC_URL = 'http://myblogtest.myaccount.webfactional.com/static'
  STATICFILES_DIRS = ( 'junk','static',)


INSTALLED_APPS = (
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.sites',
    'django.contrib.messages',
    'django.contrib.staticfiles',
     'django.contrib.admin',
     'django.contrib.admindocs',
     'blog',
     )

I am referencing from my html page like this:

 <link rel="stylesheet" type="text/css" href="static/style/style.css" />

Am I missing any step? I could see many answers saying to add a code snippet in urls.py but it is not mentioned in Webfaction's doc. So I haven't done that.

I could see many have faced this same problem but the answers are not helping me as I am a newbie. Kindly help me to setup this. :)

score 3 · Accepted Answer · answered Oct 03 '12 at 17:27

STATIC_ROOT needs to have a prepending slash /, i.e. /home... not home...

DO NOT add the static directory to STATICFILES_DIRS. You have my permission to smack whomever advised you to do that with the nearest blunt object. The static directory should not exist at all in development, and in production it should only ever be created or modified via python manage.py collectstatic.

DO store your static resources in either each app's individual static directory or an entirely different project-level directory, i.e. this directory should not be the same as that for MEDIA_ROOT or STATIC_ROOT. Then, add this directory to STATICFILES_DIRS.

In Django 1.4+ you should use the {% static %} template tag in your templates:

{% load static from staticfiles %}
<img src="{% static "images/hi.jpg" %}" alt="Hi!" />

This will automatically append the STATIC_URL portion of the URL for you, so the path parameter you provide should be relative to that.

In Django 1.3, you'd use {{ STATIC_URL }} after ensuring that 'django.core.context_processors.static' appears somewhere in your TEMPLATE_CONTEXT_PROCESSORS setting. Your views will also need to utilize RequestContext, which means using either class-based views, the render method, or passing context_instance=RequestContext(request) to render_to_response.

If you want Django to serve static files in development for ease, you can add the following to the end of your urls.py:

from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns += staticfiles_urlpatterns()

This will not work in a production enviroment (DEBUG=False). For production, you need to run python manage.py collectstatic and then have your frontend webserver (nginx, Apache, etc.) serve the directory at STATIC_URL.

score 1 · Answer 2 · answered Oct 03 '12 at 16:03

You have defined STATIC_URL in settings; you should use it in your html templates

<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}/style/style.css">

That should work as long as you haven't removed anything from TEMPLATE_CONTEXT_PROCESSORS in settings.

You could also look into using an asset manager to generate all of the JS and CSS links in your templates for you, rather than writing them yourself. django-pipeline is really good, and can handle things like JS and CSS concatenation and compression for you as well.

Tried with {{ STATIC_URL }}. It did not help. Would you like to know any other information about the process that I followed? — Robby, Oct 03 '12 at 16:19

Setting up django for css file

2 Answers2

Linked