Простой пример Django и CSS - PullRequest
       0

Простой пример Django и CSS

22 голосов
/ 05 февраля 2012

Я новичок в Django и пытаюсь настроить действительно простое приложение Django.

Теперь я дошел до главы 5 в онлайн-книге Django: http://www.djangobook.com/en/2.0/chapter05/

Все, что я хочу сделать сейчас, прежде чем я начну пробовать базы данных, - это добавить несколько простых CS и J в приложение как есть.

Итак, вопрос в том, как мне это сделать?У меня есть только одно приложение, и я хочу только main.css в папке css и main.js в папке js.

Я проверил страницу https://docs.djangoproject.com/en/1.3/howto/static-files/#staticfiles-in-templates, но после прочтенияи, читая, похоже, было не так много работы с примерами.

Как импортировать таблицы стилей / css (есть ли такой помощник, как CakePHP?), куда мне поместитьCSS и JS файлы, а мне нужно настроить статические штуки?

ОБНОВЛЕНИЕ: ссылка: Визуализация CSS в Django не сильно помогает.Главным образом в том, что это не сработало для меня, но также мне особенно не нравится часть «если отладка».Что происходит, когда я перехожу на прод?Почему в любом случае моя папка мультимедиа определяется по-разному для prod и local dev?Разве это не должно быть относительно или даже в одном месте?

Ответы [ 5 ]

25 голосов
/ 05 февраля 2012

Если вы следуете рекомендациям django, вы можете значительно упростить свою жизнь.

В своем примере кода внутри каталога application создайте папку с именем static .Внутри этой папки поместите ваши CSS-файлы.

Пример:

$ django-admin.py startproject myproject
$ cd myproject
myproject$ python manage.py startapp myapp
myproject$ mkdir myapp/static
myproject$ cd myapp/static
myproject/myapp/static$ nano style.css

В ваших шаблонах:

<link rel="stylesheet" href="{{ STATIC_URL }}style.css" />

Убедитесь, что вы добавили myapp в список INSTALLED_APPS в settings.py.Теперь, когда вы используете встроенный сервер разработки, ваша таблица стилей будет отображаться правильно.

Django ищет каталог static внутри установленных приложений по умолчанию, а в текущих версиях django статические файлы включены по умолчанию.


В примере Djangoпуть my_app/static/my_app/myimage.jpg, который немного сбивает с толку, если ваше приложение и проект имеют одно и то же имя.

Это рекомендуется, потому что при запуске collectstatic для сбора всех ваших статических файлов, файлы с одинаковымимя будет перезаписано.Если у вас есть файл с именем myimage.jpg в другом приложении, он будет перезаписан.Задание имени приложения внутри статического каталога предотвратит это, поскольку точная структура каталога будет реплицирована в вашем каталоге STATIC_ROOT.

Простой пример, иллюстрирующий эту точку.Если у вас есть проект django с двумя приложениями, например:

.
├── assets
├── manage.py
├── myapp
│   ├── __init__.py
│   ├── models.py
│   ├── static
│   │   └── myapp
│   │       └── test.txt
│   ├── tests.py
│   └── views.py
├── myproj
│   ├── __init__.py
│   ├── __init__.pyc
│   ├── settings.py
│   ├── settings.pyc
│   ├── urls.py
│   └── wsgi.py
└── otherapp
    ├── __init__.py
    ├── models.py
    ├── static
    │   └── otherapp
    │       └── test.txt
    ├── tests.py
    └── views.py

assets - ваш STATIC_ROOT.Теперь, когда вы запускаете collectstatic:

.
├── assets
│   ├── myapp
│   │   └── test.txt
│   └── otherapp
│       └── test.txt
├── manage.py
├── myapp
│   ├── __init__.py
│   ├── __init__.pyc
│   ├── models.py
│   ├── static
│   │   └── myapp
│   │       └── test.txt
│   ├── tests.py
│   └── views.py
├── myproj
│   ├── __init__.py
│   ├── __init__.pyc
│   ├── settings.py
│   ├── settings.pyc
│   ├── urls.py
│   └── wsgi.py
└── otherapp
    ├── __init__.py
    ├── __init__.pyc
    ├── models.py
    ├── static
    │   └── otherapp
    │       └── test.txt
    ├── tests.py
    └── views.py

Вы видите, что он также создает каталоги.В ваших шаблонах вы теперь будете ссылаться на каждый файл с его «пространством имен» приложения: {{ STATIC_URL }}/myapp/test.txt

6 голосов
/ 05 февраля 2012

Чтобы примеры, на которые вы указали , работали, ваши статические файлы должны находиться в месте, доступном для встроенного в Django staticfiles приложения.

Есть несколько шагов, чтобычтобы это произошло:

Во-первых, в каталоге вашего проекта (т.е. рядом с файлом manage.py) вам необходимо создать каталог для хранения ваших статических файлов.Назовите его «static_files».

Далее вам нужно сообщить Django, что нужно искать в этом каталоге, указав его в списке STATICFILES_DIRS в вашем файле settings.py.

Примерно так:

STATICFILES_DIRS = [
    '/full/path/to/your/project/static_files/',
]

Внутри этого каталога static_files вы можете создать любую структуру, какую захотите, и именно туда могут пойти ваши каталоги css и js.

После этого вы сможете использовать тег {{ STATIC_URL }} в своих шаблонах, чтобы получить доступ к базовому URL ваших статических файлов.

Так, например, вы создаете project/static_files/css/base.css, выбудет использовать его в вашем шаблоне так:

<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}/css/base.css" />

Надеюсь, это поможет!

Редактировать

С настройками по умолчанию для STATICFILES_FINDERS,Django должен автоматически обслуживать любые файлы из каталогов, перечисленных в вашем STATICFILES_DIRS - подробности см. в документах .

Если это не работает, некоторые вещи нужно проверить:

  • Вы изменили настройку STATICFILES_FINDERS на значение, отличное от значения по умолчанию?
  • Is django.contrib.staticfiles в вашем списке INSTALLED_APPS в settings.py?
  • Вы используете встроенный сервер Django (python manage.py runserver)?
  • У вас есть DEBUG = True в вашем settings.py?Если нет, вам нужно либо установить True, либо использовать параметр insecure (python manage.py runserver --insecure) .Отправляясь в производство, проверьте команду collectstatic .
5 голосов
/ 27 ноября 2015

Рекомендуемый подход снова изменился (по крайней мере, с Django 1.5, я думаю).

В верхней части вашего шаблона поместите:

{% load staticfiles %}

Затем, используя ту же структуру каталогов (myapp/static/myapp/style.css):

<link rel="stylesheet" href="{% static 'myapp/style.css' %}" />

Источник

3 голосов
/ 05 февраля 2012

Обработка статических файлов значительно изменилась (в лучшую сторону) в Django 1.3.В частности, существует гибкое различие между статическими файлами (представьте, что код требует CSS / JS / images) и медиафайлами (представьте, изображения, загруженные пользователями при использовании вашего приложения)Приложение staticfiles обрабатывает то, что вы просите.

Поместите django.contrib.staticfiles в файл settings.py INSTALLED_APPS.Затем создайте каталог static внутри каталога приложения - так что project/app/static/.Внутри этого статического каталога организуйте ваши файлы поддержки так, как вам нравится (css /, js /, images /, icons / и т. Д.).staticfiles по умолчанию будет искать в каталоге static / для каждого приложения, указанного в INSTALLED_APPS.Не только ваши собственные, но и все приложения Django и сторонние приложения.(sidenote: администратор в Django 1.4 движется к этой парадигме, в то время как в 1.3 он все еще использует ADMIN_MEDIA_PREFIX).

Приложение staticfiles знает обо всех этих статических / каталогах во всех приложениях, но ему нужно собрать всеэто содержание, чтобы служить ему.В разработке, при использовании manage.py runserver это обрабатывается для вас.Django запустит ваш сайт и автоматически доставит весь статический контент из всех статических источников.(Источники, как упомянуто в другом ответе, задаются в настройке STATICFILES_FINDERS.) Если не используется runserver, используйте manage.py collectstatic, чтобы собрать все статические файлы в папку, определенную в STATIC_ROOT. Держите этот каталог пустым. Это пункт назначения коллекции.Конечно, ваш веб-сервер должен быть настроен для обслуживания этого каталога.

Теперь есть еще один фрагмент - представление .Это где STATIC_URL вступает в игру.При обращении к статическим файлам в ваших шаблонах самый простой способ - использовать {{ STATIC_URL }}.По умолчанию Django делает эту переменную доступной для любого представления, использующего RequestContext.Сделайте что-то вроде этого - <link rel="stylesheet" href="{{ STATIC_URL }}/css/main.css" />.

Для получения дополнительной информации и дополнительных способов ссылки на STATIC_URL в ваших шаблонах, посмотрите этот ответ на аналогичный вопрос.

1 голос
/ 02 сентября 2018

наконец я получил после многих дней вот как это должно быть сделано 1> вам нужен статический файл в вашем приложении вместе с вашим проектом 2> здесь setting.py

   if DEBUG:
   STATIC_ROOT = "/PycharmProjects/don/admin/shopping/static/css"

    STATICFILES_DIRS =(
     #os.path.join(os.path.dirname(BASE_DIR),"static","static"),
     os.path.join(BASE_DIR, "static"),
    )

3> views.py

        from django.views.generic import TemplateView
        class HomeView(TemplateView):
               template_name = 'index.html'

4> файл шаблона

       {% load staticfiles %}
        <link rel="stylesheet" href="{% static 'css/style.css' %}">

5> urls.py

            from shopping.views import HomeView 
             from django.conf import settings
             from django.conf.urls.static import static
           urlpatterns = [
            url(r'^admin/', admin.site.urls),
             url(r'^$', HomeView.as_view())
          ]
        if settings.DEBUG:
       urlpatterns+=static(settings.STATIC_URL,document_root=settings.STATIC_ROOT)

6>     python manage.py collectstatic  

have fun :)
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...