Как переопределить шаблон по умолчанию в django-allauth

django-allauth — это пакет Django, который позволяет быстро и легко создавать системы аутентификации для приложений. В нем имеется множество шаблонов, позволяющих сосредоточиться на важных частях приложения.

Хотя существующие шаблоны полезны, вам захочется их изменить, если вы не сможете выбрать лучший пользовательский интерфейс.

Как установить и настроить Джанго-Аллаут

Выполнив несколько простых шагов, вы можете мгновенно установить django-allauth в свой проект Django.

1. Вы можете установить пакет django-allauth с помощью менеджера пакетов Pip:

pip установить Джанго-Аллаут

2. В файле настроек проекта добавьте в список установленных приложений следующие приложения:

INSTALLED_APPS = ( “”” Это приложение может быть использовано в Djang-allauth ‘django.contrib.sites’, ‘allauth’, ‘allauth.account’, ‘allauth.socialaccount’, # add this если вы хотите включить социальную аутентификацию)

3. Добавьте серверную часть аутентификации в установочный файл:

AUTHENTICATION_BACKENDS = ( ‘django.contrib.auth.backends.ModelBackend’, ‘allauth.account.auth_backends.AuthenticationBackend’, )

4. Добавьте в проект идентификатор сайта:

ИД_САЙТА = 1

5. Конфигурация URL-адреса для django-allauth:

из пути импорта django.urls включите urlpatterns = ( # Путь к шаблону URL-адреса Djang-allauth(‘accounts/’, include(‘allauth.urls’)), )

Если все настроено правильно, вы должны увидеть примерно такую ​​картину при переходе к:

Как переопределить шаблон по умолчанию в django-allauth. Изображение 1.

Вы можете просмотреть список доступных URL-адресов, перейдя к DEBUG=True в установочном файле:

Как переопределить шаблон по умолчанию в django-allauth. Изображение 2.

Как переопределить форму входа в django-allauth

Во-первых, вам необходимо настроить каталог шаблонов, если вы еще этого не сделали. Откройте установочный файл и перейдите к списку ШАБЛОНЫ. Внутри него найдите список DIRS и отредактируйте его следующим образом:

‘DIRS’: (BASE_DIR/’шаблоны’),

Убедитесь, что у вас есть папка шаблонов в корне вашего проекта. Вы можете переопределить форму входа по умолчанию в django-allauth, выполнив следующие действия.

Шаг 1. Создайте образец файла

В папке шаблонов создайте новую папку с именем account, в которой будут храниться шаблоны, связанные с django-allauth.

Формы регистрации и входа будут называться Signup.html и Login.html соответственно. Вы можете определить точное имя шаблона, открыв виртуальную среду Python и перейдя в папку Lib > site-packages > allauth > templates > account, чтобы найти шаблон. Давайте посмотрим на этот код, чтобы понять, как работают шаблоны. Например, форма входа содержит следующий код:

Как переопределить шаблон по умолчанию в django-allauth. Изображение 3.

Шаг 2. Добавьте HTML-код в файл шаблона.

После создания файла вы добавите в шаблон собственный HTML-код. Например, чтобы переопределить приведенную выше форму входа, вы можете скопировать все из блока {% else %}, содержащего форму и кнопку отправки, и добавить это в пользовательскую форму. Например:

{% расширяет ‘base.html’ %} {% блокирует содержимое %}

Если вы еще не создали учетную запись, сначала зарегистрируйтесь.

{% csrf_token %} {{ form.as_p }} {% if redirect_field_value %} {% endif %} Забыли пароль? Войдите в систему {% endblock content %}

Приведенный выше код использует наследование шаблонов Django для наследования функций шаблона base.html. Обязательно удалите лишние теги, такие как {%blocktrans%}. Если вы это сделали, страница входа будет выглядеть так:

Как переопределить шаблон по умолчанию в django-allauth. Изображение 4.

Шаг 3. Добавьте в форму собственные стили.

На предыдущем шаге форма входа отображалась в виде абзаца с тегом {{ form.as_p }}. Чтобы добавить стиль к форме, вам необходимо знать значение атрибута имени, связанного с каждым полем ввода.

Вы можете проверить страницу, чтобы получить необходимое значение.

Как переопределить шаблон по умолчанию в django-allauth. Изображение 5.

На изображении выше показан атрибут имени в сочетании с полем электронной почты формы.

Теперь вы можете добавить в проект каждое поле формы. Например, вы можете добавить поле электронной почты следующим образом:

{{ form.login }} Электронная почта {{ form.login.errors|safe }}

Вы можете использовать Bootstrap со своим проектом Django, чтобы легко стилизовать свои формы. Вот пример:

{{ form.login }} Электронная почта {{ form.login.errors|safe }}

Приведенный выше код добавляет в эту форму класс формы Bootstrap. Теперь вы можете добавить любые другие поля, которые вам нужны, и оформить их по своему желанию. В приведенном ниже примере для стилизации используется Bootstrap:

{{ form.non_field_errors | Safe }} {% csrf_token %} {{ form.login }} Электронная почта {{ form.login.errors|safe }} {{ form.password }} Пароль {{ form.password.errors|safe }} Запомнить меня {{ form.remember }} {% if redirect_field_value %} {% endif %} Войти Забыли пароль?

Приведенный выше блок кода даст результаты, аналогичные следующему изображению:

Как переопределить шаблон по умолчанию в django-allauth. Изображение 6.

django-allauth содержит множество шаблонов по умолчанию, которые вы можете переопределить. С помощью приведенных выше инструкций вы можете переопределить любой шаблон в django-allauth. Вам следует рассмотреть возможность использования этого пакета для управления системой аутентификации, чтобы можно было сосредоточиться на создании других важных функций приложения.

Похожие записи

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *