Package: crispy-forms-gds
AGOV.UK Design Systemtemplate pack fordjango-crispy-forms, for simple and
powerful form generation which is compliant with GDS usability and accessibility
guidelines.Requires Django 3.2 or later and django-crispy-forms 1.9 or later.This template pack supports govuk-frontend 3.5 or later.QuickstartThis is a minimal howto without options or details - see thecrispy-forms-gds documentationfor full
instructions for installation and usage.Install using pip:pip install crispy-forms-gdsAdd to installed apps, with settings to tell django-crispy-forms to use this theme:INSTALLED_APPS = [
  ...
  'crispy_forms',
  'crispy_forms_gds',
]
CRISPY_ALLOWED_TEMPLATE_PACKS = ["gds"]
CRISPY_TEMPLATE_PACK = "gds"Build a regular crispy form using layout objects fromcrispy_forms_gds:from django import forms

from crispy_forms_gds.helper import FormHelper
from crispy_forms_gds.layout import Submit


class SimpleForm(forms.Form):

    name = forms.CharField(
        label="Name",
        help_text="Your full name.",
        widget=forms.TextInput(),
        error_messages={
            "required": "Enter your name as it appears on your passport"
        }
    )

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.helper = FormHelper()
        self.helper.add_input(Submit("submit", "Submit"))Render the form in your templates as normal:{% load crispy_forms_tags %}
{% crispy form %}ExamplesThe template pack supports all the basic components listed in theGOV.UK Design
System. Here are some examples taken from the demo site included in the project.AccordionLayout components, such as theAccordionlet you generate complex forms with
multiple sections:from django import forms

from crispy_forms_gds.helper import FormHelper
from crispy_forms_gds.layout import HTML, Accordion, AccordionSection, Layout


class AccordionForm(forms.Form):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.helper = FormHelper()
        self.helper.layout = Layout(
            Accordion(
                AccordionSection(
                    "Writing well for the web",
                    HTML.p("This is the content for Writing well for the web."),
                    summary="An introduction to clear and concise writing.",
                ),
                AccordionSection(
                    "Writing well for specialists",
                    HTML.p("This is the content for Writing well for specialists."),
                ),
                AccordionSection(
                    "Know your audience",
                    HTML.p("This is the content for Know your audience."),
                ),
                AccordionSection(
                    "How people read",
                    HTML.p("This is the content for How people read."),
                ),
            )
        )Radio ButtonsChoiceFields can be displayed asSelectorRadiocomponents. Radio buttons also support
Design System features such as sizing, hinting and dividers:from django import forms

from crispy_forms_gds.choices import Choice
from crispy_forms_gds.helper import FormHelper
from crispy_forms_gds.layout import Button, Field, Layout, Size


class RadiosForm(forms.Form):

    name = forms.ChoiceField(
        choices=(("yes", "Yes"), ("no", "No")),
        widget=forms.RadioSelect,
        label="Have you changed your name?",
        help_text="This includes changing your last name or spelling your name differently.",
        error_messages={"required": "Enter whether your name has changed"},
    )

    METHODS = (
        Choice("email", "Email", hint="Do not use an email address from work"),
        Choice("phone", "Phone", divider="Or"),
        Choice("text", "Text message"),
    )

    method = forms.ChoiceField(
        choices=METHODS,
        widget=forms.RadioSelect,
        label="How would you like to be contacted?",
        help_text="Select the options that is best for you.",
        error_messages={
            "required": "Select the best way to send a confirmation message"
        },
    )

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.helper = FormHelper()
        self.helper.layout = Layout(
            Field.radios("name", legend_size=Size.MEDIUM, legend_tag="h1", inline=True),
            Field.radios("method", legend_size=Size.MEDIUM, small=True),
            Button("submit", "Submit"),
        )Validation ErrorsForms fully support theError MessageandError Summarycomponents with no
extra effort on your part:from django import forms

from crispy_forms_gds.helper import FormHelper
from crispy_forms_gds.layout import (
    Button,
    Field,
    Fieldset,
    Fixed,
    Fluid,
    Layout,
    Size,
)


class UserForm(forms.Form):

    name = forms.CharField(
        label="Your name",
        help_text="Enter your name as it appears on your passport.",
    )

    email = forms.CharField(
        label="Email",
        help_text="Enter your email address.",
        widget=forms.EmailInput,
    )

    phone = forms.CharField(
        label="Phone",
        help_text="Enter your home or mobile telephone number.",
    )

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.helper = FormHelper()
        self.helper.label_size = Size.SMALL
        self.helper.layout = Layout(
            Fieldset(
                Field.text("name"),
                Field.text("email", field_width=Fluid.TWO_THIRDS),
                Field.text("phone", field_width=Fixed.TEN),
            ),
            Button("submit", "Submit"),
        )DemoIf you checkout the code from the repository, there is a Django site you can run to see
the forms in action:git clone git@github.com:wildfish/crispy-forms-gds.git
cd crispy-forms-gdsFirst, create a virtual environment:python3 -m venv venv
. venv/bin/activate
pip3 install wheel
pip3 install -r requirements/dev.txtNext, install all the dependencies and build the javascript and css assets:cd demo/frontend
nvm use
npm install
npm run devNow, setup and run Django:cd ..
python3 manage.py migrate
python3 manage.py runserverOpenhttp://localhost:8000/in your browser to see forms built withDjango Crispy Formsstyled using theGOV.UK Design System.ResourcesRead the documentation onRead the docsDownload thePyPi packageLearn more aboutDjango Crispy Forms