Guidance for building GOV.UK-aligned Power Pages with the GOV.UK Design System, DfE Frontend and custom components.

Why we built this

Microsoft's out-of-the-box Power Pages features, including entity forms, entity lists, and views, render HTML that we cannot fully control. This means we cannot guarantee accessibility compliance or apply GOV.UK Design System styling consistently.

To meet Government Digital Service (GDS) standards and deliver accessible, user-centred services, we took a different approach. We build completely custom web templates using Liquid, with GOV.UK Frontend styles and our own JavaScript framework for form validation and submission via the Power Pages Web API.

This manual documents that approach. It provides the base portal templates, styling, components, and patterns we've developed to build compliant Power Pages websites for DfE services.

How it works

This guidance assumes you're using the custom base portal available from the website import tool. The base portal includes:

  • GOV.UK Frontend and DfE Frontend styles
  • Base Liquid templates for common page layouts
  • A JavaScript validation framework for custom forms
  • Helper utilities for working with the Power Pages Web API

The components and patterns in this manual are designed to work with this base portal. They won't work with standard Power Pages entity forms or the default Microsoft templates.

What's included

This manual covers:

  • Base portal templates ready to import into your environment
  • GOV.UK Design System styles adapted for Power Pages
  • Custom components for service requirements not covered by the GOV.UK Design System
  • Form validation and submission patterns using the Power Pages Web API
  • CRM helper framework for building custom forms that write to Dynamics 365

Experience required

To use this manual effectively, you should be familiar with:

  • Power Pages and Dynamics 365 fundamentals
  • Creating custom web templates using Liquid
  • HTML, CSS, and JavaScript
  • The Dynamics 365 data model and Web API
Warning Read the getting started section before building your website. It covers prerequisites and how to import the base portal templates.

Explore this section

  • Getting started

    Understand how to get started with building and designing your Power Pages website.

  • Styles

    Understand the design standards and elements that create consistent, accessible Power Pages websites for sector users.

  • Components

    Components are reusable parts of user interface that have been designed to specifically support your build.

  • Patterns

    Explore patterns that solve common design and development challenges when building Power Pages websites.

Get help

If you have questions or need advice on implementing these patterns, contact the Solutions Delivery Team.