CODEWITHSUNDEEP
djangodjango-templatesdjango-allauth
nani
nani

Reputation: 43

How to Customize Django-allauth and templates?

Is there any tutorial on how to customize django-allauth templates and fields. I know how to use with existing allauth and add fields. But I would like to learn about customizing templates completely like changing order and other?

Upvotes: 2

Views: 1256

Answers (1)

NKSM
NKSM

Reputation: 5854

If you create a file templates/account/login.html with this name in your code layout, it can override the one shipped with django-allauth.

For social accounts templates/socialaccount/connections.html

Django-Allauth has some documentation to override templates.

One of the options to reorder the form

# yourapp/forms.py
from allauth.account.forms import SignupForm
class YourSignupForm(SignupForm):
    field_order = ['email', 'username', 'password1', 'password2']

# settings.py:
ACCOUNT_FORMS = {'signup': 'mysite.forms.YourSignupForm'}

Some example rendering fields manually

<div class="fieldWrapper">
    {{ form.email.errors }}
    <label for="{{ form.email.id_for_label }}">Your email address:</label>
    {{ form.email }}
</div>
<div class="fieldWrapper">
    {{ form.username.errors }}
    <label for="{{ form.username.id_for_label }}">Your Username:</label>
    {{ form.username }}
</div>
<div class="fieldWrapper">
    {{ form.password1.errors }}
    <label for="{{ form.password1.id_for_label }}">Password:</label>
    {{ form.password1 }}
</div>
<div class="fieldWrapper">
    {{ form.password2.errors }}
    <label for="{{ form.password2.id_for_label }}">Password(again):</label>
    {{ form.password2 }}
</div>

Your code:

from allauth.account.forms import SignupForm
class MyCustomSignupForm(SignupForm):
    first_name = forms.CharField(max_length=100) 
    last_name = forms.CharField(max_length=100)

    def save(self, request):

        user = super(MyCustomSignupForm, self).save(request)

        return user

settings.py:

ACCOUNT_FORMS = {'signup': 'mysite.forms.MyCustomSignupForm'}

Upvotes: 4

Related Questions