[Django]-Django: how do you serve media / stylesheets and link to them within templates

by

51👍

✅

I just had to figure this out myself.

settings.py:

MEDIA_ROOT = 'C:/Server/Projects/project_name/static/'
MEDIA_URL = '/static/'
ADMIN_MEDIA_PREFIX = '/media/'

urls.py:

from django.conf import settings
...
if settings.DEBUG:
    urlpatterns += patterns('',
        (r'^static/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT}),
    )

template file:

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

With the file located here:

"C:/Server/Projects/project_name/static/css/style.css"
👤Ty.

11👍

Django already has a context process for MEDIA_URL, see Django’s documentation.

It should be availbale by default (unless you’ve customized CONTEXT_PROCESSORS and forgot to add it) in a RequestContext.

👤Meir Kriheli

6👍

I usually make my own Template simple tag because Django isn’t giving CSS/JavaScript files. Apache does it so my media url is usually http://static.mysite.com.

yourApp/templatetags/media_url.py:

from django.template import Library
from yourapp.settings import MEDIA_URL
register = Library()

@register.simple_tag
def media_url():
    return MEDIA_URL

And in my template file:

{% load media_url %}
<link href="{{ media_url }}css/main.css" rel="stylesheet" type="text/css">

You could also make your own context preprocessor to add the media_url variable in every template.

👤bchhun

2👍

I just use absolute naming. Unless you’re running the site in a deep path (or even if you are), I’d drop the .. and go for something like:

<link rel="stylesheet" type="text/css" href="/media/styles.css">
👤Oli

1👍

I’ve got a couple of ideas, I don’t know which one of them is working for me 🙂

Make sure to use a trailing slash, and to have this be different from the MEDIA_URL setting (since the same URL cannot be mapped onto two different sets of files).

That’s from http://docs.djangoproject.com/en/dev/ref/settings/#admin-media-prefix

Secondly, it may be that you’re confusing directories on your filesystem with url paths. Try using absolute urls, and then refine them down.

👤sykora

1👍

Just thought I’d chime in quickly. While all the propositions here work just fine, and I do use Ty’s example while developing, once you hit production you might want to opt to serve files via a straight Apache, or whichever else server you’re using.

What I do is I setup a subdomain once I’m done developing, and replace all links to static media. For instance:

<link rel="stylesheet" type="text/css" href="http://static.mydomain.com/css/style.css" />

The reasons for doing this are two-fold. First, it just seems like it would be slower to have Django handle these requests when it’s not needed. Second, since most browsers can actually download files simultaneously from 3 different domains, using a second sub-domain for your static files will actually speed up the download speed of your users.

👤David

0👍

Another thing to add is that if you have a separate media server on a subdomain/different domain, you can disable cookies for your static media. Saves a little processing and bandwidth.

👤datashaman

Leave a comment