1. Component Guide
  2. Image card
  3. With metadata
Image card example

With metadata

Can be used for links to people pages to indicate payment type

How it looks (preview)

How to call this example

<div class="govuk-!-width-one-third">
  <%= render "govuk_publishing_components/components/image_card", {
  href: "/government/people/",
  image_src: "https://assets.publishing.service.gov.uk/government/uploads/system/uploads/feature/image/62756/s300_courts-of-justice.JPG",
  image_alt: "some meaningful alt text please",
  context: {
    text: "The Rt Hon"
  },
  heading_text: "John Whiskers MP",
  metadata: "Unpaid",
  extra_details: [
    {
      text: "Minister for Cats",
      href: "/government/ministers/"
    }
  ],
  extra_details_no_indent: true
} %>
</div>