Page Recipes
People & Directory Recipe
Build a complete people finder with employee directory, team listings, locations, and site directory.
People4 Web Parts1-2 hours (first time)
Overview
This recipe creates a comprehensive people finder page with employee search, team listings, office locations, and site directory.
Page Layout
Section 1: Full Width — Employee Directory
Left (50%) — People Listing
Right (50%) — Locations
Section 3: Full Width — Site Directory
Step-by-Step Setup
1
Create the People & Directory Page
- Go to Site Contents → Site Pages → + New → Page
- Name the page "People & Directory"
- Add to site navigation
2
Add Section 1: Employee Directory
Add a full-width section for the main employee search.
Add web part: Bonzai Employee Directory
| Property | Value |
|---|---|
| Title | Employee Directory |
| Result Source | Local People Results |
| Display Mode | Search Directory |
| Default View (templateName) | Card View |
| Allow View Switching (showViewSwitcher) | On |
| Show Filter Dropdowns (enableFilters) | On |
| Show Sort Dropdown (enableSortDropdown) | On |
| Exclude Non-Employee Accounts (enableStandardExclusions) | On |
| Items Per Page | 28 |
Employee Directory works best in full width for browsing large organizations
3
Add Section 2: Two Columns (50%/50%)
Add a two-column section for team members and locations.
Left Column: Bonzai People Listing
| Property | Value |
|---|---|
| Title | Team Members |
| List Name | Employee Directory |
| Display As | Cards |
| Items Per Page | 6 |
| Show Search | Yes |
| Title Icon | People |
| Chrome Type | Title and Border |
4
Add Locations to Right Column
Right Column: Bonzai Locations
| Property | Value |
|---|---|
| Title | Our Offices |
| List Name | Locations |
| Display As | Cards |
| Show Search | Yes |
| Title Icon | MapPin |
| Chrome Type | Title and Border |
5
Add Section 3: Site Directory
Add a full-width section for the site directory.
Add web part: Bonzai Site Directory
| Property | Value |
|---|---|
| Title | Site Directory |
| Show Search | Yes |
| Show Typeahead | Yes |
| Items Per Page | 10 |
| Show Favourites | Yes |
| Title Icon | SharepointLogo |
| Chrome Type | Title and Border |
6
Create Required Lists
Before the page works fully, create these lists:
- Employee Directory list — for People Listing
- Locations list — for office locations
- Site Directory list — for site listings
7
Publish and Test
- Save and publish the page
- Add to site navigation
- Test employee search and A-Z filtering
- Verify locations and site directory display correctly
Employee Directory vs People Listing
Employee Directory pulls from Azure AD/SharePoint profiles (all users).People Listing pulls from a custom SharePoint list (curated team members). Use both for different purposes.
Required SharePoint Lists
Locations List Schema
| Column | Type | Notes |
|---|---|---|
| Title | Single line of text | Office name |
| Address | Multiple lines of text | Full address |
| Phone | Single line of text | Main phone number |
| Single line of text | Office email | |
| Image | Image | Office photo |
Site Directory List Schema
| Column | Type | Notes |
|---|---|---|
| Title | Single line of text | Site name |
| Description | Multiple lines of text | Site purpose |
| URL | Hyperlink | Link to site |
| Owner | Person | Site owner |
| Image | Image | Site logo/thumbnail |
Final Checklist
- ☐ Employee Directory showing users with photos
- ☐ Search and A-Z filter working
- ☐ People Listing displaying team members
- ☐ Locations showing office cards
- ☐ Site Directory with search and favourites
- ☐ All required lists created with data
- ☐ Page added to navigation