You can find the content type data model in the Person specification.

Example


Macro


{{ personCard({
  title: "Dr",
  name: "Bobby Smith", 
  initials: "BS",
  pronouns: "They/them",
  jobTitle: "Content Editor",
  department: "National Website Platform",
  organisation: "NHS UK",
  workAddress: {
    line1: "2 Stephenson St",
    line2: "",
    line3: "",
    city: "Birmingham",
    county: "West Midlands",
    postcode: "B1 2SE"
  },
  image: "",
  email: "bobby.smithandthelongestemail@hee.co.uk",
  telephone: "01162344444",
  website: "http://nhs.uk/",
  twitter: "nhsengland",
  linkedIn: "nhs"
}) }}
  

HTML


<div class="hee-card hee-card--person">
    <div class="hee-card__image">
      <div class="hee-card__initials">
        <span>BS</span>
      </div>
    </div>
    <h2 class="hee-card__name" aria-label="Name"> Dr Bobby Smith </h2>
    <span class="hee-card__pronouns">They/them</span>
    <p class="hee-card__department" aria-label="Department">National Website Platform</p>
    <p class="hee-card__organisation" aria-label="Organisation">NHS UK</p>
    <hr>
    <ul class="hee-card__contact">
      <li class="hee-card__telephone" aria-label="Telephone"><a href="tel:01162344444;">01162344444</a></li>
      <li class="hee-card__email" aria-label="Email"><a href="mailto:bobby.smithandthelongestemail@hee.co.uk;">bobby.smithandthelongestemail@hee.co.uk</a></li>
      <li class="hee-card__website" aria-label="Website"><a href="http://nhs.uk/">http://nhs.uk/</a></li>
      <li class="hee-card__twitter" aria-label="Twitter"><a href="https://twitter.com/nhsengland">@nhsengland</a></li>
    </ul>
    <p class="hee-card__address" aria-label="Address">
    </p>
  </div>