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 .