web-dev-qa-db-ja.com

Django-allauthのデフォルトテンプレートをオーバーライドする

私はこのソーシャル登録/サインアップライブラリを使用しました Django allauth 私のプロジェクトに使用しました。デフォルトのテンプレートとフォームをカスタマイズして、ルックアンドフィールを向上させるにはどうすればよいですか？

djangodjango-formsdjango-templatesdjango-formwizarddjango-allauth
27
user993563

githubのall-authの最新バージョンにはテンプレートが外部にありますが、Pypiのテンプレートにはありません。必要なのは、プロジェクトディレクトリにリポジトリのクローンを作成し、テンプレートを上書きすることだけです。それと同じくらい簡単です。

12
whatf

次のようなTEMPLATE_DIRS設定を使用してプロジェクトレベルのテンプレートディレクトリを設定したと仮定します。

TEMPLATE_DIRS = (os.path.join(PROJECT_DIR, 'templates'),)

表示されているすべてのフォルダ ここ をそのディレクトリにコピーし、必要に応じて編集できるはずです。ほとんどのテンプレートは{% block content %}ブロックを埋めているように見えるので、site_base.htmlテンプレートがそのブロックをどこかに定義するのがおそらく最も簡単です。

TEMPLATE_DIRSを設定していない場合も同じことができますが、テンプレートフォルダーをいずれかのアプリのtemplatesディレクトリにコピーします。私はTEMPLATE_DIRSを設定し、base.htmlのようなメインサイトテンプレートをそこに保持することを好みます。なぜなら、それらは実際には特定のアプリに属していないからですが、それは実際には単なる好みです。テンプレートローダーはどちらの方法でもそれらを見つける必要があります。

22
Chris Lawlor

あなたの見解では：

from allauth.account.views import SignupView, LoginView


class MySignupView(SignupView):
    template_name = 'my_signup.html'


class MyLoginView(LoginView):
    template_name = 'my_login.html'

独自のテンプレートを構築するための例とドキュメントに注意を払ってください。

ただし、サンプルテンプレートでこの部分を見てください。

<form id="signup_form" method="post" action="{% url 'account_signup' %}">

自分のテンプレートで正しく機能させるには、URLリンクを削除する必要がありました。

<form id="signup_form" method="post" action="">'
11
Adam Starrh

管理テンプレートのオーバーライド と同じロジックを使用します。

8
Burhan Khalid

example アプリケーションを見てください。必要なテンプレートのレイアウトを示すtemplatesフォルダーがあります

3
Timmy O'Mahony

インストール後にDjango-allauthをカスタマイズするには、site-packagesからコピーして、プロジェクトのアプリディレクトリに貼り付けます。このように、デフォルトのallauthアプリと使用されるそのテンプレートは、プロジェクトのallauthアプリのものになります。次に、signup.html of socialaccountを変更する場合は、apps\allauth\templates\socialaccount\signup.htmlに移動し、次のように変更します。 'ブロックコンテンツ'タグ内の編集：

{% block content %}
    // your customized html for signup form
{% endblock %}

これがお役に立てば幸いです。

2
Zubair Afzal

これらはすべて良い提案です。

これらのほとんどは機能するはずです。

しかし、私にとってうまくいったのは、「project/app/templates/account /」に自分のテンプレートを含め、「Django-allauth」がINSTALLED_APPSの後にリストされることを確認することだけでした。 自分のアプリ。

私はこれを発見しました ここ 。

1
trubliphone