Django - 004-сабақ. Bootstrap 3-ті Django сайтына қосу

Bootstrap

Веб-сайттың дизайны мен макетін өте маңызды мәселелер, кейде сіз жақсы және қызықты дизайны бар веб-сайтты дамытқыңыз келеді... бірақ... Барлығымыз дизайнер емеспіз, ал жақсы дизайнерлер одан да аз. Сондықтан, маған Bootstrap 3-ті қабылдау, оған жақсы дизайн тақырыбын табу, дәлірек айтсақ, бір CSS стилінде теңшелген және көптеген веб-шеберлер сынаған құралмен сайтты әзірлеуді бас тартпай-ақ оңайырақ болды.

Django жүйесінде Bootstrap 3 қалай екенін көрейік.

django-bootstrap3

Сонымен, Django үшін django-bootstrap3 дайын қосымшасы бар, оны орнату, қосу және пайдалану үшін сайт беттеріндегі head тегіне қажетті компоненттерді қосу қажет.

Орнату

Қолданба pip утилитасы арқылы орнатылады, виртуалды ортаны белсендіруді ұмытпаңыз.

pip install django-bootstrap3

Байланыс

Bootstrap қолданбасын пайдаланбас бұрын ол конфигурация файлына қосылуы керек.

INSTALLED\_APPS = [
    ...
    'bootstrap3',
    ...
]

Қолданылуы

Django үшін Bootstrap модулі орналасуға уақыт жұмсамай, екі дайын пішінді де пайдалануға немесе Bootstrap бағдарламасының осы ағымдағы нұсқасы үшін қолданылатын мәнерлер мен jQuery кітапханасын пайдалануға мүмкіндік береді.

Мысалы, Bootstrap стильдері мен сценарийлерін минималды түрде қосу үшін head. тегіне келесіні жазу жеткілікті болады.

{% load bootstrap3 %}
<script src="{% bootstrap\_jquery\_url %}"></script>
{% bootstrap\_javascript %}
{% bootstrap\_css %}

Егер сіз жүктеу стиліндегі пішінді жылдам теңшеу мүмкіндігін пайдаланғыңыз келсе, үлгідегі модуль қосылымын көрсетуіңіз және осы модуль үшін пішін үлгісін пайдалануыңыз қажет.

{% 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 үшін Timeweb хостының VDS сервері ұсынамын.