Home Page Recipe
Build a complete intranet homepage with featured content, news, favourites, and quick access widgets.
Overview
This recipe creates an intranet homepage with featured spotlight content, favourite sites and documents for quick access, and a theme manager for customization.
Prerequisites
- Bonzai 2 deployed to your tenant (see Installation Guide)
- A Communication Site created
- SharePoint lists created (Site Directory, Documents library)
- Content ready (pages with Showcase column, sites in directory)
Page Layout
Use this structure for your homepage:
Step-by-Step Setup
Create the Home Page
- Go to Site Contents → Site Pages → + New → Page
- Name the page "Home"
- Keep it as a draft until fully configured
Add Section 1: Spotlight Feature
Add a full-width section at the top of the page.
Add web part: Bonzai Spotlight Rollup
| Property | Value |
|---|---|
| Title | Featured Content |
| List | Site Pages |
| Display Template | Card (Grid) |
| Items per page | 3 |
| Items per row | 3 |
| Show promoted items only | On |
| Title Icon | Select Icon |
| Title Icon Name | Lightbulb |
| Chrome Type | None |
Note: With Show promoted items only enabled, the web part auto-discovers a tagging column on the list (it tries Showcase, Featured?, Featured, or PromotedState). Tag the pages you want featured with Spotlight in that column (or set PromotedState ≥ 1). If no tagging column exists, the toggle is ignored and all items render.
Use Full Width layout for maximum visual impact
Add Section 2: Two Columns (66%/33%)
Add a two-column section below the spotlight.
Left Column: Bonzai Favourite Sites
| Property | Value |
|---|---|
| Title | My Sites |
| Site Directory List Name | Site Directory |
| Showcase Column Name | Showcase (default) |
| Showcase Value | Favorite (default) |
| Maximum Sites to Display | 6 |
| Show Site Description | On |
| Show Site Owner | On |
| Title Icon | Select Icon |
| Title Icon Name | FavoriteStar |
| Chrome Type | Title Only |
Add Favourite Documents to Right Column
Right Column: Bonzai Favourite Documents
| Property | Value |
|---|---|
| Title | My Documents |
| Document Library Name | Documents |
| Showcase Column Name | Showcase (default) |
| Showcase Value (e.g., Favorite) | Favorite (default) |
| Maximum items to display | 5 |
| Show file type icon | On |
| Title Icon | Select Icon |
| Title Icon Name | FavoriteStar (default) |
| Chrome Type | Title Only |
Add Section 3: Theme Manager
Add a full-width section at the bottom for the Theme Manager.
| Property | Value |
|---|---|
| Show only in edit mode | On (default) |
| Save theme for all users on this site | On (default) |
Both toggles live in the web part's property pane under Settings. All other customization (colors, Mega Menu / Footer / Slider branding, Navigation Source) is configured directly in the web part's on-page UI in edit mode.
Set as Home Page and Publish
- Save and publish the page
- Go to Site Settings → Change Site Address or set via site navigation
- Set this page as the site home page
Optional: Add Important Messages
Required SharePoint Lists
| List Name | Purpose |
|---|---|
| Site Pages | Source for Spotlight articles (built-in) |
| Site Directory | Sites for Favourite Sites web part |
| Documents | Library for Favourite Documents |
Final Checklist
- ☐ Spotlight Rollup showing promoted Site Pages
- ☐ Favourite Sites displaying entries tagged in the Site Directory list
- ☐ Favourite Documents showing documents tagged in the library
- ☐ Theme Manager available in edit mode (hidden in read mode)
- ☐ Page set as site home page
- ☐ Page is responsive on mobile devices