Question

I have read something about them via official doc and some posts, but I’m still confused. As far as I now can see, MEDIA_ROOT is for user uploaded images and files and STATIC_ROOT for js, css, etc. As for MEDIA_URL, is that for retrieving images? And is STATIC_URL for linking js and css?

I would appreciate it very much if examples are provided for each.

Answer 1

MEDIA_ROOT and STATIC_ROOT are the local directory the files reside in, for example:

MEDIA_ROOT = '/home/CDBean/mydjangoproject/media/' # notice the trailing slash
STATIC_ROOT = '/home/CDBean/mydjangoproject/static/'

MEDIA_URL and STATIC_URL are the publicly reachable URLs of those folders. That means that when you deploy your Django project, you’ll have to tell your web server to publish those folders under the URLs you specify here.

MEDIA_URL = 'http://media.example.com/' # trailing slashes here, too
STATIC_URL = 'http://static.example.com/'

You can then use those URLs (assuming you have django.core.context_processors.media and django.core.context_processors.static added to the TEMPLATE_CONTEXT_PROCESSORS tuple in settings.py) in your templates via {{MEDIA_URL}} and {{STATIC_URL}}. Two examples:

<link href="{{STATIC_URL}}css/main.css" media="screen" rel="stylesheet" type="text/css" />
<img src="{{MEDIA_URL}}random.jpg"/>

Now, when to use what? Basically you are right, but I strongly recommend reading https://docs.djangoproject.com/en/dev/howto/static-files/.