Transactional journeys
Signup
A finished page under Kiln. Copy it and it is yours outright: unlike a brickwork component or shell, it never upgrades under semver.
Skip to main content
Northwind
Create your account
Free for 30 days. No card needed.
Already have an account? Sign in
By creating an account you agree to our terms of service and privacy policy.
Scroll inside the frame to inspect the full page.
{% extends "brickwork/shell/auth.html" %}
{% comment %}
Create an account.
COPY THIS FILE into your project and edit it. It is not on the template loader
path, so you cannot extend it (ADR-056).
What your view must supply:
form your signup form
As with signin.html, brickwork names no field and ships no view or URL: allauth
uses email/password1/password2, django.contrib.auth's UserCreationForm uses
username, and bw_form renders either without this file knowing the difference.
The URL below is a PLACEHOLDER; replace it with your own.
States: the form's own valid/invalid states (bw_form renders errors
inline).
Accessibility: inherits shell/auth.html's skip link, lang/dir/theme
attributes and themed bare-prose-link colour; the page's own <h1> names
the task; the terms line is plain text near the submit, never a
pre-ticked checkbox. Covered by the archetype harness's full gate sweep
(render, axe WCAG 2.2 AA, no horizontal overflow, light/dark
distinctness, skip-link first-tab-stop with JS disabled) at every W0.1
breakpoint, both themes; unlike auth/signin.html, this archetype has no
additional hand-maintained a11y fixture of its own, only the archetype
harness's coverage.
Responsive: no breakpoint switch of its own; inherits shell/auth.html's
fluid, no-breakpoint centred panel.
{% endcomment %}
{% load brickwork_components brickwork_forms %}
{% block page_title %}Create your account - Northwind{% endblock %}
{% block brand_wordmark %}Northwind{% endblock %}
{% block content %}
<div class="bw-section-stack">
<h1>Create your account</h1>
<p>Free for 30 days. No card needed.</p>
<form method="post" action="/accounts/signup/">
{% csrf_token %}
{% bw_form form %}
<div class="bw-form__actions">
{% bw_button "Create account" type="submit" variant="primary" %}
</div>
</form>
<p>
Already have an account? <a href="/accounts/login/">Sign in</a>
</p>
{% comment %}
Your terms line, if you have one. Keep it as text near the submit rather
than as a pre-ticked checkbox.
{% endcomment %}
<p>
By creating an account you agree to our
<a href="/terms/">terms of service</a> and
<a href="/privacy/">privacy policy</a>.
</p>
</div>
{% endblock %}
Details
| Kind | Page example |
|---|---|
| Used in | Transactional journeys |
Composed from
| Template | Description |
|---|---|
brickwork/components/_button.html |
A button or link styled as a button, in several variants. |
brickwork/forms/_form.html |
Not a catalogue component |
brickwork/shell/auth.html |
The centred single-column shell for login and similar flows. |