Home-theater-designers
Django-allauth adalah paket Django yang memungkinkan Anda membangun sistem otentikasi untuk aplikasi Django Anda dengan cepat dan mudah. Ini memiliki templat bawaan untuk memungkinkan Anda fokus pada bagian penting lainnya dari aplikasi Anda.
Video MUO hari ini GULIR UNTUK MELANJUTKAN ISI
Meskipun templat bawaannya berguna, Anda sebaiknya mengubahnya karena templat tersebut tidak memiliki UI terbaik.
Cara Memasang dan Mengonfigurasi Django-allauth
Dengan mengikuti beberapa langkah mudah, Anda dapat dengan mudah menginstal Django-allauth ke dalam proyek Django Anda.
- Anda dapat menginstal Django-allauth paket dengan menggunakan manajer paket Pip:
pip install django-allauth - Di file pengaturan proyek Anda, tambahkan aplikasi ini ke aplikasi yang Anda instal:
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
] - Tambahkan backend autentikasi ke file pengaturan Anda:
AUTHENTICATION_BACKENDS = [
'django.contrib.auth.backends.ModelBackend',
'allauth.account.auth_backends.AuthenticationBackend',
] - Tambahkan ID situs ke proyek Anda:
SITE_ID = 1 - Konfigurasikan URL untuk Django-allauth:
from django.urls import path, include
urlpatterns = [
# Djang-allauth url pattern
path('accounts/', include('allauth.urls')),
]
Jika Anda melakukan konfigurasi di atas dengan benar, Anda akan melihat template seperti ini saat Anda menavigasi http://127.0.0.1:8000/accounts/signup/ :
Anda dapat melihat daftar URL yang tersedia dengan menavigasi ke http://127.0.0.1:8000/accounts/ dengan DEBUG=Benar di file pengaturan Anda.
Bagaimana Mengganti Templat Login di Django-allauth
Pertama, Anda perlu mengkonfigurasi templat folder jika Anda belum melakukannya. Buka file pengaturan Anda dan navigasikan ke TEMPLATE daftar. Di dalamnya, temukan DIRS list, dan modifikasi seperti ini:
nintendo switch joy con black friday
'DIRS': [BASE_DIR/'templates'],
Pastikan Anda memiliki templat folder di direktori root proyek Anda. Anda dapat mengganti templat login default di Django-allauth dengan mengikuti langkah berikutnya.
Langkah 1: Buat File Templat Anda
Di dalam kamu templat folder, buat folder baru bernama akun untuk menyimpan templat yang berhubungan dengan Django-allauth.
Templat registrasi dan login seharusnya pendaftaran.html Dan login.html masing-masing. Anda dapat menentukan nama template yang benar dengan membuka Lingkungan virtual Python dan menavigasi ke Lib > paket situs > allauth > templat > akun folder untuk menemukan template. Anda harus mempelajari kode untuk memahami cara kerja templat. Misalnya, templat login memiliki kode ini di dalamnya:
Langkah 2: Tambahkan Kode HTML ke File Template Anda
Setelah membuat file, Anda harus menambahkan kode HTML khusus untuk template Anda. Misalnya, untuk mengganti template login di atas, Anda mungkin ingin menyalin semuanya dari {% kalau tidak %} blok, yang berisi tombol formulir dan pengiriman, dan menambahkannya ke templat khusus Anda. Berikut ini contohnya:
{% 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 %}
Kode di atas menggunakan Warisan cetakan Django untuk mewarisi fitur dari base.html templat. Pastikan Anda menghapus tag yang tidak perlu seperti {% bloktrans %} menandai. Jika Anda sudah melakukan ini, halaman login Anda akan terlihat seperti ini:
Header dan footer pada gambar di atas akan berbeda dengan milik Anda.
layar sentuh hp tidak berfungsi windows 10
Langkah 3: Tambahkan Gaya Kustom ke Formulir Anda
Pada langkah sebelumnya, form login dirender sebagai paragraf menggunakan {{form.as_p }} menandai. Untuk menambahkan gaya ke formulir Anda, Anda perlu mengetahui nilai dari nama atribut yang terkait dengan setiap kolom input.
Anda dapat memeriksa halaman Anda untuk mendapatkan nilai yang Anda butuhkan.
Gambar di atas menunjukkan atribut nama yang terkait dengan surel bidang formulir.
Sekarang, Anda dapat menambahkan kolom formulir satu per satu di proyek Anda. Misalnya, Anda dapat menambahkan kolom email seperti ini:
{{ form.login }}
<label for="{{form.login.id_for_label}}">Email</label>
{{ form.login.errors|safe }}
Kamu bisa gunakan Bootstrap dengan proyek Django Anda untuk menata formulir Anda dengan mudah. Berikut ini contohnya:
<div class="form-floating form-group">
{{ form.login }}
<label for="{{form.login.id_for_label}}">Email</label>
{{ form.login.errors|safe }}
</div>
Kode di atas menambahkan kelas formulir Bootstrap ke formulir. Sekarang, Anda dapat menambahkan bidang lain yang Anda perlukan dan menatanya sesuai keinginan Anda. Jika Anda tidak suka menggunakan Bootstrap untuk penataan gaya, Django-crispy-forms adalah sebuah alternatif untuk menata bentuk Anda . Contoh di bawah ini menggunakan Bootstrap untuk penataan gaya.
cara instal ulang windows 10 dari bios
<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>
Blok kode di atas akan menghasilkan output seperti gambar berikut:
Anda dapat mempelajari lebih lanjut tentang formulir di Django-allauth dengan membaca dokumentasi resmi .
Ganti Templat Apa Pun di Django-allauth
Django-allauth berisi banyak templat bawaan yang dapat Anda timpa. Dengan langkah-langkah dalam panduan ini, Anda dapat mengganti templat apa pun di Django-allauth. Anda harus mempertimbangkan untuk menggunakan paket ini untuk menangani sistem autentikasi Anda, sehingga Anda dapat fokus membangun fitur penting lainnya dari aplikasi Anda.