Image meta example

Default

How it looks (preview)

Larry the cat
Alt text:
Larry the cat
Caption:
Larry, Chief Mouser to the Cabinet Office
Credit:
His Majesty's Government

How to call this example

<%= render "components/image_with_metadata", {
  src: "https://assets.publishing.service.gov.uk/government/assets/history/buildings/larry-the-cat-a47549e08bdbc6cd0e3e042eea943f65b7a4590d95642586e51acb44bb2dcea2.jpg",
  alt_text: "Larry the cat",
  metadata_items: [
    {
      field: "Alt text",
      value: "Larry the cat"
    },
    {
      field: "Caption",
      value: "Larry, Chief Mouser to the Cabinet Office"
    },
    {
      field: "Credit",
      value: "His Majesty's Government"
    }
  ]
} %>