2013-03-07 19:15:39 +00:00
|
|
|
===================================
|
|
|
|
Managing static files (CSS, images)
|
|
|
|
===================================
|
2005-11-27 14:42:21 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
Websites generally need to serve additional files such as images, JavaScript,
|
|
|
|
or CSS. In Django, we refer to these files as "static files". Django provides
|
|
|
|
:mod:`django.contrib.staticfiles` to help you manage them.
|
2005-11-27 14:42:21 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
This page describes how you can serve these static files.
|
2005-11-27 14:49:57 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
Configuring static files
|
|
|
|
========================
|
2005-11-27 14:42:21 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
1. Make sure that ``django.contrib.staticfiles`` is included in your
|
2011-05-18 09:51:24 +00:00
|
|
|
:setting:`INSTALLED_APPS`.
|
2008-08-23 22:25:40 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
2. In your settings file, define :setting:`STATIC_URL`, for example::
|
2008-08-23 22:25:40 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
STATIC_URL = '/static/'
|
2011-03-24 17:52:32 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
3. In your templates, either hardcode the url like
|
|
|
|
``/static/my_app/myexample.jpg`` or, preferably, use the
|
|
|
|
:ttag:`static<staticfiles-static>` template tag to build the URL for the given
|
|
|
|
relative path by using the configured :setting:`STATICFILES_STORAGE` storage
|
|
|
|
(this makes it much easier when you want to switch to a content delivery
|
|
|
|
network (CDN) for serving static files).
|
2011-03-24 17:52:32 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
.. _staticfiles-in-templates:
|
2011-03-24 17:52:32 +00:00
|
|
|
|
2011-05-18 09:51:24 +00:00
|
|
|
.. code-block:: html+django
|
2005-11-27 14:42:21 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
{% load staticfiles %}
|
|
|
|
<img src="{% static "my_app/myexample.jpg" %}" alt="My image"/>
|
2010-11-11 21:43:49 +00:00
|
|
|
|
2013-04-18 17:40:45 +00:00
|
|
|
4. Store your static files in a folder called ``static`` in your app. For
|
2013-03-07 19:15:39 +00:00
|
|
|
example ``my_app/static/my_app/myimage.jpg``.
|
2008-08-23 22:25:40 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
Now, if you use ``./manage.py runserver``, all static files should be served
|
|
|
|
automatically at the :setting:`STATIC_URL` and be shown correctly.
|
2010-10-20 01:33:24 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
Your project will probably also have static assets that aren't tied to a
|
|
|
|
particular app. In addition to using a ``static/`` directory inside your apps,
|
|
|
|
you can define a list of directories (:setting:`STATICFILES_DIRS`) in your
|
|
|
|
settings file where Django will also look for static files. For example::
|
2010-10-20 01:33:24 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
STATICFILES_DIRS = (
|
|
|
|
os.path.join(BASE_DIR, "static"),
|
|
|
|
'/var/www/static/',
|
2005-11-27 14:42:21 +00:00
|
|
|
)
|
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
See the documentation for the :setting:`STATICFILES_FINDERS` setting for
|
|
|
|
details on how ``staticfiles`` finds your files.
|
2010-10-20 01:33:24 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
.. admonition:: Static file namespacing
|
2010-10-20 01:33:24 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
Now we *might* be able to get away with putting our static files directly
|
|
|
|
in ``my_app/static/`` (rather than creating another ``my_app``
|
|
|
|
subdirectory), but it would actually be a bad idea. Django will use the
|
|
|
|
last static file it finds whose name matches, and if you had a static file
|
|
|
|
with the same name in a *different* application, Django would be unable to
|
|
|
|
distinguish between them. We need to be able to point Django at the right
|
|
|
|
one, and the easiest way to ensure this is by *namespacing* them. That is,
|
|
|
|
by putting those static files inside *another* directory named for the
|
|
|
|
application itself.
|
2010-10-20 01:33:24 +00:00
|
|
|
|
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
Serving files uploaded by a user
|
|
|
|
================================
|
2010-10-20 01:33:24 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
During development, you can serve user-uploaded media files from
|
|
|
|
:setting:`MEDIA_ROOT` using the :func:`django.contrib.staticfiles.views.serve`
|
|
|
|
view. This is not suitable for production use! For some common deployment
|
|
|
|
strategies, see :doc:`/howto/static-files/deployment`.
|
2010-10-20 01:33:24 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
For example, if your :setting:`MEDIA_URL` is defined as '/media/', you can do
|
|
|
|
this by adding the following snippet to your urls.py::
|
2011-02-14 01:42:26 +00:00
|
|
|
|
|
|
|
from django.conf import settings
|
|
|
|
from django.conf.urls.static import static
|
|
|
|
|
|
|
|
urlpatterns = patterns('',
|
|
|
|
# ... the rest of your URLconf goes here ...
|
|
|
|
) + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
|
2010-10-20 01:33:24 +00:00
|
|
|
|
2011-03-15 20:13:21 +00:00
|
|
|
.. note::
|
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
This helper function works only in debug mode and only if
|
2011-03-15 20:13:21 +00:00
|
|
|
the given prefix is local (e.g. ``/static/``) and not a URL (e.g.
|
|
|
|
``http://static.example.com/``).
|
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
Deployment
|
|
|
|
==========
|
2010-10-20 01:33:24 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
:mod:`django.contrib.staticfiles` provides a convenience management command
|
|
|
|
for gathering static files in a single directory so you can serve them easily.
|
2010-10-20 01:33:24 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
1. Set the :setting:`STATIC_ROOT` setting to the directory from which you'd
|
|
|
|
like to serve these files, for example::
|
2010-10-20 01:33:24 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
STATIC_ROOT = "/var/www/example.com/static/"
|
2010-10-20 01:33:24 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
2. Run the :djadmin:`collectstatic` management command::
|
2010-10-26 12:32:35 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
./manage.py collectstatic
|
2010-10-26 12:32:35 +00:00
|
|
|
|
2013-03-07 19:15:39 +00:00
|
|
|
This will copy all files from your static folders into the
|
|
|
|
:setting:`STATIC_ROOT` directory.
|
2010-10-26 12:32:35 +00:00
|
|
|
|
2013-04-29 17:40:03 +00:00
|
|
|
3. Use a web server of your choice to serve the
|
2013-03-07 19:15:39 +00:00
|
|
|
files. :doc:`/howto/static-files/deployment` covers some common deployment
|
|
|
|
strategies for static files.
|
2010-11-11 21:43:49 +00:00
|
|
|
|
2010-10-20 01:33:24 +00:00
|
|
|
Learn more
|
|
|
|
==========
|
|
|
|
|
|
|
|
This document has covered the basics and some common usage patterns. For
|
|
|
|
complete details on all the settings, commands, template tags, and other pieces
|
2013-03-07 19:15:39 +00:00
|
|
|
included in :mod:`django.contrib.staticfiles`, see :doc:`the staticfiles
|
|
|
|
reference </ref/contrib/staticfiles>`.
|