Django - Tutorial 004. Bootstrap 3 auf der Django-Site implementieren

Bootstrap

Website-Design und -Layout sind ziemlich wichtige Themen, und manchmal möchten Sie eine Website mit einem guten und interessanten Design entwickeln ... aber ... Wir sind nicht alle Designer, und noch weniger sind gute Designer. Daher war es für mich einfacher, Bootstrap 3 zu nehmen, ein gutes Design-Theme dafür zu finden, oder besser gesagt, CSS in einem einzigen Stil anzupassen, und ohne sich die Mühe zu machen, eine Website mit einem bereits von vielen Webmastern getesteten Tool zu entwickeln.

Mal sehen, wie Bootstrap 3 in Django ist.

django-bootstrap3

Für Django gibt es also eine vorgefertigte Anwendung django-bootstrap3 , die installiert, verbunden und zur Verwendung dem head -Tag auf den Site-Seiten hinzugefügt werden muss.

Installation

Die Anwendung wird mit dem pip-Dienstprogramm installiert, vergessen Sie nicht, nur die virtuelle Umgebung zu aktivieren.

pip install django-bootstrap3

Verbindung

Vor der Verwendung von Bootstrap muss es in die Konfigurationsdatei aufgenommen werden.

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

Verwendung

Mit dem Bootstrap-Modul für Django können Sie sowohl vorgefertigte Formulare verwenden, ohne Zeit für das Layout aufwenden zu müssen, als auch einfach die Stile und die jQuery-Bibliothek verwenden, die für diese aktuelle Version von Bootstrap verwendet wird.

Für eine minimale Verbindung von Bootstrap-Stilen und -Skripten reicht es beispielsweise aus, Folgendes in das Head-Tag zu schreiben.

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

Wenn Sie die Schnellanpassung des Formulars im Bootstrap-Stil nutzen möchten, müssen Sie in der Vorlage auch die Anbindung des Moduls angeben und die Formularvorlage für dieses Modul verwenden.

{% 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>

Für Django empfehle ich Timeweb VDS-Server .