Person

A semantic recommendation for HTML used when representing a person.

The Person component is set up for you to harvest schema markup as you see fit to make HTML surrounding people or a person more machine readable. When modifying this component you should feel free to use any HTML that fits the structure and hierarchy of your project, while maintaining any of the schema-related HTML attributes (itemscope, itemtype, itemprop, etc.).

Examples

Usage

<div itemscope itemtype="https://schema.org/Person">

  <h3 itemprop="name">Bill Murray</h3>
  <img src="https://via.placeholder.com/50" itemprop="image" alt="Placeholder image" />

  <p><strong>Title</strong>:
    <span itemprop="jobTitle">Professor</span>
  </p>

  <div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress">
    <p><strong>Address</strong>:
      <span itemprop="streetAddress">35 Broad St</span>,
      <span itemprop="addressLocality">Red Bank</span>,
      <span itemprop="addressRegion"><abbr title="New Jersey">NJ</abbr></span>
      <span itemprop="postalCode">07701</span>
    </p>
  </div><!--/itemtype=PostalAddress-->

  <p>
    <strong>Phone</strong>:
    <a href="tel:+14251235678" itemprop="telephone">(425) 123-4567</a>
  </p>

  <p>
    <strong>Email</strong>:
    <a href="mailto:jane-doe@xyz.edu" itemprop="email">jane-doe@xyz.edu</a>
  </p>

  <p>
    <strong>Website</strong>:
    <a href="http://www.example.com" itemprop="url">janedoe.com</a>
  </p>

  <p>
    <strong>Colleagues</strong>:
    <a href="http://www.xyz.edu/students/alicejones.html" itemprop="colleague">Alice Jones</a>,
    <a href="http://www.xyz.edu/students/bobsmith.html" itemprop="colleague">Bob Smith</a>
  </p>

</div><!--/itemtype=Person-->

          
<div itemscope itemtype="https://schema.org/Person">

  <h3 itemprop="name"><?php echo esc_html('Bill Murray'); ?></h3>
  <img src="<?php echo esc_url( 'https://via.placeholder.com/50' ); ?>" itemprop="image" alt="Placeholder image" />

  <p><strong>Title</strong>:
    <span itemprop="jobTitle"><?php echo esc_html('Professor'); ?></span>
  </p>

  <div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress">
    <p><strong>Address</strong>:
      <span itemprop="streetAddress"><?php echo esc_html('35 Broad St'); ?></span>,
      <span itemprop="addressLocality"><?php echo esc_html('Red Bank'); ?></span>,
      <span itemprop="addressRegion"><abbr title="<?php echo esc_attr( 'New Jersey' ); ?>"><?php echo esc_html('NJ'); ?></abbr></span>
      <span itemprop="postalCode"><?php echo esc_html('07701'); ?></span>
    </p>
  </div><!--/itemtype=PostalAddress-->

  <p>
    <strong>Phone</strong>:
    <a href="<?php echo esc_url( 'tel:+14251235678' ); ?>" itemprop="telephone"><?php echo esc_html('(425) 123-4567'); ?></a>
  </p>

  <p>
    <strong>Email</strong>:
    <a href="<?php echo esc_url( 'mailto:jane-doe@xyz.edu' ); ?>" itemprop="email"><?php echo esc_html('jane-doe@xyz.edu'); ?></a>
  </p>

  <p>
    <strong>Website</strong>:
    <a href="<?php echo esc_url( 'http://www.example.com' ); ?>" itemprop="url"><?php echo esc_html('janedoe.com'); ?></a>
  </p>

  <p>
    <strong>Colleagues</strong>:
    <a href="<?php echo esc_url( 'http://www.xyz.edu/students/alicejones.html' ); ?>" itemprop="colleague"><?php echo esc_html('Alice Jones'); ?></a>,
    <a href="<?php echo esc_url( 'http://www.xyz.edu/students/bobsmith.html' ); ?>" itemprop="colleague"><?php echo esc_html('Bob Smith'); ?></a>
  </p>

</div><!--/itemtype=Person-->

Resources