Single-part app pages are the hidden gems of SharePoint Online that allow developers to create focused, distraction-free content layouts. By locking the page layout, you ensure a clean, user-friendly environment for specific use cases such as dashboards, applications, or streamlined user experiences.
This blog dives deep into the unique features, configurations, and practical use cases of single-part app pages while providing actionable tips to help you stand out.
Why Use Single-Part App Pages?
Think of single-part app pages as the minimalist’s dream in SharePoint. They eliminate unnecessary noise by hosting only one component—a web part or Microsoft Teams app. Here’s why they matter:
User Experience Focus: Simplifies the interface for end users.
Consistency Across Environments: Ideal for controlled layouts, such as corporate dashboards or KPI trackers.
Cross-Platform Capabilities: Perfect for integrating Microsoft Teams tabs.
Step-by-Step: Adding a Single-Part App Page
- Navigate to Your SharePoint Modern Site:
Open your SharePoint modern site and go to the “Site Pages” library.
- Create a New Page:
Click the New button, and then select Page.
In the page creation menu, choose Single-Part App Page as the layout.
Pro Tip: If you don’t see the option, ensure your web part is configured for app pages in the manifest file.
- Add Your Web Part:
Select the desired web part from the available options.
Configure the web part to match your needs.
Configuring Your Web Part for Single-Part App Pages
For your web part to work seamlessly with single-part app pages, ensure you’ve configured the supportedHosts
parameter in the manifest file:
Developer Insight: Using "TeamsTab" in supportedHosts ensures compatibility with Microsoft Teams tabs, broadening the usability of your web part.
What Makes Single-Part App Pages Special?
Unique Web Part Integration: They transform your web parts into standalone applications or dashboards.
Improved Content Delivery: Perfect for portals or tools that require a distraction-free environment.
Teams Compatibility: Extend the functionality to Microsoft Teams with minimal effort.
After Adding the Web Part: What to Expect
Once your single-part app page is live, the experience is sleek and user-centric. Users see a single, central web part with no additional distractions.
Pro Tips for Maximizing Single-Part App Pages
Use Responsive Web Parts: Ensure your web parts adapt well to different devices, as single-part app pages often appear in Teams or mobile environments.
Test Extensively: Validate your web part configurations in both SharePoint and Teams environments.
Plan for Accessibility: Design your web parts with accessibility in mind to serve a broader audience.