¿Cómo uso CSS en Django?

110

Estoy creando mi aplicación usando Django, y me pregunto cómo puedo hacer que Django use mi archivo CSS. ¿Qué configuración debo hacer para que Django vea el archivo css?

NB: en una máquina local

css django django-forms gath
fuente

Respuestas:

48

Si está utilizando el servidor de desarrollo, siga la guía práctica del proyecto django para administrar archivos estáticos para configurar sus URL, luego haga referencia a sus archivos multimedia en la plantilla, por ejemplo, una imagen dentro de una carpeta de imágenes de /site_media/images/foo.gif.

Joe
fuente
25
Solo una nota rápida sobre esos documentos de Django: asegúrese de seleccionar los documentos para la versión de Django que está usando. Las cosas parecen haber cambiado mucho entre versiones con respecto a los archivos estáticos.
Sam Starling
3
@Sam tiene un gran punto. No pude descifrar archivos estáticos por mi vida. luego, cambie la versión de django instalada y listo. eso era literalmente todo lo que tenía que hacer porque aparentemente estaba buscando en los documentos la versión incorrecta.
Josh Brown
36

Dicho de manera más general, está preguntando cómo entregar un archivo estático de Django. Si está ejecutando Apache, debe leer http://docs.djangoproject.com/en/dev/howto/deployment/modpython/

Si está ejecutando el servidor de desarrollo (por ejemplo, en su computadora portátil), lea http://docs.djangoproject.com/en/dev/howto/static-files/

Tenga en cuenta el gran descargo de responsabilidad con respecto al servidor de desarrollo Django:

  • El uso de este servidor es ineficaz e inseguro.
  • No lo utilice en un entorno de producción.
  • Use esto solo para el desarrollo.
Peter Rowell
fuente
"No utilice esto en un entorno de producción". ¿Te importaría ampliar esto?
Chris
@Chris: Tienes razón, la declaración fue un poco ambigua. Me refería al servidor de desarrollo de Django. Aunque lo he ejecutado varias veces en nuestro sitio de producción, fue solo por períodos cortos de tiempo mientras depuraba problemas complicados.
Peter Rowell
Gracias por la aclaración, estaba mirando mis implementaciones de django ejecutándose en apache y me preguntaba qué hice mal. :)
Chris
1
Agradable. Me gustan los 3 elementos que dicen lo mismo de diferentes maneras. Gracias por la advertencia.
KobeJohn
13
Amo absolutamente a las personas que vienen 4.5 años después de que se publicó una respuesta y la votan en contra. Me pregunto si siquiera sabían qué era Django en el 08/11 ... probablemente no. No son los puntos de reputación lo que me afecta , es la combinación mostrada de ignorancia y arrogancia con solo un indicio de llegar muy tarde a la fiesta. Me pregunto cómo calificarían mis publicaciones para comp.lang.c en, digamos, 1987. Mejor no preguntar.
Peter Rowell
13

Esto también me causó problemas por un tiempo (404 errores no encontrados). Lo que me faltaba era editar la STATICFILES_DIRStupla en settings.py para darme esto:

STATICFILES_DIRS = (
    # Put strings here, like "/home/html/static" or "C:/www/django/static".
    # Always use forward slashes, even on Windows.
    # Don't forget to use absolute paths, not relative paths.
    os.path.join(os.path.dirname(__file__),'media').replace('\\','/'),
)

Esto luego recogió mis archivos CSS en una carpeta llamada 'media' que estaba en el nivel superior de mi proyecto django.

También tenía:

MEDIA_ROOT = ''
MEDIA_URL = ''
STATIC_ROOT = ''
STATIC_URL = '/media/'

(asegúrese de tener el encabezado /anterior en STATIC_URL)

Por supuesto, como se dijo anteriormente, debe tener el archivo CSS incluido correctamente en sus archivos html. Yo tenía:

<link href="{{ STATIC_URL }}css/ea_base.css" rel="stylesheet" type="text/css" media="screen" />
jacanterbury
fuente
Finalmente, una solución clara, sencilla y elegante. Funciona bien con django 1.5.
pbarill
# Utilice siempre barras diagonales, incluso en Windows. .replace('\\','/')es innecesario.
MAK
12

¿Qué configuración debo hacer para que Django vea el archivo css?

Ninguna.

Asegúrese de que su plantilla incluya el archivo CSS (como lo hace el HTML estándar) y coloque el archivo CSS en el servidor de medios.

Para aclarar: con Django es muy recomendable que sirva todos sus medios (todo lo que no sea HTML dinámico) desde una instancia de servidor diferente. Cómo implementar eso depende completamente de usted, pero la mayoría de las personas crean un subdominio.

Oli
fuente
2
Hola, Oli. Sé que esta publicación tiene casi 3 años, pero ¿sigue siendo esta la mejor manera de vincular CSS a las plantillas de Django? Parece que sería más fácil vincular css a una URL abs como static.example.com y simplemente almacenar todos los archivos estáticos en esa URL.
cp3
0

Bueno, la forma más fácil de usar css con django es agregarlo a sus plantillas como archivos estáticos.

Pero es un poco como ajax, no encontré nada que diga cómo incluirlo de forma estándar.

Hay un módulo de compresor css para django si desea optimizar su tamaño.

Roch
fuente