Skip to main content

Wagtail NHS.UK frontend

A wagtail implementation of the NHS frontend v10.4.2 standard components.

Installation

Install the pypi package

pip install wagtail-nhsuk-frontend

Add to your INSTALLED_APPS in wagtail settings

INSTALLED_APPS = [
  ...

  'wagtailnhsukfrontend',

  ...
]

Use blocks in your streamfields

from wagtail.admin.panels import FieldPanel
from wagtail.models import Page
from wagtail.fields import StreamField

from wagtailnhsukfrontend.blocks import ActionLinkBlock, WarningCalloutBlock

class HomePage(Page):
  body = StreamField([
      # Include any of the blocks you want to use.
      ('action_link', ActionLinkBlock()),
      ('callout', WarningCalloutBlock()),
  ], use_json_field=True)

  content_panels = Page.content_panels + [
      FieldPanel('body'),
  ]

Use templatetags

{% load nhsukfrontend_tags %}

<html>
...
<body>
  {% breadcrumb %}
</body>
</html>

Use template includes

{% include 'wagtailnhsukfrontend/header.html' with show_search=True %}

See the component documentation for a list of components you can use.

Include the CSS in your base template

  <link rel="stylesheet" type="text/css" href="{% static 'wagtailnhsukfrontend/css/nhsuk-frontend-10.4.2.min.css' %}">

Include the Javascript in your base template

  <script type="text/javascript" src="{% static 'wagtailnhsukfrontend/js/nhsuk-frontend-10.4.2.min.js' %}" defer></script>

Upgrading

If you are upgrading from v0 to v1, see the changelog.

This CSS and JS is taken directly from the nhsuk-frontend library and provided in this package for convenience.

If you have a more complicated frontend build such as compiling your own custom styles, you might want to install from npm instead.

Contributing

See the contributing documentation to run the application locally and contribute changes.

Further reading

See more documentation

Release files for wagtail-nhsuk-frontend 2.1.0

For a detailed explanation of source distributions (sdists) and built distributions (wheels), please see the package formats documentation.

Source distribution (sdist)

Source distribution for wagtail-nhsuk-frontend 2.1.0
File Size Uploaded
wagtail_nhsuk_frontend-2.1.0.tar.gz 92.0 kB Details

Built distribution (wheel)

Table of built distributions (wheels) for wagtail-nhsuk-frontend 2.1.0
File Interpreter ABI Platform
wagtail_nhsuk_frontend-2.1.0-py3-none-any.whl Python 3 none any Details

Total release size: 205.9 kB

Release files / wagtail_nhsuk_frontend-2.1.0.tar.gz

Download URL wagtail_nhsuk_frontend-2.1.0.tar.gz
Size 92.0 kB
Tags Source
SHA-256 checksum
How to use checksums
4fea8d69174b68eacc4cb03e996ce8d2f66045617c57f5e6fb853d576010c0c9
BLAKE2b-256 checksum
How to use checksums
a1b44fbc985c1420f9522861d683575e03e9fa752bccec2c4c308fe36ae023e3
Upload date
Uploaded using Trusted Publishing?
What is trusted publishing?
No
Uploaded via twine/6.2.0 CPython/3.14.4

Release files / wagtail_nhsuk_frontend-2.1.0-py3-none-any.whl

Download URL wagtail_nhsuk_frontend-2.1.0-py3-none-any.whl
Size 113.9 kB
Tags Python 3
SHA-256 checksum
How to use checksums
ec091cdbb660cccde08f9d7bdaba95c2685debdd13caa468a6dcc5f05ff0af1a
BLAKE2b-256 checksum
How to use checksums
cf6ae9915aae9e8febab6cd6c24939a2bb0ad46bef9fbb5564fa617f3b7c109c
Upload date
Uploaded using Trusted Publishing?
What is trusted publishing?
No
Uploaded via twine/6.2.0 CPython/3.14.4

Release history Release notifications | RSS feed

This release

2.1.0 This release

2 release files

2.0.1

2 release files

2.0.0

2 release files

1.5.2

1 release file

1.5.1

1 release file

1.5.0

1 release file

1.4.0

1 release file

1.3.1

1 release file

1.3.0

1 release file

1.2.3

1 release file

1.2.2

1 release file

1.2.1

1 release file

1.2.0

1 release file

1.1.0

1 release file

1.0.0

1 release file

0.8.0

1 release file

0.7.0

1 release file

0.5.0

1 release file

0.4.4

1 release file

0.4.3

1 release file

0.4.2

1 release file

0.4.1

1 release file

0.4.0

1 release file

0.3.0

1 release file

0.2.0

1 release file

0.1.0

1 release file

Anthropic, PBC Visionary sponsor Bloomberg Visionary sponsor Hudson River Trading Visionary sponsor Meta Visionary sponsor NVIDIA Visionary sponsor Microsoft Sustainability sponsor Depot Continuous Integration AWS Cloud computing and Security Sponsor Datadog Monitoring Fastly CDN Google Download Analytics Sentry Error logging StatusPage Status page