Политика конфиденциальностиКонтактыО сайтеОтзывыGitHubDonate
© EVILEG 2015-2018
Рекомендует хостинг
TIMEWEB

Django - Урок 004. Подключение Bootstrap 3 к сайту на Django

Bootstrap

Дизайн сайта и его вёрстка являются довольно важными вопросами, и порой хочется разработать сайт с хорошим и интересным дизайном... но... Не все из нас дизайнеры, и ещё меньше хороших дизайнеров. Поэтому мне проще было взять Bootstrap 3, найти хорошую тему оформления для него, а точнее кастомизированный в едином стиле CSS, и не заморачиваясь начать разработку сайта с уже проверенным многими web-мастерами инструментом.

Давайте посмотрим, как обстоит дело с Bootstrap 3 в Django .

django-bootstrap3

Итак, для  Django существует готовое приложение django-bootstrap3 , которое необходимо установить, подключить, и для использования добавить необходимые компоненты в тег head на страницах сайта.

Установка

Установка приложение осуществляется с использованием утилиты pip, не забудьте только активировать виртуальное окружение.

pip install django-bootstrap3

Подключение

Прежде, чем использовать Bootstrap, его необходимо подключить в конфигурационном файле.

INSTALLED_APPS = [
    ...
    'bootstrap3',
    ...
]

Использование

Модуль Bootstrap для Django позволяет использовать как готовые формы, без затрат времени на вёрстку, так и просто воспользоваться стилями и библиотекой jQuery, которая используется для данной текущей версии Bootstrap.

Например, для минимального подключения стилей оформления и скриптов Bootstrap достаточно будет прописать следующее в теге head.

{% load bootstrap3 %}
<script src="{% bootstrap_jquery_url %}"></script>
{% bootstrap_javascript %}
{% bootstrap_css %}

Если вы желаете воспользоваться быстрой кастомизацией формы в стиле bootstrap, то в шаблоне также нужно будет указать подключение модуля и воспользоваться шаблоном формы для данного модуля.

{% load bootstrap3 %}

{# Display a form #}

<form action="/url/to/submit/" method="post" class="form">
    {% csrf_token %}
    {% bootstrap_form form %}
    {% buttons %}
        <button type="submit" class="btn btn-primary">
            {% bootstrap_icon "star" %} Submit
        </button>
    {% endbuttons %}
</form>

Для Django рекомендую VDS-сервера хостера Timeweb .

Комментарии

Только авторизованные пользователи могут публиковать комментарии.
Пожалуйста, авторизуйтесь или зарегистрируйтесь
IO
20 января 2019 г. 18:39
Ivan Otreshko

C++ - Тест 003. Условия и циклы

  • Результат:0баллов,
  • Очки рейтинга-10
IO
20 января 2019 г. 15:27
Ivan Otreshko

C++ - Тест 003. Условия и циклы

  • Результат:0баллов,
  • Очки рейтинга-10
v
17 января 2019 г. 11:51
vitalir12

C++ - Тест 004. Указатели, Массивы и Циклы

  • Результат:20баллов,
  • Очки рейтинга-10
Последние комментарии
I
16 января 2019 г. 8:06
IscanderChe

Заработало. Забыл model->select(); вписать.
I
16 января 2019 г. 8:02
IscanderChe

Всё равно пусто, хотя строка с данными в базу добавляется.
16 января 2019 г. 7:51
Евгений Легоцкой

потому, что нужно сохранять информацию для всех остальных ролей и столбцов через вызов переопределённого метода. Да к тому же вы ещё и зациклили вызов метода data. QVariant MySqlTableModel:...
I
16 января 2019 г. 7:43
IscanderChe

Сделал вот так. В tableView ничего нет, кроме заголовка. QVariant MySqlTableModel::data(const QModelIndex &index, int role) const{ if (role == Qt::DisplayRole) { QTime ...
Сейчас обсуждают на форуме
21 января 2019 г. 16:28
Михаиллл

Добрый день.Почему работая на С++, нельзя полноценно использовать dll , написанных на C#, java?И почему используя другие языки, можно использовать dll , написанных на C++?
21 января 2019 г. 16:24
Михаиллл

Нашел ссылку на древние типы данных , а тут нынешние их аналоги.Но все равно каое что непоня:что такое : LPCTSTR, CALLBACK (наверно QDialig),IDOK, EDITSTREAM, TCHARКод...
21 января 2019 г. 14:30
Евгений Легоцкой

Порядок создания тем - пункт 4
ПБ
21 января 2019 г. 9:23
Павел Богдевич

Ребята, привет. Это 2 версии одного приложения. Отличаются только способом инициализации таблицы. В одной версии работает сортировка таблицы, когда кликаешь по хедеру колонки, в другой - нет. ...
21 января 2019 г. 7:36
Евгений Легоцкой

Добрый день! Из ваего вопроса понятна первая часть. На сайте есть статья по динамическому созданию виджетов, посмотрите её для начала - Динамическое создание виджетов . ...
Присоединяйтесь к нам в социальных сетях

Для зарегистрированных пользователей на сайте присутствует минимальное количество рекламы