Big number example

With nested data attributes

If a href attribute is present, nested_data_attributes will apply to the a containing the number value (see below). If a href is not present, it will apply to the span containing the number value.

For parent level data attributes, use data_attributes which comes from this component having the component wrapper.

Note that the component does not include built in tracking. If this is required consider using the GA4 link tracker.

How it looks (preview)

23 Ministerial departments

How to call this example

<%= render "govuk_publishing_components/components/big_number", {
  number: 23,
  label: "Ministerial departments",
  href: "/government/organisations#ministerial_departments",
  nested_data_attributes: {
    "department-count": true
  }
} %>