Add styling to django Password reset forms

user_11615846 0
Viewed 3378

I want to add styling to django's default password reset form such as classes and placeholders

I have the following in my urls.py

from django.urls import path
from . import views
from django.contrib.auth import views as auth_views


urlpatterns = [

    # Password reset paths

    path('password_reset/', auth_views.PasswordResetView.as_view(template_name="main/password_reset.html"),name="reset_password"),
    path('password_reset_sent/', auth_views.PasswordResetDoneView.as_view(template_name="main/password_reset_sent.html"),name="password_reset_done"),
    path('reset_password/<uidb64>/<token>/', auth_views.PasswordResetConfirmView.as_view(template_name="main/reset_password.html"),name="password_reset_confirm"),
    path('reset_password_complete/', auth_views.PasswordResetCompleteView.as_view(template_name="main/reset_password_complete.html"),name="password_reset_complete"),
]

in the templates

<form action="" method="POST">
            {% csrf_token %}
            {{form}}
            <input type="submit" name="Send email" class="btn btn-primary" >
        </form>
django-templates django-forms django-views django python
4 Answers

yes of course you can overwrite django forms.

# forms.py

from django.contrib.auth.forms import PasswordResetForm

class UserPasswordResetForm(PasswordResetForm):
    def __init__(self, *args, **kwargs):
        super(UserPasswordResetForm, self).__init__(*args, **kwargs)

    email = forms.EmailField(label='', widget=forms.EmailInput(attrs={
        'class': 'your class',
        'placeholder': 'your placeholder',
        'type': 'email',
        'name': 'email'
        }))

# urls.py

from .forms import UserPasswordResetForm

path('password_reset/', auth_views.PasswordResetView.as_view(
    template_name='main/password_reset.html',
    form_class=UserPasswordResetForm),name='password_reset'),
user_136282820

Try Using django-crispy-forms.

Installation

pip install django-crispy-forms

Add it to your INSTALLED_APPS and select the style:

INSTALLED_APPS = [
'crispy_forms',
]
CRISPY_TEMPLATE_PACK = 'bootstrap4'

Load the tag

{% load crispy_forms_tags %}

Now you can style the form

{{ form|crispy }}
user_142524120

Try using django-crispy-forms and/or django-widget-tweaks

user_114972320

Use Crispy Forms, here is a well explained article about it CrispyForms

user_61753250
Related