Как подключать стили (css) приложений в шаблон django?

в INSTALLED_APPS добавлено 'django.contrib.staticfiles'
в базовом шаблоне base.html: {% load staticfiles %}
создал в приложении (news) static/news/css/styles.css
хочу чтобы на страницах, /news/, /news/.... подключался этот файл.
есть какие-то средства из коробки или уже проработанные средства для этого?
  • Вопрос задан
  • 1330 просмотров
Решения вопроса 1
sim3x
@sim3x
Лучше использовать функционал шаблонов
proj/
└── templates
    ├── base.html
    └── news.html


base
{% load staticfiles %}
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="{% static main.css %}">
    {% block additional_media1 %}{% endblock %}
    {% block additional_media2 %}
        <link rel="stylesheet" href="{% static else.css %}">
    {% endblock %}
</head>
<body>

{% block body1 %}{% endblock %}

{% block body2 %}{% endblock %}
</body>
</html>


news
{% extends "base.html" %}
{% load staticfiles %}

{% block additional_media1 %}
    <link rel="stylesheet" href="{% static news.css %}">
{% endblock %}

{% block additional_media2 %}
    {{ block.super }} 
    <link rel="stylesheet" href="{% static else2.css %}">
{% endblock %}

{% block body1 %}lorem{% endblock %}

{% block body2 %}ipsum{% endblock %}
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 2
fox_12
@fox_12 Куратор тега Django
Расставляю биты, управляю заряженными частицами
Во вьюхе класс Media:
....
    class Media:
        js = ('js/my.js', )
        css = {'all': ('css/settings_styles.css', )}


либо как процедура (если используем условия например) - пример из кастомизации админки с использованием мелких вставок стилей прямо в шаблон, для обычных вьюх - суть та же:

import embedded_media as emb

@admin.register(MyModel)
class MyModelAdmin(ReadOnlyAdmin):
    ...
    @property
    def media(self):
        media = super(MyModelAdmin, self).media
        js = (
            '/admin/jsi18n/',
            '/static/admin/js/calendar.js',
            '/static/admin/js/admin/DateTimeShortcuts.js' )
        if self.read_only:
            css = { 'all': (emb.CSS('.save-box { display: none; }'),) }
            media.add_css(css)
        media.add_js(js)
        return media

Ну и в шаблонах можно подключать само собой, либо используя templatetags например
Ответ написан
Комментировать
Еще варианты:
сделать блок в базовом шаблоне куда вы будете подключать дополнительные css файлы, сделать шаблон для news и переопределить в нем данный блок.
Второй путь, добавить логику в базовый шаблон и написать условие если в url есть news то выводить css, но лишняя логика в шаблоне ни к чему.
путь у Вас будет скорее всего
<link rel="stylesheet" href="{% static "news/css/styles.css" %}" type="text/css">
не забывайте собрать статику.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы