Django-allauth में डिफ़ॉल्ट टेम्पलेट्स को कैसे ओवरराइड करें

आप जैसे पाठक MUO को समर्थन देने में मदद करते हैं। जब आप हमारी साइट पर लिंक का उपयोग करके खरीदारी करते हैं, तो हम संबद्ध कमीशन कमा सकते हैं। और पढ़ें।

django-allauth एक Django पैकेज है जो आपको अपने Django ऐप्स के लिए जल्दी और आसानी से एक प्रमाणीकरण प्रणाली बनाने की सुविधा देता है। इसमें आपके ऐप के अन्य महत्वपूर्ण हिस्सों पर ध्यान केंद्रित करने के लिए अंतर्निहित टेम्पलेट हैं।

दिन का एमयूओ वीडियो सामग्री जारी रखने के लिए स्क्रॉल करें

हालाँकि बिल्ट-इन टेम्प्लेट सहायक होते हैं, आप उन्हें बदलना चाहेंगे क्योंकि उनमें सर्वोत्तम यूआई नहीं है।

---

---

Django-allauth को कैसे स्थापित और कॉन्फ़िगर करें

कुछ सीधे चरणों का पालन करके, आप अपने Django प्रोजेक्ट में django-allauth को सहजता से इंस्टॉल कर सकते हैं।

1. आप इंस्टॉल कर सकते हैं django-allauth पिप पैकेज मैनेजर का उपयोग करके पैकेज:

    pip install django-allauth 
   

2. अपने प्रोजेक्ट की सेटिंग फ़ाइल में, इन ऐप्स को अपने इंस्टॉल किए गए ऐप्स में जोड़ें:

    INSTALLED_APPS = [ 
    
       """ 
       Add your other apps here 
       """ 
    
       # Djang-allauth configuration apps 
       'django.contrib.sites', 
       'allauth', 
       'allauth.account', 
       'allauth.socialaccount', # add this if you want to enable social authentication 
   ] 
   

3. अपनी सेटिंग फ़ाइल में प्रमाणीकरण बैकएंड जोड़ें:

    AUTHENTICATION_BACKENDS = [ 
       'django.contrib.auth.backends.ModelBackend', 
       'allauth.account.auth_backends.AuthenticationBackend', 
   ] 
   

4. अपने प्रोजेक्ट में एक साइट आईडी जोड़ें:

    SITE_ID = 1 
   

5. django-allauth:

    from django.urls import path, include 
    
   urlpatterns = [ 
       # Djang-allauth url pattern 
       path('accounts/', include('allauth.urls')), 
   ] 
    के लिए URL कॉन्फ़िगर करें

यदि आप उपरोक्त कॉन्फ़िगरेशन सही ढंग से करते हैं, तो नेविगेट करते समय आपको इस तरह का एक टेम्पलेट देखना चाहिए http://127.0.0.1:8000/accounts/signup/ :

आप नेविगेट करके उपलब्ध यूआरएल की सूची देख सकते हैं http://127.0.0.1:8000/accounts/ साथ डिबग = सत्य आपकी सेटिंग फ़ाइल में.

Django-allauth में लॉगिन टेम्पलेट को कैसे ओवरराइड करें

सबसे पहले, आपको अपना कॉन्फिगर करना होगा खाके फ़ोल्डर यदि आपने ऐसा नहीं किया है। अपनी सेटिंग्स फ़ाइल खोलें और नेविगेट करें खाके सूची। इसके अंदर, का पता लगाएं डीआईआरएस सूची बनाएं, और इसे इस प्रकार संशोधित करें:

 'DIRS': [BASE_DIR/'templates'], 

सुनिश्चित करें कि आपके पास एक खाके आपके प्रोजेक्ट की रूट डायरेक्टरी में फ़ोल्डर। आप इन अगले चरणों का पालन करके django-allauth में डिफ़ॉल्ट लॉगिन टेम्पलेट को ओवरराइड कर सकते हैं।

---

---

चरण 1: अपनी टेम्पलेट फ़ाइलें बनाएं

आपके में खाके फ़ोल्डर, नामक एक नया फ़ोल्डर बनाएँ खाता django-allauth से संबंधित टेम्पलेट्स को होल्ड करने के लिए।

पंजीकरण और लॉगिन टेम्पलेट होना चाहिए साइनअप.एचटीएमएल और लॉगिन.एचटीएमएल क्रमश। आप अपना खोलकर सही टेम्प्लेट नाम निर्धारित कर सकते हैं पायथन आभासी वातावरण और नेविगेट कर रहा हूँ लिब > साइट-पैकेज > एलाउथ > टेम्प्लेट > खाता टेम्प्लेट ढूंढने के लिए फ़ोल्डर। टेम्प्लेट कैसे काम करते हैं यह समझने के लिए आपको कोड को पढ़ना चाहिए। उदाहरण के लिए, लॉगिन टेम्पलेट में यह कोड है:

---

---

चरण 2: अपनी टेम्पलेट फ़ाइलों में HTML कोड जोड़ें

अपनी फ़ाइलें बनाने के बाद, आपको अपने टेम्पलेट के लिए कस्टम HTML कोड जोड़ना चाहिए। उदाहरण के लिए, ऊपर दिए गए लॉगिन टेम्पलेट को ओवरराइड करने के लिए, हो सकता है कि आप सब कुछ कॉपी करना चाहें {% अन्य %} ब्लॉक करें, जिसमें फॉर्म और सबमिशन बटन शामिल है, और इसे अपने कस्टम टेम्पलेट में जोड़ें। यहाँ एक उदाहरण है:

 {% extends 'base.html' %} 
{% block content %} 
<p>If you have not created an account yet, then please 
    <a href="{{ signup_url }}">sign up</a> first.</p> 
     
    <form class="login" method="POST" action="{% url 'account_login' %}"> 
      {% csrf_token %} 
      {{ form.as_p }} 
      {% if redirect_field_value %} 
      <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" /> 
      {% endif %} 
      <a class="button secondaryAction" href="{% url 'account_reset_password' %}">Forgot password?</a> 
      <button class="primaryAction" type="submit">SIgn in</button> 
    </form> 
    {% endblock content %} 

उपरोक्त कोड का उपयोग करता है Django का टेम्पलेट इनहेरिटेंस से सुविधाएँ प्राप्त करना आधार.एचटीएमएल टेम्पलेट. सुनिश्चित करें कि आप अनावश्यक टैग हटा दें जैसे कि {% ब्लॉकट्रांस %} टैग। यदि आपने ऐसा किया है, तो आपका लॉगिन पृष्ठ इस जैसा होना चाहिए:

उपरोक्त छवि में शीर्षलेख और पादलेख आपसे भिन्न होंगे।

चरण 3: अपने फ़ॉर्म में कस्टम शैलियाँ जोड़ें

पिछले चरण में, लॉगिन फॉर्म को का उपयोग करके एक पैराग्राफ के रूप में प्रस्तुत किया गया है {{ form.as_p }} टैग। अपने फॉर्म में शैलियाँ जोड़ने के लिए, आपको इसका मूल्य जानना होगा नाम प्रत्येक इनपुट फ़ील्ड से संबद्ध विशेषता.

पूरी वेबसाइट को कैसे सेव करें

आप अपने आवश्यक मान प्राप्त करने के लिए अपने पृष्ठ का निरीक्षण कर सकते हैं।

ऊपर दी गई छवि इससे संबद्ध नाम विशेषता दिखाती है ईमेल प्रपत्र का क्षेत्र.

अब, आप अपने प्रोजेक्ट में फॉर्म फ़ील्ड्स को अलग-अलग जोड़ सकते हैं। उदाहरण के लिए, आप ईमेल फ़ील्ड को इस तरह जोड़ सकते हैं:

 {{ form.login }} 
<label for="{{form.login.id_for_label}}">Email</label> 
{{ form.login.errors|safe }} 

तुम कर सकते हो अपने Django प्रोजेक्ट के साथ बूटस्ट्रैप का उपयोग करें अपने फॉर्म को आसानी से स्टाइल करने के लिए। यहाँ एक उदाहरण है:

 <div class="form-floating form-group"> 
 {{ form.login }} 
 <label for="{{form.login.id_for_label}}">Email</label> 
 {{ form.login.errors|safe }} 
</div> 

उपरोक्त कोड बूटस्ट्रैप फॉर्म क्लासेस को फॉर्म में जोड़ता है। अब, आप अपनी ज़रूरत के अन्य फ़ील्ड जोड़ सकते हैं और उन्हें अपनी पसंद के अनुसार स्टाइल कर सकते हैं। यदि आप स्टाइलिंग के लिए बूटस्ट्रैप का उपयोग करना पसंद नहीं करते हैं, django-crispy-forms आपके फॉर्म को स्टाइल करने का एक विकल्प है . नीचे दिया गया उदाहरण स्टाइलिंग के लिए बूटस्ट्रैप का उपयोग करता है।

 <div class="container d-flex justify-content-center align-items-center vh-100"> 
    <form method="post" class="login" id="signup_form" action="{% url 'account_login' %}"> 
        <div class="text-center mb-4"> 
            <h1 class="h3 mb-3 font-weight-normal">Sign in</h1> 
        </div> 
        {{ form.non_field_errors | safe }} 
        {% csrf_token %} 
        <div class="row g-3"> 
            <div class="col-12"> 
                <div class="form-floating form-group"> 
                    {{ form.login }} 
                    <label for="{{form.login.id_for_label}}">Email</label> 
                    {{ form.login.errors|safe }} 
                </div> 
            </div> 
            <div class="col-12"> 
                <div class="form-floating form-group my-3"> 
                    {{ form.password }} 
                    <label for="{{form.password.id_for_label}}">Password</label> 
                    {{ form.password.errors|safe }} 
                </div> 
            </div> 
            <div class="col-12"> 
                <div class="form-check"> 
                    <label for="{{form.remember.id_for_label}}" class="form-check-label">Remember me</label> 
                    {{ form.remember }} 
                </div> 
            </div> 
            <div class="col-6"> 
                {% if redirect_field_value %} 
                <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" /> 
                {% endif %} 
                <button class="btn btn-primary w-100 py-3 bg-accent" type="submit">Sign in</button> 
                <a class="button secondaryAction text-accent" href="{% url 'account_reset_password' %}">Forgot 
                    Password?</a> 
            </div> 
        </div> 
    </form> 
</div> 

उपरोक्त कोड ब्लॉक निम्न छवि के समान आउटपुट उत्पन्न करेगा:

आप इसे पढ़कर django-allauth में फॉर्म के बारे में अधिक जान सकते हैं आधिकारिक दस्तावेज .

django-allauth में किसी भी टेम्पलेट को ओवरराइड करें

django-allauth में कई डिफ़ॉल्ट टेम्पलेट हैं जिन्हें आप ओवरराइड कर सकते हैं। इस गाइड के चरणों के साथ, आप django-allauth में किसी भी टेम्पलेट को ओवरराइड कर सकते हैं। आपको अपने प्रमाणीकरण सिस्टम को संभालने के लिए इस पैकेज का उपयोग करने पर विचार करना चाहिए, ताकि आप अपने एप्लिकेशन की अन्य महत्वपूर्ण सुविधाओं के निर्माण पर ध्यान केंद्रित कर सकें।