Using WordPress? Every integration here is also available as a plugin. Browse the plugin store →

Released component

Persons

Persons publishes a staff directory on your website from Entra ID, a Microsoft 365 group or a SharePoint list, with photos, job titles and whichever contact details you choose to show.

The component platform is in pre-launch, so Office 365 Persons Display for WordPress is the route open today — the same Microsoft 365 job, delivered as a WordPress plugin. If the web component is what you need, tell us and we will come back to you.

kestrel-legal.example/people
kestrel legal
Corporate team Entra ID group · circular avatars
  • A. MbekiPartner, Corporate
  • R. KowalskiSenior Associate
  • J. TanAssociate
  • L. OkonkwoTrainee
  • H. BrandtPartner, Disputes
  • S. NakamuraOf Counsel
  • E. FerreiraAssociate
  • D. CoyleParalegal
Email, phone and LinkedIn stay off until you switch them on.

A drawing of Persons on a fictional site, in our own tokens rather than a customer’s brand. The released component renders live Microsoft 365 data; this frame shows its arrangement only.

Putting it on the page

What you paste into the page.

Two lines, and neither of them is a build step. Everything the component shows is resolved from the key at request time, so the markup on the page is the last markup anyone writes.

<script src="https://cdn.wpintegrate.com/v1/persons.js"></script>
<wpi-persons embed-key="your-embed-key"></wpi-persons>
Illustrative markup — cdn.wpintegrate.com stands in for the bundle host. The real snippet, carrying your own embed key, comes from the builder.
  1. The script tag

    One bundle for one component. It defines the custom element and does nothing else — no framework, no build step, and no change to how the rest of the page is built.

  2. The element

    An ordinary HTML tag, placed wherever the component should appear — including inside a page builder’s raw-HTML block, a shortcode, or a template partial.

  3. The embed key

    The key resolves to one configured instance — the Microsoft 365 source, the arrangement, the theme, and the domains allowed to render it. Change any of those and the page itself never has to be edited again.

What it does

How it works

The Persons component reads people from your Microsoft 365 directory, from the membership of a group, or from a SharePoint list, and renders them as cards or rows. Card style, photo crop, column count and which fields appear are all builder settings. When the source is a SharePoint list, each standard field is mapped to the column that holds it.

Why it exists

A team page goes stale the day somebody joins or leaves, because it is a hand-maintained copy of information that already exists in the directory. Reading the directory means the page is right whenever the directory is right, and nobody has to remember it.

Element
<wpi-persons>
Reads from
Entra ID directory users, Microsoft 365 group membership, SharePoint lists
Arrangements
5 in the builder
Graph access
managed or proxy — the tenant chooses

Arrangements in the builder

  • Grid — classic cards
  • Grid — photo with text overlay
  • Grid — circular avatars
  • Grid — compact rows
  • List

Where it runs

Anywhere you can paste two lines of HTML

A custom element needs no build step and no framework, so where your site is built is not a question you have to answer before this one.

  • WordPress
  • Webflow
  • Squarespace
  • Shopify
  • Wix
  • Astro
  • Next.js
  • Drupal
  • SharePoint pages
  • Plain HTML

Named as examples of places HTML can be pasted. No partnership is implied and none of these are customers. WordPress is the one that gets more than an embed — the same Microsoft 365 jobs also ship as plugins with a Gutenberg block.

In detail

Everything Persons does.

8 capabilities, every one of them resolved from the embed key rather than written into the page.

  1. Three sources

    The members of a Microsoft 365 group, directory users narrowed by a Graph filter such as a department, or the rows of a SharePoint list you maintain yourself.

  2. Map SharePoint columns to standard fields

    SharePoint addresses columns by their internal name, not the label you see. The builder reads the list’s columns so you pick which one holds the name, job title, biography, email, phone, photo, LinkedIn URL and sort order.

  3. Four card styles

    Classic photo-above-text, a full-bleed photo with the text over a gradient, a centred circular avatar, or a compact row with a small avatar beside the text.

  4. Photo shape and fallbacks

    Circle, square or rounded crops, an optional default image for people who have no photo, and drawn initials when there is neither.

  5. Show only what belongs in public

    Photo, job title, biography, email, phone and LinkedIn are separately switchable, and the contact fields are off by default — so an internal directory and a public team page can come from one source.

  6. Grid or list, two to four columns

    Column count is a setting and collapses on narrow screens. A page size adds a pager for a long directory, or shows everyone at once when set to zero.

  7. Cap what gets fetched

    A maximum-results limit stops a large directory being pulled in full when only one department belongs on the page.

  8. Domain allowlist, GTM and custom CSS

    The embed renders only on domains you list, a Google Tag Manager container id can be attached, and custom CSS covers anything the settings do not.

One of these you can have today.

Office 365 Persons Display for WordPress is on sale in the store now and does this job inside WordPress. The web component is in pre-launch — if that is the delivery you need, tell us and we will come back to you.

Reaching your tenant

Two ways for us to reach Graph. One of them never lets us.

Every tenant runs in one mode or the other, and the choice belongs to your IT rather than to us. It is the reason this works inside organisations that will not delegate Graph access to a vendor.

managed

We hold the credentials

WPIntegrate runs the client-credentials flow for your tenant. Your administrator grants consent once and is not asked again.

proxy

You hold the credentials

You supply a base URL and an API key for your own gateway. We store that key encrypted at rest and never hold a Graph token at all.

Questions

The things people ask before they buy.

If yours is not here, ask it — the answers come back from a person rather than a form.

Where do the people come from?

From Microsoft 365 — the members of a group, users in the directory matched by a Graph filter, or the rows of a SharePoint list you maintain yourself.

Are the photos the ones in Microsoft 365?

Yes, where the person has one. You can supply a default image for people who do not, and initials are drawn when neither exists.

Can we show only one department?

Yes. The directory source accepts a Graph filter, so filtering on department or any other user property produces a page for one team.

Will personal contact details be exposed?

Only the ones you switch on. Email, phone and LinkedIn are off by default, so a public team page shows names, titles and photos unless you decide otherwise.

Does it write anything back to the directory?

No. The component reads. Correcting a job title happens in Microsoft 365 or in the SharePoint list, and the page follows.